diff --git a/app-latest-build/main.js b/app-latest-build/main.js index 423a76c..0956e98 100644 --- a/app-latest-build/main.js +++ b/app-latest-build/main.js @@ -7019,7 +7019,7 @@ class IconListItemComponent { } }, dependencies: [_angular_material_button_toggle__WEBPACK_IMPORTED_MODULE_3__.MatButtonToggleGroup, _angular_material_button_toggle__WEBPACK_IMPORTED_MODULE_3__.MatButtonToggle], - styles: [".content[_ngcontent-%COMP%] {\n display: grid;\n grid-template-rows: auto auto;\n justify-items: center;\n}\n\n.icon[_ngcontent-%COMP%] {\n width: 50px;\n height: 50px;\n}\n\n.name[_ngcontent-%COMP%] {\n word-wrap: anywhere;\n max-height: 75px;\n overflow: hidden;\n padding-bottom: 2px;\n}\n\n.footer[_ngcontent-%COMP%] {\n display: flex;\n justify-content: center;\n}\n.footer[_ngcontent-%COMP%] .mat-button-toggle-label-content {\n font-size: 10pt !important;\n padding: 0 5px !important;\n line-height: inherit !important;\n}\n.footer[_ngcontent-%COMP%] .activeMatButtonActor button {\n background-color: #eedddd;\n}\n.footer[_ngcontent-%COMP%] .activeMatButtonWorkObject button {\n background-color: #a4d7e1;\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8uL3NyYy9hcHAvdG9vbHMvaWNvbi1zZXQtY29uZmlnL3ByZXNlbnRhdGlvbi9pY29uLWxpc3QtaXRlbS9pY29uLWxpc3QtaXRlbS5jb21wb25lbnQuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLGFBQUE7RUFDQSw2QkFBQTtFQUNBLHFCQUFBO0FBQ0Y7O0FBRUE7RUFDRSxXQUFBO0VBQ0EsWUFBQTtBQUNGOztBQUVBO0VBQ0UsbUJBQUE7RUFDQSxnQkFBQTtFQUNBLGdCQUFBO0VBQ0EsbUJBQUE7QUFDRjs7QUFFQTtFQUNFLGFBQUE7RUFDQSx1QkFBQTtBQUNGO0FBQ0U7RUFDRSwwQkFBQTtFQUNBLHlCQUFBO0VBQ0EsK0JBQUE7QUFDSjtBQUVFO0VBQ0UseUJBQUE7QUFBSjtBQUdFO0VBQ0UseUJBQUE7QUFESiIsInNvdXJjZXNDb250ZW50IjpbIi5jb250ZW50IHtcbiAgZGlzcGxheTogZ3JpZDtcbiAgZ3JpZC10ZW1wbGF0ZS1yb3dzOiBhdXRvIGF1dG87XG4gIGp1c3RpZnktaXRlbXM6IGNlbnRlcjtcbn1cblxuLmljb24ge1xuICB3aWR0aDogNTBweDtcbiAgaGVpZ2h0OiA1MHB4O1xufVxuXG4ubmFtZSB7XG4gIHdvcmQtd3JhcDogYW55d2hlcmU7XG4gIG1heC1oZWlnaHQ6IDc1cHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIHBhZGRpbmctYm90dG9tOiAycHg7XG59XG5cbi5mb290ZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuICA6Om5nLWRlZXAubWF0LWJ1dHRvbi10b2dnbGUtbGFiZWwtY29udGVudCB7XG4gICAgZm9udC1zaXplOiAxMHB0ICFpbXBvcnRhbnQ7XG4gICAgcGFkZGluZzogMCA1cHggIWltcG9ydGFudDtcbiAgICBsaW5lLWhlaWdodDogaW5oZXJpdCAhaW1wb3J0YW50O1xuICB9XG5cbiAgOjpuZy1kZWVwLmFjdGl2ZU1hdEJ1dHRvbkFjdG9yIGJ1dHRvbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2VlZGRkZDtcbiAgfVxuXG4gIDo6bmctZGVlcC5hY3RpdmVNYXRCdXR0b25Xb3JrT2JqZWN0IGJ1dHRvbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2E0ZDdlMTtcbiAgfVxufVxuIl0sInNvdXJjZVJvb3QiOiIifQ== */"] + styles: [".content[_ngcontent-%COMP%] {\n display: grid;\n grid-template-rows: auto auto;\n justify-items: center;\n}\n\n.icon[_ngcontent-%COMP%] {\n width: 50px;\n height: 50px;\n}\n\n.name[_ngcontent-%COMP%] {\n word-wrap: anywhere;\n max-height: 75px;\n overflow: hidden;\n padding-bottom: 2px;\n}\n\n.footer[_ngcontent-%COMP%] {\n display: flex;\n justify-content: center;\n}\n.footer[_ngcontent-%COMP%] .mat-button-toggle-label-content {\n font-size: 10pt !important;\n padding: 0 5px !important;\n line-height: inherit !important;\n}\n.footer[_ngcontent-%COMP%] .activeMatButtonActor button {\n background-color: #e1aea4;\n}\n.footer[_ngcontent-%COMP%] .activeMatButtonWorkObject button {\n background-color: #a4d7e1;\n}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndlYnBhY2s6Ly8uL3NyYy9hcHAvdG9vbHMvaWNvbi1zZXQtY29uZmlnL3ByZXNlbnRhdGlvbi9pY29uLWxpc3QtaXRlbS9pY29uLWxpc3QtaXRlbS5jb21wb25lbnQuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLGFBQUE7RUFDQSw2QkFBQTtFQUNBLHFCQUFBO0FBQ0Y7O0FBRUE7RUFDRSxXQUFBO0VBQ0EsWUFBQTtBQUNGOztBQUVBO0VBQ0UsbUJBQUE7RUFDQSxnQkFBQTtFQUNBLGdCQUFBO0VBQ0EsbUJBQUE7QUFDRjs7QUFFQTtFQUNFLGFBQUE7RUFDQSx1QkFBQTtBQUNGO0FBQ0U7RUFDRSwwQkFBQTtFQUNBLHlCQUFBO0VBQ0EsK0JBQUE7QUFDSjtBQUVFO0VBQ0UseUJBQUE7QUFBSjtBQUdFO0VBQ0UseUJBQUE7QUFESiIsInNvdXJjZXNDb250ZW50IjpbIi5jb250ZW50IHtcbiAgZGlzcGxheTogZ3JpZDtcbiAgZ3JpZC10ZW1wbGF0ZS1yb3dzOiBhdXRvIGF1dG87XG4gIGp1c3RpZnktaXRlbXM6IGNlbnRlcjtcbn1cblxuLmljb24ge1xuICB3aWR0aDogNTBweDtcbiAgaGVpZ2h0OiA1MHB4O1xufVxuXG4ubmFtZSB7XG4gIHdvcmQtd3JhcDogYW55d2hlcmU7XG4gIG1heC1oZWlnaHQ6IDc1cHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIHBhZGRpbmctYm90dG9tOiAycHg7XG59XG5cbi5mb290ZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblxuICA6Om5nLWRlZXAubWF0LWJ1dHRvbi10b2dnbGUtbGFiZWwtY29udGVudCB7XG4gICAgZm9udC1zaXplOiAxMHB0ICFpbXBvcnRhbnQ7XG4gICAgcGFkZGluZzogMCA1cHggIWltcG9ydGFudDtcbiAgICBsaW5lLWhlaWdodDogaW5oZXJpdCAhaW1wb3J0YW50O1xuICB9XG5cbiAgOjpuZy1kZWVwLmFjdGl2ZU1hdEJ1dHRvbkFjdG9yIGJ1dHRvbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2UxYWVhNDtcbiAgfVxuXG4gIDo6bmctZGVlcC5hY3RpdmVNYXRCdXR0b25Xb3JrT2JqZWN0IGJ1dHRvbiB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogI2E0ZDdlMTtcbiAgfVxufVxuIl0sInNvdXJjZVJvb3QiOiIifQ== */"] }); } diff --git a/app-latest-build/styles.css b/app-latest-build/styles.css index 14429e1..38b9e6c 100644 --- a/app-latest-build/styles.css +++ b/app-latest-build/styles.css @@ -1764,7 +1764,7 @@ html { } .mat-warn { - --mat-option-selected-state-label-text-color: #e1aea4; + --mat-option-selected-state-label-text-color: #cb796b; --mat-option-label-text-color: rgba(0, 0, 0, 0.87); --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04); --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04); @@ -1809,13 +1809,13 @@ html { } .mat-warn { - --mat-full-pseudo-checkbox-selected-icon-color: #e1aea4; + --mat-full-pseudo-checkbox-selected-icon-color: #cb796b; --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa; --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54); --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa; --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0; --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0; - --mat-minimal-pseudo-checkbox-selected-checkmark-color: #e1aea4; + --mat-minimal-pseudo-checkbox-selected-checkmark-color: #cb796b; --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0; } @@ -1958,8 +1958,8 @@ html { --mdc-linear-progress-track-color: rgba(0, 147, 172, 0.25); } .mat-mdc-progress-bar.mat-warn { - --mdc-linear-progress-active-indicator-color: #e1aea4; - --mdc-linear-progress-track-color: rgba(225, 174, 164, 0.25); + --mdc-linear-progress-active-indicator-color: #cb796b; + --mdc-linear-progress-track-color: rgba(203, 121, 107, 0.25); } html { @@ -1993,16 +1993,16 @@ html { --mdc-filled-text-field-input-text-color: rgba(0, 0, 0, 0.87); --mdc-filled-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38); --mdc-filled-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6); - --mdc-filled-text-field-error-hover-label-text-color: #e1aea4; - --mdc-filled-text-field-error-focus-label-text-color: #e1aea4; - --mdc-filled-text-field-error-label-text-color: #e1aea4; - --mdc-filled-text-field-error-caret-color: #e1aea4; + --mdc-filled-text-field-error-hover-label-text-color: #cb796b; + --mdc-filled-text-field-error-focus-label-text-color: #cb796b; + --mdc-filled-text-field-error-label-text-color: #cb796b; + --mdc-filled-text-field-error-caret-color: #cb796b; --mdc-filled-text-field-active-indicator-color: rgba(0, 0, 0, 0.42); --mdc-filled-text-field-disabled-active-indicator-color: rgba(0, 0, 0, 0.06); --mdc-filled-text-field-hover-active-indicator-color: rgba(0, 0, 0, 0.87); - --mdc-filled-text-field-error-active-indicator-color: #e1aea4; - --mdc-filled-text-field-error-focus-active-indicator-color: #e1aea4; - --mdc-filled-text-field-error-hover-active-indicator-color: #e1aea4; + --mdc-filled-text-field-error-active-indicator-color: #cb796b; + --mdc-filled-text-field-error-focus-active-indicator-color: #cb796b; + --mdc-filled-text-field-error-hover-active-indicator-color: #cb796b; --mdc-outlined-text-field-caret-color: #a4d7e1; --mdc-outlined-text-field-focus-outline-color: #a4d7e1; --mdc-outlined-text-field-focus-label-text-color: rgba(164, 215, 225, 0.87); @@ -2012,20 +2012,20 @@ html { --mdc-outlined-text-field-input-text-color: rgba(0, 0, 0, 0.87); --mdc-outlined-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38); --mdc-outlined-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6); - --mdc-outlined-text-field-error-caret-color: #e1aea4; - --mdc-outlined-text-field-error-focus-label-text-color: #e1aea4; - --mdc-outlined-text-field-error-label-text-color: #e1aea4; - --mdc-outlined-text-field-error-hover-label-text-color: #e1aea4; + --mdc-outlined-text-field-error-caret-color: #cb796b; + --mdc-outlined-text-field-error-focus-label-text-color: #cb796b; + --mdc-outlined-text-field-error-label-text-color: #cb796b; + --mdc-outlined-text-field-error-hover-label-text-color: #cb796b; --mdc-outlined-text-field-outline-color: rgba(0, 0, 0, 0.38); --mdc-outlined-text-field-disabled-outline-color: rgba(0, 0, 0, 0.06); --mdc-outlined-text-field-hover-outline-color: rgba(0, 0, 0, 0.87); - --mdc-outlined-text-field-error-focus-outline-color: #e1aea4; - --mdc-outlined-text-field-error-hover-outline-color: #e1aea4; - --mdc-outlined-text-field-error-outline-color: #e1aea4; + --mdc-outlined-text-field-error-focus-outline-color: #cb796b; + --mdc-outlined-text-field-error-hover-outline-color: #cb796b; + --mdc-outlined-text-field-error-outline-color: #cb796b; --mat-form-field-focus-select-arrow-color: rgba(164, 215, 225, 0.87); --mat-form-field-disabled-input-text-placeholder-color: rgba(0, 0, 0, 0.38); --mat-form-field-state-layer-color: rgba(0, 0, 0, 0.87); - --mat-form-field-error-text-color: #e1aea4; + --mat-form-field-error-text-color: #cb796b; --mat-form-field-select-option-text-color: inherit; --mat-form-field-select-disabled-option-text-color: GrayText; --mat-form-field-leading-icon-color: unset; @@ -2052,13 +2052,13 @@ html { } .mat-mdc-form-field.mat-warn { - --mdc-filled-text-field-caret-color: #e1aea4; - --mdc-filled-text-field-focus-active-indicator-color: #e1aea4; - --mdc-filled-text-field-focus-label-text-color: rgba(225, 174, 164, 0.87); - --mdc-outlined-text-field-caret-color: #e1aea4; - --mdc-outlined-text-field-focus-outline-color: #e1aea4; - --mdc-outlined-text-field-focus-label-text-color: rgba(225, 174, 164, 0.87); - --mat-form-field-focus-select-arrow-color: rgba(225, 174, 164, 0.87); + --mdc-filled-text-field-caret-color: #cb796b; + --mdc-filled-text-field-focus-active-indicator-color: #cb796b; + --mdc-filled-text-field-focus-label-text-color: rgba(203, 121, 107, 0.87); + --mdc-outlined-text-field-caret-color: #cb796b; + --mdc-outlined-text-field-focus-outline-color: #cb796b; + --mdc-outlined-text-field-focus-label-text-color: rgba(203, 121, 107, 0.87); + --mat-form-field-focus-select-arrow-color: rgba(203, 121, 107, 0.87); } html { @@ -2081,7 +2081,7 @@ html { --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54); --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38); --mat-select-focused-arrow-color: rgba(164, 215, 225, 0.87); - --mat-select-invalid-arrow-color: rgba(225, 174, 164, 0.87); + --mat-select-invalid-arrow-color: rgba(203, 121, 107, 0.87); } html .mat-mdc-form-field.mat-accent { --mat-select-panel-background-color: white; @@ -2091,7 +2091,7 @@ html .mat-mdc-form-field.mat-accent { --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54); --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38); --mat-select-focused-arrow-color: rgba(0, 147, 172, 0.87); - --mat-select-invalid-arrow-color: rgba(225, 174, 164, 0.87); + --mat-select-invalid-arrow-color: rgba(203, 121, 107, 0.87); } html .mat-mdc-form-field.mat-warn { --mat-select-panel-background-color: white; @@ -2100,8 +2100,8 @@ html .mat-mdc-form-field.mat-warn { --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6); --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54); --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38); - --mat-select-focused-arrow-color: rgba(225, 174, 164, 0.87); - --mat-select-invalid-arrow-color: rgba(225, 174, 164, 0.87); + --mat-select-focused-arrow-color: rgba(203, 121, 107, 0.87); + --mat-select-invalid-arrow-color: rgba(203, 121, 107, 0.87); } html { @@ -2231,10 +2231,10 @@ html { } .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn { --mdc-chip-disabled-label-text-color: black; - --mdc-chip-elevated-container-color: #e1aea4; - --mdc-chip-elevated-selected-container-color: #e1aea4; - --mdc-chip-elevated-disabled-container-color: #e1aea4; - --mdc-chip-flat-disabled-selected-container-color: #e1aea4; + --mdc-chip-elevated-container-color: #cb796b; + --mdc-chip-elevated-selected-container-color: #cb796b; + --mdc-chip-elevated-disabled-container-color: #cb796b; + --mdc-chip-flat-disabled-selected-container-color: #cb796b; --mdc-chip-focus-state-layer-color: black; --mdc-chip-hover-state-layer-color: black; --mdc-chip-selected-hover-state-layer-color: black; @@ -2411,12 +2411,12 @@ html { --mdc-radio-unselected-hover-icon-color: #212121; --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54); --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54); - --mdc-radio-selected-focus-icon-color: #e1aea4; - --mdc-radio-selected-hover-icon-color: #e1aea4; - --mdc-radio-selected-icon-color: #e1aea4; - --mdc-radio-selected-pressed-icon-color: #e1aea4; + --mdc-radio-selected-focus-icon-color: #cb796b; + --mdc-radio-selected-hover-icon-color: #cb796b; + --mdc-radio-selected-icon-color: #cb796b; + --mdc-radio-selected-pressed-icon-color: #cb796b; --mat-radio-ripple-color: black; - --mat-radio-checked-ripple-color: #e1aea4; + --mat-radio-checked-ripple-color: #cb796b; --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38); } @@ -2481,15 +2481,15 @@ html .mat-accent { --mdc-slider-with-tick-marks-active-container-color: white; } html .mat-warn { - --mat-slider-ripple-color: #e1aea4; - --mat-slider-hover-state-layer-color: rgba(225, 174, 164, 0.05); - --mat-slider-focus-state-layer-color: rgba(225, 174, 164, 0.2); - --mdc-slider-handle-color: #e1aea4; - --mdc-slider-focus-handle-color: #e1aea4; - --mdc-slider-hover-handle-color: #e1aea4; - --mdc-slider-active-track-color: #e1aea4; - --mdc-slider-inactive-track-color: #e1aea4; - --mdc-slider-with-tick-marks-inactive-container-color: #e1aea4; + --mat-slider-ripple-color: #cb796b; + --mat-slider-hover-state-layer-color: rgba(203, 121, 107, 0.05); + --mat-slider-focus-state-layer-color: rgba(203, 121, 107, 0.2); + --mdc-slider-handle-color: #cb796b; + --mdc-slider-focus-handle-color: #cb796b; + --mdc-slider-hover-handle-color: #cb796b; + --mdc-slider-active-track-color: #cb796b; + --mdc-slider-inactive-track-color: #cb796b; + --mdc-slider-with-tick-marks-inactive-container-color: #cb796b; --mdc-slider-with-tick-marks-active-container-color: black; } @@ -2585,10 +2585,10 @@ html { --mdc-radio-unselected-hover-icon-color: #212121; --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54); --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54); - --mdc-radio-selected-focus-icon-color: #e1aea4; - --mdc-radio-selected-hover-icon-color: #e1aea4; - --mdc-radio-selected-icon-color: #e1aea4; - --mdc-radio-selected-pressed-icon-color: #e1aea4; + --mdc-radio-selected-focus-icon-color: #cb796b; + --mdc-radio-selected-hover-icon-color: #cb796b; + --mdc-radio-selected-icon-color: #cb796b; + --mdc-radio-selected-pressed-icon-color: #cb796b; } .mat-mdc-list-option { @@ -2635,17 +2635,17 @@ html { --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38); --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38); --mdc-checkbox-selected-checkmark-color: black; - --mdc-checkbox-selected-focus-icon-color: #e1aea4; - --mdc-checkbox-selected-hover-icon-color: #e1aea4; - --mdc-checkbox-selected-icon-color: #e1aea4; - --mdc-checkbox-selected-pressed-icon-color: #e1aea4; + --mdc-checkbox-selected-focus-icon-color: #cb796b; + --mdc-checkbox-selected-hover-icon-color: #cb796b; + --mdc-checkbox-selected-icon-color: #cb796b; + --mdc-checkbox-selected-pressed-icon-color: #cb796b; --mdc-checkbox-unselected-focus-icon-color: #212121; --mdc-checkbox-unselected-hover-icon-color: #212121; --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54); --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54); - --mdc-checkbox-selected-focus-state-layer-color: #e1aea4; - --mdc-checkbox-selected-hover-state-layer-color: #e1aea4; - --mdc-checkbox-selected-pressed-state-layer-color: #e1aea4; + --mdc-checkbox-selected-focus-state-layer-color: #cb796b; + --mdc-checkbox-selected-hover-state-layer-color: #cb796b; + --mdc-checkbox-selected-pressed-state-layer-color: #cb796b; --mdc-checkbox-unselected-focus-state-layer-color: black; --mdc-checkbox-unselected-hover-state-layer-color: black; --mdc-checkbox-unselected-pressed-state-layer-color: black; @@ -2738,19 +2738,19 @@ html { --mat-tab-header-active-hover-indicator-color: #0093ac; } .mat-mdc-tab-group.mat-warn, .mat-mdc-tab-nav-bar.mat-warn { - --mdc-tab-indicator-active-indicator-color: #e1aea4; + --mdc-tab-indicator-active-indicator-color: #cb796b; --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38); --mat-tab-header-pagination-icon-color: black; --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6); - --mat-tab-header-active-label-text-color: #e1aea4; - --mat-tab-header-active-ripple-color: #e1aea4; - --mat-tab-header-inactive-ripple-color: #e1aea4; + --mat-tab-header-active-label-text-color: #cb796b; + --mat-tab-header-active-ripple-color: #cb796b; + --mat-tab-header-inactive-ripple-color: #cb796b; --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6); --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6); - --mat-tab-header-active-focus-label-text-color: #e1aea4; - --mat-tab-header-active-hover-label-text-color: #e1aea4; - --mat-tab-header-active-focus-indicator-color: #e1aea4; - --mat-tab-header-active-hover-indicator-color: #e1aea4; + --mat-tab-header-active-focus-label-text-color: #cb796b; + --mat-tab-header-active-hover-label-text-color: #cb796b; + --mat-tab-header-active-focus-indicator-color: #cb796b; + --mat-tab-header-active-hover-indicator-color: #cb796b; } .mat-mdc-tab-group.mat-background-primary, .mat-mdc-tab-nav-bar.mat-background-primary { --mat-tab-header-with-background-background-color: #a4d7e1; @@ -2761,7 +2761,7 @@ html { --mat-tab-header-with-background-foreground-color: white; } .mat-mdc-tab-group.mat-background-warn, .mat-mdc-tab-nav-bar.mat-background-warn { - --mat-tab-header-with-background-background-color: #e1aea4; + --mat-tab-header-with-background-background-color: #cb796b; --mat-tab-header-with-background-foreground-color: black; } @@ -2826,17 +2826,17 @@ html { --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38); --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38); --mdc-checkbox-selected-checkmark-color: black; - --mdc-checkbox-selected-focus-icon-color: #e1aea4; - --mdc-checkbox-selected-hover-icon-color: #e1aea4; - --mdc-checkbox-selected-icon-color: #e1aea4; - --mdc-checkbox-selected-pressed-icon-color: #e1aea4; + --mdc-checkbox-selected-focus-icon-color: #cb796b; + --mdc-checkbox-selected-hover-icon-color: #cb796b; + --mdc-checkbox-selected-icon-color: #cb796b; + --mdc-checkbox-selected-pressed-icon-color: #cb796b; --mdc-checkbox-unselected-focus-icon-color: #212121; --mdc-checkbox-unselected-hover-icon-color: #212121; --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54); --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54); - --mdc-checkbox-selected-focus-state-layer-color: #e1aea4; - --mdc-checkbox-selected-hover-state-layer-color: #e1aea4; - --mdc-checkbox-selected-pressed-state-layer-color: #e1aea4; + --mdc-checkbox-selected-focus-state-layer-color: #cb796b; + --mdc-checkbox-selected-hover-state-layer-color: #cb796b; + --mdc-checkbox-selected-pressed-state-layer-color: #cb796b; --mdc-checkbox-unselected-focus-state-layer-color: black; --mdc-checkbox-unselected-hover-state-layer-color: black; --mdc-checkbox-unselected-pressed-state-layer-color: black; @@ -2930,9 +2930,9 @@ html { --mat-text-button-ripple-color: rgba(0, 147, 172, 0.1); } .mat-mdc-button.mat-warn { - --mdc-text-button-label-text-color: #e1aea4; - --mat-text-button-state-layer-color: #e1aea4; - --mat-text-button-ripple-color: rgba(225, 174, 164, 0.1); + --mdc-text-button-label-text-color: #cb796b; + --mat-text-button-state-layer-color: #cb796b; + --mat-text-button-ripple-color: rgba(203, 121, 107, 0.1); } .mat-mdc-unelevated-button.mat-primary { @@ -2948,7 +2948,7 @@ html { --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1); } .mat-mdc-unelevated-button.mat-warn { - --mdc-filled-button-container-color: #e1aea4; + --mdc-filled-button-container-color: #cb796b; --mdc-filled-button-label-text-color: black; --mat-filled-button-state-layer-color: black; --mat-filled-button-ripple-color: rgba(0, 0, 0, 0.1); @@ -2967,7 +2967,7 @@ html { --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1); } .mat-mdc-raised-button.mat-warn { - --mdc-protected-button-container-color: #e1aea4; + --mdc-protected-button-container-color: #cb796b; --mdc-protected-button-label-text-color: black; --mat-protected-button-state-layer-color: black; --mat-protected-button-ripple-color: rgba(0, 0, 0, 0.1); @@ -2986,10 +2986,10 @@ html { --mat-outlined-button-ripple-color: rgba(0, 147, 172, 0.1); } .mat-mdc-outlined-button.mat-warn { - --mdc-outlined-button-label-text-color: #e1aea4; + --mdc-outlined-button-label-text-color: #cb796b; --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12); - --mat-outlined-button-state-layer-color: #e1aea4; - --mat-outlined-button-ripple-color: rgba(225, 174, 164, 0.1); + --mat-outlined-button-state-layer-color: #cb796b; + --mat-outlined-button-ripple-color: rgba(203, 121, 107, 0.1); } html { @@ -3028,9 +3028,9 @@ html .mat-mdc-icon-button.mat-accent { --mat-icon-button-ripple-color: rgba(0, 147, 172, 0.1); } html .mat-mdc-icon-button.mat-warn { - --mdc-icon-button-icon-color: #e1aea4; - --mat-icon-button-state-layer-color: #e1aea4; - --mat-icon-button-ripple-color: rgba(225, 174, 164, 0.1); + --mdc-icon-button-icon-color: #cb796b; + --mat-icon-button-state-layer-color: #cb796b; + --mat-icon-button-ripple-color: rgba(203, 121, 107, 0.1); } html { @@ -3103,7 +3103,7 @@ html .mat-mdc-fab.mat-accent { --mat-fab-ripple-color: rgba(255, 255, 255, 0.1); } html .mat-mdc-fab.mat-warn { - --mdc-fab-container-color: #e1aea4; + --mdc-fab-container-color: #cb796b; --mat-fab-foreground-color: black; --mat-fab-state-layer-color: black; --mat-fab-ripple-color: rgba(0, 0, 0, 0.1); @@ -3121,7 +3121,7 @@ html .mat-mdc-mini-fab.mat-accent { --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1); } html .mat-mdc-mini-fab.mat-warn { - --mdc-fab-small-container-color: #e1aea4; + --mdc-fab-small-container-color: #cb796b; --mat-fab-small-foreground-color: black; --mat-fab-small-state-layer-color: black; --mat-fab-small-ripple-color: rgba(0, 0, 0, 0.1); @@ -3171,7 +3171,7 @@ html .mat-accent { --mdc-circular-progress-active-indicator-color: #0093ac; } html .mat-warn { - --mdc-circular-progress-active-indicator-color: #e1aea4; + --mdc-circular-progress-active-indicator-color: #cb796b; } html { @@ -3206,7 +3206,7 @@ html { } .mat-badge-warn { - --mat-badge-background-color: #e1aea4; + --mat-badge-background-color: #cb796b; --mat-badge-text-color: black; } @@ -3305,12 +3305,12 @@ html { } .mat-datepicker-content.mat-warn { --mat-datepicker-calendar-date-selected-state-text-color: black; - --mat-datepicker-calendar-date-selected-state-background-color: #e1aea4; - --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(225, 174, 164, 0.4); + --mat-datepicker-calendar-date-selected-state-background-color: #cb796b; + --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(203, 121, 107, 0.4); --mat-datepicker-calendar-date-today-selected-state-outline-color: black; - --mat-datepicker-calendar-date-focus-state-background-color: rgba(225, 174, 164, 0.3); - --mat-datepicker-calendar-date-hover-state-background-color: rgba(225, 174, 164, 0.3); - --mat-datepicker-calendar-date-in-range-state-background-color: rgba(225, 174, 164, 0.2); + --mat-datepicker-calendar-date-focus-state-background-color: rgba(203, 121, 107, 0.3); + --mat-datepicker-calendar-date-hover-state-background-color: rgba(203, 121, 107, 0.3); + --mat-datepicker-calendar-date-in-range-state-background-color: rgba(203, 121, 107, 0.2); --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2); --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5; --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: #46a35e; @@ -3320,7 +3320,7 @@ html { --mat-datepicker-toggle-active-state-icon-color: #0093ac; } .mat-datepicker-toggle-active.mat-warn { - --mat-datepicker-toggle-active-state-icon-color: #e1aea4; + --mat-datepicker-toggle-active-state-icon-color: #cb796b; } .mat-calendar-controls { @@ -3375,7 +3375,7 @@ html { --mat-icon-color: #0093ac; } .mat-icon.mat-warn { - --mat-icon-color: #e1aea4; + --mat-icon-color: #cb796b; } html { @@ -3408,9 +3408,9 @@ html { --mat-stepper-header-label-text-color: rgba(0, 0, 0, 0.54); --mat-stepper-header-optional-label-text-color: rgba(0, 0, 0, 0.54); --mat-stepper-header-selected-state-label-text-color: rgba(0, 0, 0, 0.87); - --mat-stepper-header-error-state-label-text-color: #e1aea4; + --mat-stepper-header-error-state-label-text-color: #cb796b; --mat-stepper-header-icon-background-color: rgba(0, 0, 0, 0.54); - --mat-stepper-header-error-state-icon-foreground-color: #e1aea4; + --mat-stepper-header-error-state-icon-foreground-color: #cb796b; --mat-stepper-header-error-state-icon-background-color: transparent; } html .mat-step-header.mat-accent { @@ -3424,11 +3424,11 @@ html .mat-step-header.mat-accent { } html .mat-step-header.mat-warn { --mat-stepper-header-icon-foreground-color: black; - --mat-stepper-header-selected-state-icon-background-color: #e1aea4; + --mat-stepper-header-selected-state-icon-background-color: #cb796b; --mat-stepper-header-selected-state-icon-foreground-color: black; - --mat-stepper-header-done-state-icon-background-color: #e1aea4; + --mat-stepper-header-done-state-icon-background-color: #cb796b; --mat-stepper-header-done-state-icon-foreground-color: black; - --mat-stepper-header-edit-state-icon-background-color: #e1aea4; + --mat-stepper-header-edit-state-icon-background-color: #cb796b; --mat-stepper-header-edit-state-icon-foreground-color: black; } @@ -3454,7 +3454,7 @@ html { --mat-toolbar-container-text-color: white; } .mat-toolbar.mat-warn { - --mat-toolbar-container-background-color: #e1aea4; + --mat-toolbar-container-background-color: #cb796b; --mat-toolbar-container-text-color: black; } @@ -3793,7 +3793,7 @@ mat-dialog-actions.mdc-dialog__actions { * snapping */ .djs-snap-line { - stroke: #eedddd; + stroke: #e1aea4; } .djs-palette .entry:hover { diff --git a/app-latest-build/styles.css.map b/app-latest-build/styles.css.map index 3bdf3dd..178265a 100644 --- a/app-latest-build/styles.css.map +++ b/app-latest-build/styles.css.map @@ -1 +1 @@ -{"version":3,"file":"styles.css","mappings":"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EC6DA;EAAA;ACwnBJ;;AkBnpBM;EnB2BF;AC4nBJ;;AkBvpBM;EnB2BF;ACgoBJ;;AkB3pBM;EnB2BF;ACooBJ;;AkB/pBM;EnB2BF;ACwoBJ;;AkBnqBM;EnB2BF;AC4oBJ;;AkBvqBM;EnB2BF;ACgpBJ;;AkB3qBM;EnB2BF;ACopBJ;;AkB/qBM;EnB2BF;ACwpBJ;;AkBnrBM;EnB2BF;AC4pBJ;;AkBvrBM;EnB2BF;ACgqBJ;;AkB3rBM;EnB2BF;ACoqBJ;;AkB/rBM;EnB2BF;ACwqBJ;;AkBnsBM;EnB2BF;AC4qBJ;;AkBvsBM;EnB2BF;ACgrBJ;;AkB3sBM;EnB2BF;ACorBJ;;AkB/sBM;EnB2BF;ACwrBJ;;AkBntBM;EnB2BF;AC4rBJ;;AkBvtBM;EnB2BF;ACgsBJ;;AkB3tBM;EnB2BF;ACosBJ;;AkB/tBM;EnB2BF;ACwsBJ;;AkBnuBM;EnB2BF;AC4sBJ;;AkBvuBM;EnB2BF;ACgtBJ;;AkB3uBM;EnB2BF;ACotBJ;;AkB/uBM;EnB2BF;ACwtBJ;;AkBnvBM;EnB2BF;AC4tBJ;;AkB9uBI;EACE;AlBivBN;;AF7xBI;EC6DA;EAAA;EAAA;ACsuBJ;;AFnyBI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+uBJ;;AF5yBI;EC6DA;EAAA;EAAA;ACqvBJ;;AmB7xBI;EpBwCA;EAAA;AC0vBJ;AmB/xBM;EpBqCF;EAAA;AC8vBJ;AmB/xBM;EpBiCF;EAAA;ACkwBJ;;AF/zBI;EC6DA;EAAA;ACuwBJ;;AFp0BI;EC6DA;EAAA;AC4wBJ;;AFz0BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACqxBJ;;AFl1BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACi1BJ;;AoB12BI;ErByBA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC21BJ;;AoB32BI;ErBgBA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACq2BJ;;AFl6BI;EC6DA;EAAA;EAAA;EAAA;EAAA;AC62BJ;;AF16BI;EC6DA;ACi3BJ;;AF96BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC43BJ;AqBp6BM;EtBwCF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACs4BJ;AqBz6BM;EtBmCF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACg5BJ;;AF78BI;EC6DA;ACo5BJ;;AFj9BI;EC6DA;EAAA;ACy5BJ;;AFt9BI;EC6DA;AC65BJ;;AF19BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC26BJ;;AFx+BI;EC6DA;EAAA;EAAA;ACi7BJ;;AG7+BI;EJ4DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC28BJ;;AGr/BI;EJ0CA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACk+BJ;AGpgCQ;EJkCJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACw/BJ;AGnhCQ;EJ2BJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC8gCJ;AGliCQ;EJoBJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACoiCJ;;AGnhCI;EJjBA;ACwiCJ;;AFrmCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACilCJ;;AF9oCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EK7BA;AJopCJ;AI9oCI;ELuBA;AC0nCJ;AI7oCQ;ELmBJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACuoCJ;AIrpCQ;ELcJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACopCJ;;AFjtCI;EC6DA;ACwpCJ;;AFrtCI;EC6DA;EAAA;EAAA;AC8pCJ;;AKtsCI;ENwCA;ACkqCJ;AKvsCM;ENqCF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACgrCJ;AK/sCM;EN+BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC8rCJ;AKvtCM;ENyBF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC4sCJ;;AFzwCI;EC6DA;EAAA;ACitCJ;;AF9wCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACuuCJ;;AFpyCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC6vCJ;AsBpxCI;EvBuBA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACywCJ;AsBvxCM;EvBcF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACqxCJ;;AFl1CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACiyCJ;;AF91CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;AC0yCJ;;AFv2CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC4zCJ;;AFz3CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACg1CJ;;AMj3CI;;EPiCA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC61CJ;;AMx3CM;;EP2BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC02CJ;;AM93CM;;EPoBF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACu3CJ;;AMr4CI;EPcA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC24CJ;;AMt5CI;EPWA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+5CJ;;AMv6CI;EPQA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACm7CJ;;AuBztBE;;ExB1tBE;ACw7CJ;AuB/CI;;ExBz4CA;AC47CJ;;AMr7CM;;;EAGE;ANw7CR;;AF//CI;EC6DA;EAAA;EAAA;EAAA;EAAA;AC08CJ;;AM36CI;;EP/BA;AC+8CJ;;AMp6CQ;EACE;ANu6CV;AM75CQ;EACE;AN+5CV;;AFnhDI;EC6DA;EAAA;EAAA;EAAA;AC69CJ;;AF1hDI;EC6DA;EAAA;EAAA;ACm+CJ;;AFhiDI;EC6DA;EAAA;EAAA;EAAA;EAAA;AC2+CJ;;AO7gDI;ERkCA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC2/CJ;AO1hDM;ER+BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC0gDJ;AOriDM;ER2BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACyhDJ;AOhjDM;ERuBF;EAAA;AC6hDJ;AOhjDM;ERmBF;EAAA;ACiiDJ;AOhjDM;EReF;EAAA;ACqiDJ;;AOpgDI;ERjCA;ACyiDJ;;AFtmDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACmjDJ;;AFhnDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACwkDJ;;AQ1mDI;ETkCA;AC4kDJ;AQ3mDM;ET+BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+lDJ;AQ1nDM;ET2BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACknDJ;;AF/qDI;EC6DA;EAAA;ACunDJ;;AFprDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACgpDJ;;AF7sDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+rDJ;;AwB7mDM;EzBlFF;EAAA;EAAA;ACqsDJ;AwB/mDM;EzBtFF;EAAA;EAAA;AC0sDJ;AwBhnDM;EzB1FF;EAAA;EAAA;AC+sDJ;;AwB/mDM;EzBhGF;EAAA;EAAA;EAAA;ACstDJ;AwBlnDM;EzBpGF;EAAA;EAAA;EAAA;AC4tDJ;AwBpnDM;EzBxGF;EAAA;EAAA;EAAA;ACkuDJ;;AwBpnDM;EzB9GF;EAAA;EAAA;EAAA;ACyuDJ;AwBvnDM;EzBlHF;EAAA;EAAA;EAAA;AC+uDJ;AwBznDM;EzBtHF;EAAA;EAAA;EAAA;ACqvDJ;;AwBznDM;EzB5HF;EAAA;EAAA;EAAA;AC4vDJ;AwB5nDM;EzBhIF;EAAA;EAAA;EAAA;ACkwDJ;AwB9nDM;EzBpIF;EAAA;EAAA;EAAA;ACwwDJ;;AFr0DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACmxDJ;;AFh1DI;EC6DA;ACuxDJ;;AFp1DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACkyDJ;AyB/zDQ;E1B6BJ;EAAA;EAAA;ACuyDJ;AyBh0DQ;E1ByBJ;EAAA;EAAA;AC4yDJ;AyBj0DQ;E1BqBJ;EAAA;EAAA;ACizDJ;;AF92DI;EC6DA;ACqzDJ;;AyB3xDI;E1B1BA;E0BsCE;EACA;EACA;AzBoxDN;;AFz3DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACq0DJ;;AFl4DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC22DJ;A0Bz2DQ;E3BFJ;EAAA;EAAA;EAAA;ACi3DJ;A0B32DQ;E3BNJ;EAAA;EAAA;EAAA;ACu3DJ;A0B72DQ;E3BVJ;EAAA;EAAA;EAAA;AC63DJ;A0B72DQ;E3BhBJ;EAAA;EAAA;EAAA;ACm4DJ;A0B/2DQ;E3BpBJ;EAAA;EAAA;EAAA;ACy4DJ;A0Bj3DQ;E3BxBJ;EAAA;EAAA;EAAA;AC+4DJ;;AF58DI;EC6DA;EAAA;ACo5DJ;;AFj9DI;EC6DA;ACw5DJ;;AFr9DI;EC6DA;EAAA;EAAA;AC85DJ;;AF39DI;EC6DA;ACk6DJ;;AF/9DI;EC6DA;EAAA;EAAA;EAAA;ACy6DJ;;AFt+DI;EC6DA;EAAA;EAAA;AC+6DJ;;AF5+DI;EC6DA;EAAA;ACo7DJ;;AFj/DI;EC6DA;ACw7DJ;A2B99DM;E5BsCF;AC27DJ;A2B59DM;E5BiCF;AC87DJ;;AF3/DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACi9DJ;;AF9gEI;EC6DA;EAAA;EAAA;EAAA;ACw9DJ;;A4B//DI;E7BuCA;EAAA;AC69DJ;;A4B//DI;E7BkCA;EAAA;ACk+DJ;;AF/hEI;EC6DA;ACs+DJ;;AFniEI;EC6DA;EAAA;AC2+DJ;;AFxiEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACo/DJ;;AFjjEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACwgEJ;;AFrkEI;EC6DA;AC4gEJ;;AFzkEI;EC6DA;EAAA;EAAA;EAAA;ACmhEJ;;AFhlEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACmjEJ;;A6BpkEM;E9BiBF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACgkEJ;A6B7kEM;E9BaF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC4kEJ;;A6BnlEM;E9BOF;ACglEJ;A6BjlEM;E9BCF;ACmlEJ;;A6B/hEI;E9BpDA;ACulEJ;AyB7jEI;E1B1BA;E0BsCE;EACA;EACA;AzBqjEN;;AF1pEI;EC6DA;ACimEJ;;AF9pEI;EC6DA;ACqmEJ;;AFlqEI;EC6DA;EAAA;EAAA;AC2mEJ;;AFxqEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACunEJ;;AFprEI;EC6DA;EAAA;AC4nEJ;;AFzrEI;EC6DA;ACgoEJ;;A8BvqEM;E/BuCF;ACooEJ;A8BvqEM;E/BmCF;ACuoEJ;A8BtqEM;E/B+BF;AC0oEJ;;AFvsEI;EC6DA;EAAA;EAAA;ACgpEJ;;AF7sEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACypEJ;;AFttEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;E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","sources":["./node_modules/diagram-js/assets/diagram-js.css","./node_modules/bpmn-js/dist/assets/bpmn-font/css/bpmn.css","./node_modules/material-icons/iconfont/material-icons.css","./node_modules/@angular/material/core/style/_sass-utils.scss","./node_modules/@material/theme/_css.scss","./src/styles.scss","./node_modules/@angular/material/core/typography/_typography.scss","./node_modules/@angular/material/core/typography/_typography-utils.scss","./node_modules/@angular/material/chips/_chips-theme.scss","./node_modules/@angular/material/slide-toggle/_slide-toggle-theme.scss","./node_modules/@angular/material/radio/_radio-theme.scss","./node_modules/@angular/material/list/_list-theme.scss","./node_modules/@angular/material/tabs/_tabs-theme.scss","./node_modules/@angular/material/checkbox/_checkbox-theme.scss","./node_modules/@angular/material/core/ripple/_ripple.scss","./node_modules/@angular/cdk/a11y/_index.scss","./node_modules/@angular/cdk/overlay/_index.scss","./node_modules/@angular/cdk/text-field/_index.scss","./node_modules/@angular/material/core/focus-indicators/_private.scss","./node_modules/@angular/material/core/style/_layout-common.scss","./node_modules/@angular/material/core/_core.scss","./node_modules/@angular/material/core/option/_option-theme.scss","./node_modules/@angular/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss","./node_modules/@angular/material/core/_core-theme.scss","./node_modules/@angular/material/progress-bar/_progress-bar-theme.scss","./node_modules/@angular/material/form-field/_form-field-theme.scss","./node_modules/@angular/material/select/_select-theme.scss","./node_modules/@angular/material/slider/_slider-theme.scss","./node_modules/@material/list/_list.scss","./node_modules/@angular/material/button/_button-theme.scss","./node_modules/@angular/material/button/_icon-button-theme.scss","./node_modules/@angular/material/button/_fab-theme.scss","./node_modules/@angular/material/progress-spinner/_progress-spinner-theme.scss","./node_modules/@angular/material/badge/_badge-theme.scss","./node_modules/@angular/material/datepicker/_datepicker-theme.scss","./node_modules/@angular/material/icon/_icon-theme.scss","./node_modules/@angular/material/stepper/_stepper-theme.scss","./node_modules/@angular/material/toolbar/_toolbar-theme.scss"],"sourcesContent":["/**\n * color definitions\n */\n.djs-container {\n --color-grey-225-10-15: hsl(225, 10%, 15%);\n --color-grey-225-10-35: hsl(225, 10%, 35%);\n --color-grey-225-10-55: hsl(225, 10%, 55%);\n --color-grey-225-10-75: hsl(225, 10%, 75%);\n --color-grey-225-10-80: hsl(225, 10%, 80%);\n --color-grey-225-10-85: hsl(225, 10%, 85%);\n --color-grey-225-10-90: hsl(225, 10%, 90%);\n --color-grey-225-10-95: hsl(225, 10%, 95%); \n --color-grey-225-10-97: hsl(225, 10%, 97%);\n\n --color-blue-205-100-45: hsl(205, 100%, 45%);\n --color-blue-205-100-45-opacity-30: hsla(205, 100%, 45%, 30%);\n --color-blue-205-100-50: hsl(205, 100%, 50%);\n --color-blue-205-100-95: hsl(205, 100%, 95%);\n\n --color-green-150-86-44: hsl(150, 86%, 44%);\n\n --color-red-360-100-40: hsl(360, 100%, 40%);\n --color-red-360-100-45: hsl(360, 100%, 45%);\n --color-red-360-100-92: hsl(360, 100%, 92%);\n --color-red-360-100-97: hsl(360, 100%, 97%);\n\n --color-white: hsl(0, 0%, 100%);\n --color-black: hsl(0, 0%, 0%); \n --color-black-opacity-05: hsla(0, 0%, 0%, 5%); \n --color-black-opacity-10: hsla(0, 0%, 0%, 10%);\n\n --bendpoint-fill-color: var(--color-blue-205-100-45-opacity-30);\n --bendpoint-stroke-color: var(--color-blue-205-100-50);\n\n --context-pad-entry-background-color: var(--color-white);\n --context-pad-entry-hover-background-color: var(--color-grey-225-10-95);\n\n --element-dragger-color: var(--color-blue-205-100-50);\n --element-hover-outline-fill-color: var(--color-blue-205-100-45);\n --element-selected-outline-stroke-color: var(--color-blue-205-100-50);\n\n --lasso-fill-color: var(--color-black-opacity-05);\n --lasso-stroke-color: var(--color-black);\n\n --palette-entry-color: var(--color-grey-225-10-15);\n --palette-entry-hover-color: var(--color-blue-205-100-45);\n --palette-entry-selected-color: var(--color-blue-205-100-50);\n --palette-separator-color: var(--color-grey-225-10-75);\n --palette-toggle-hover-background-color: var(--color-grey-225-10-55);\n --palette-background-color: var(--color-grey-225-10-97);\n --palette-border-color: var(--color-grey-225-10-75);\n\n --popup-body-background-color: var(--color-white);\n --popup-header-entry-selected-color: var(--color-blue-205-100-50);\n --popup-header-entry-selected-background-color: var(--color-black-opacity-10);\n --popup-header-separator-color: var(--color-grey-225-10-75);\n --popup-background-color: var(--color-grey-225-10-97);\n --popup-border-color: var(--color-grey-225-10-75);\n\n --resizer-fill-color: var(--color-blue-205-100-45-opacity-30);\n --resizer-stroke-color: var(--color-blue-205-100-50);\n\n --search-container-background-color: var(--color-grey-225-10-97);\n --search-container-border-color: var(--color-blue-205-100-50);\n --search-container-box-shadow-color: var(--color-blue-205-100-95);\n --search-container-box-shadow-inset-color: var(--color-grey-225-10-80);\n --search-input-border-color: var(--color-grey-225-10-75);\n --search-result-border-color: var(--color-grey-225-10-75);\n --search-result-highlight-color: var(--color-black);\n --search-result-selected-color: var(--color-blue-205-100-45-opacity-30);\n\n --shape-attach-allowed-stroke-color: var(--color-blue-205-100-50);\n --shape-connect-allowed-fill-color: var(--color-grey-225-10-97);\n --shape-drop-allowed-fill-color: var(--color-grey-225-10-97);\n --shape-drop-not-allowed-fill-color: var(--color-red-360-100-97);\n --shape-resize-preview-stroke-color: var(--color-blue-205-100-50);\n\n --snap-line-stroke-color: var(--color-blue-205-100-45-opacity-30);\n\n --space-tool-crosshair-stroke-color: var(--color-black);\n\n --tooltip-error-background-color: var(--color-red-360-100-97);\n --tooltip-error-border-color: var(--color-red-360-100-45);\n --tooltip-error-color: var(--color-red-360-100-45);\n}\n\n/**\n * outline styles\n */\n\n.djs-outline {\n fill: none;\n visibility: hidden;\n}\n\n.djs-element.hover .djs-outline,\n.djs-element.selected .djs-outline {\n visibility: visible;\n shape-rendering: geometricPrecision;\n stroke-dasharray: 3,3;\n}\n\n.djs-element.selected .djs-outline {\n stroke: var(--element-selected-outline-stroke-color);\n stroke-width: 1px;\n}\n\n.djs-element.hover .djs-outline {\n stroke: var(--element-hover-outline-fill-color);\n stroke-width: 1px;\n}\n\n.djs-shape.connect-ok .djs-visual > :nth-child(1) {\n fill: var(--shape-connect-allowed-fill-color) !important;\n}\n\n.djs-shape.connect-not-ok .djs-visual > :nth-child(1),\n.djs-shape.drop-not-ok .djs-visual > :nth-child(1) {\n fill: var(--shape-drop-not-allowed-fill-color) !important;\n}\n\n.djs-shape.new-parent .djs-visual > :nth-child(1) {\n fill: var(--shape-drop-allowed-fill-color) !important;\n}\n\nsvg.drop-not-ok {\n background: var(--shape-drop-not-allowed-fill-color) !important;\n}\n\nsvg.new-parent {\n background: var(--shape-drop-allowed-fill-color) !important;\n}\n\n.djs-connection.connect-ok .djs-visual > :nth-child(1),\n.djs-connection.drop-ok .djs-visual > :nth-child(1) {\n stroke: var(--shape-drop-allowed-fill-color) !important;\n}\n\n.djs-connection.connect-not-ok .djs-visual > :nth-child(1),\n.djs-connection.drop-not-ok .djs-visual > :nth-child(1) {\n stroke: var(--shape-drop-not-allowed-fill-color) !important;\n}\n\n.drop-not-ok,\n.connect-not-ok {\n cursor: not-allowed;\n}\n\n.djs-element.attach-ok .djs-visual > :nth-child(1) {\n stroke-width: 5px !important;\n stroke: var(--shape-attach-allowed-stroke-color) !important;\n}\n\n.djs-frame.connect-not-ok .djs-visual > :nth-child(1),\n.djs-frame.drop-not-ok .djs-visual > :nth-child(1) {\n stroke-width: 3px !important;\n stroke: var(--shape-drop-not-allowed-fill-color) !important;\n fill: none !important;\n}\n\n/**\n* Selection box style\n*\n*/\n.djs-lasso-overlay {\n fill: var(--lasso-fill-color);\n\n stroke-dasharray: 5 1 3 1;\n stroke: var(--lasso-stroke-color);\n\n shape-rendering: geometricPrecision;\n pointer-events: none;\n}\n\n/**\n * Resize styles\n */\n.djs-resize-overlay {\n fill: none;\n\n stroke-dasharray: 5 1 3 1;\n stroke: var(--shape-resize-preview-stroke-color);\n\n pointer-events: none;\n}\n\n.djs-resizer-hit {\n fill: none;\n pointer-events: all;\n}\n\n.djs-resizer-visual {\n fill: var(--resizer-fill-color);\n stroke-width: 1px;\n stroke-opacity: 0.5;\n stroke: var(--resizer-stroke-color);\n shape-rendering: geometricprecision;\n}\n\n.djs-resizer:hover .djs-resizer-visual {\n stroke: var(--resizer-stroke-color);\n stroke-opacity: 1;\n}\n\n.djs-cursor-resize-ns,\n.djs-resizer-n,\n.djs-resizer-s {\n cursor: ns-resize;\n}\n\n.djs-cursor-resize-ew,\n.djs-resizer-e,\n.djs-resizer-w {\n cursor: ew-resize;\n}\n\n.djs-cursor-resize-nwse,\n.djs-resizer-nw,\n.djs-resizer-se {\n cursor: nwse-resize;\n}\n\n.djs-cursor-resize-nesw,\n.djs-resizer-ne,\n.djs-resizer-sw {\n cursor: nesw-resize;\n}\n\n.djs-shape.djs-resizing > .djs-outline {\n visibility: hidden !important;\n}\n\n.djs-shape.djs-resizing > .djs-resizer {\n visibility: hidden;\n}\n\n.djs-dragger > .djs-resizer {\n visibility: hidden;\n}\n\n/**\n * drag styles\n */\n.djs-dragger * {\n fill: none !important;\n stroke: var(--element-dragger-color) !important;\n}\n\n.djs-dragger tspan,\n.djs-dragger text {\n fill: var(--element-dragger-color) !important;\n stroke: none !important;\n}\n\nmarker.djs-dragger circle,\nmarker.djs-dragger path,\nmarker.djs-dragger polygon,\nmarker.djs-dragger polyline,\nmarker.djs-dragger rect {\n fill: var(--element-dragger-color) !important;\n stroke: none !important;\n}\n\nmarker.djs-dragger text,\nmarker.djs-dragger tspan {\n fill: none !important;\n stroke: var(--element-dragger-color) !important;\n}\n\n.djs-dragging {\n opacity: 0.3;\n}\n\n.djs-dragging,\n.djs-dragging > * {\n pointer-events: none !important;\n}\n\n.djs-dragging .djs-context-pad,\n.djs-dragging .djs-outline {\n display: none !important;\n}\n\n/**\n * no pointer events for visual\n */\n.djs-visual,\n.djs-outline {\n pointer-events: none;\n}\n\n.djs-element.attach-ok .djs-hit {\n stroke-width: 60px !important;\n}\n\n/**\n * all pointer events for hit shape\n */\n.djs-element > .djs-hit-all {\n pointer-events: all;\n}\n\n.djs-element > .djs-hit-stroke,\n.djs-element > .djs-hit-click-stroke {\n pointer-events: stroke;\n}\n\n/**\n * all pointer events for hit shape\n */\n.djs-drag-active .djs-element > .djs-hit-click-stroke {\n pointer-events: all;\n}\n\n/**\n * shape / connection basic styles\n */\n.djs-connection .djs-visual {\n stroke-width: 2px;\n fill: none;\n}\n\n.djs-cursor-grab {\n cursor: -webkit-grab;\n cursor: -moz-grab;\n cursor: grab;\n}\n\n.djs-cursor-grabbing {\n cursor: -webkit-grabbing;\n cursor: -moz-grabbing;\n cursor: grabbing;\n}\n\n.djs-cursor-crosshair {\n cursor: crosshair;\n}\n\n.djs-cursor-move {\n cursor: move;\n}\n\n.djs-cursor-resize-ns {\n cursor: ns-resize;\n}\n\n.djs-cursor-resize-ew {\n cursor: ew-resize;\n}\n\n\n/**\n * snapping\n */\n.djs-snap-line {\n stroke: var(--snap-line-stroke-color);\n stroke-linecap: round;\n stroke-width: 2px;\n pointer-events: none;\n}\n\n/**\n * snapping\n */\n.djs-crosshair {\n stroke: var(--space-tool-crosshair-stroke-color);\n stroke-linecap: round;\n stroke-width: 1px;\n pointer-events: none;\n shape-rendering: crispEdges;\n stroke-dasharray: 5, 5;\n}\n\n/**\n * palette\n */\n\n.djs-palette {\n position: absolute;\n left: 20px;\n top: 20px;\n\n box-sizing: border-box;\n width: 48px;\n}\n\n.djs-palette .separator {\n margin: 0 5px;\n padding-top: 5px;\n\n border: none;\n border-bottom: solid 1px var(--palette-separator-color);\n\n clear: both;\n}\n\n.djs-palette .entry:before {\n vertical-align: text-bottom;\n}\n\n.djs-palette .djs-palette-toggle {\n cursor: pointer;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n color: var(--palette-entry-color);\n font-size: 30px;\n\n text-align: center;\n}\n\n.djs-palette .entry {\n float: left;\n}\n\n.djs-palette .entry img {\n max-width: 100%;\n}\n\n.djs-palette .djs-palette-entries:after {\n content: '';\n display: table;\n clear: both;\n}\n\n.djs-palette .djs-palette-toggle:hover {\n background: var(--palette-toggle-hover-background-color);\n}\n\n.djs-palette .entry:hover {\n color: var(--palette-entry-hover-color);\n}\n\n.djs-palette .highlighted-entry {\n color: var(--palette-entry-selected-color) !important;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n width: 46px;\n height: 46px;\n line-height: 46px;\n cursor: default;\n}\n\n/**\n * Palette open / two-column layout is controlled via\n * classes on the palette. Events to hook into palette\n * changed life-cycle are available in addition.\n */\n.djs-palette.two-column.open {\n width: 94px;\n}\n\n.djs-palette:not(.open) .djs-palette-entries {\n display: none;\n}\n\n.djs-palette:not(.open) {\n overflow: hidden;\n}\n\n.djs-palette.open .djs-palette-toggle {\n display: none;\n}\n\n/**\n * context-pad\n */\n.djs-overlay-context-pad {\n width: 72px;\n z-index: 100;\n}\n\n.djs-context-pad {\n position: absolute;\n display: none;\n pointer-events: none;\n line-height: 1;\n}\n\n.djs-context-pad .entry {\n width: 22px;\n height: 22px;\n text-align: center;\n display: inline-block;\n font-size: 22px;\n margin: 0 2px 2px 0;\n\n border-radius: 3px;\n\n cursor: default;\n\n background-color: var(--context-pad-entry-background-color);\n box-shadow: 0 0 2px 1px var(--context-pad-entry-background-color);\n pointer-events: all;\n vertical-align: middle;\n}\n\n.djs-context-pad .entry:hover {\n background: var(--context-pad-entry-hover-background-color);\n}\n\n.djs-context-pad.open {\n display: block;\n}\n\n/**\n * popup styles\n */\n.djs-popup .entry {\n line-height: 20px;\n white-space: nowrap;\n cursor: default;\n}\n\n/* larger font for prefixed icons */\n.djs-popup .entry:before {\n vertical-align: middle;\n font-size: 20px;\n}\n\n.djs-popup .entry > span {\n vertical-align: middle;\n font-size: 14px;\n}\n\n.djs-popup .entry:hover,\n.djs-popup .entry.active:hover {\n background: var(--popup-header-entry-selected-background-color);\n}\n\n.djs-popup .entry.disabled {\n background: inherit;\n}\n\n.djs-popup .djs-popup-header .entry {\n display: inline-block;\n padding: 2px 3px 2px 3px;\n\n border: solid 1px transparent;\n border-radius: 3px;\n}\n\n.djs-popup .djs-popup-header .entry.active {\n color: var(--popup-header-entry-selected-color);\n border: solid 1px var(--popup-header-entry-selected-color);\n background-color: var(--popup-header-entry-selected-background-color);\n}\n\n.djs-popup-body .entry {\n padding: 4px 10px 4px 5px;\n}\n\n.djs-popup-body .entry > span {\n margin-left: 5px;\n}\n\n.djs-popup-body {\n background-color: var(--popup-body-background-color);\n}\n\n.djs-popup-header {\n border-bottom: 1px solid var(--popup-header-separator-color);\n}\n\n.djs-popup-header .entry {\n margin: 1px;\n margin-left: 3px;\n}\n\n.djs-popup-header .entry:last-child {\n margin-right: 3px;\n}\n\n/**\n * popup / palette styles\n */\n.djs-palette {\n background: var(--palette-background-color);\n border: solid 1px var(--palette-border-color);\n border-radius: 2px;\n}\n\n.djs-popup {\n background: var(--popup-background-color);\n border: solid 1px var(--popup-border-color);\n border-radius: 2px;\n}\n\n/**\n * touch\n */\n\n.djs-shape,\n.djs-connection {\n touch-action: none;\n}\n\n.djs-segment-dragger,\n.djs-bendpoint {\n display: none;\n}\n\n/**\n * bendpoints\n */\n.djs-segment-dragger .djs-visual {\n display: none;\n\n fill: var(--bendpoint-fill-color);\n stroke: var(--bendpoint-stroke-color);\n stroke-width: 1px;\n stroke-opacity: 1;\n}\n\n.djs-segment-dragger:hover .djs-visual {\n display: block;\n}\n\n.djs-bendpoint .djs-visual {\n fill: var(--bendpoint-fill-color);\n stroke: var(--bendpoint-stroke-color);\n stroke-width: 1px;\n stroke-opacity: 0.5;\n}\n\n.djs-segment-dragger:hover,\n.djs-bendpoints.hover .djs-segment-dragger,\n.djs-bendpoints.selected .djs-segment-dragger,\n.djs-bendpoint:hover,\n.djs-bendpoints.hover .djs-bendpoint,\n.djs-bendpoints.selected .djs-bendpoint {\n display: block;\n}\n\n.djs-drag-active .djs-bendpoints * {\n display: none;\n}\n\n.djs-bendpoints:not(.hover) .floating {\n display: none;\n}\n\n.djs-segment-dragger:hover .djs-visual,\n.djs-segment-dragger.djs-dragging .djs-visual,\n.djs-bendpoint:hover .djs-visual,\n.djs-bendpoint.floating .djs-visual {\n fill: var(--bendpoint-fill-color);\n stroke: var(--bendpoint-stroke-color);\n stroke-opacity: 1;\n}\n\n.djs-bendpoint.floating .djs-hit {\n pointer-events: none;\n}\n\n.djs-segment-dragger .djs-hit,\n.djs-bendpoint .djs-hit {\n fill: none;\n pointer-events: all;\n}\n\n.djs-segment-dragger.horizontal .djs-hit {\n cursor: ns-resize;\n}\n\n.djs-segment-dragger.vertical .djs-hit {\n cursor: ew-resize;\n}\n\n.djs-segment-dragger.djs-dragging .djs-hit {\n pointer-events: none;\n}\n\n.djs-updating,\n.djs-updating > * {\n pointer-events: none !important;\n}\n\n.djs-updating .djs-context-pad,\n.djs-updating .djs-outline,\n.djs-updating .djs-bendpoint,\n.connect-ok .djs-bendpoint,\n.connect-not-ok .djs-bendpoint,\n.drop-ok .djs-bendpoint,\n.drop-not-ok .djs-bendpoint {\n display: none !important;\n}\n\n.djs-segment-dragger.djs-dragging,\n.djs-bendpoint.djs-dragging {\n display: block;\n opacity: 1.0;\n}\n\n\n/**\n * tooltips\n */\n.djs-tooltip-error {\n width: 160px;\n padding: 6px;\n\n background: var(--tooltip-error-background-color);\n border: solid 1px var(--tooltip-error-border-color);\n border-radius: 2px;\n color: var(--tooltip-error-color);\n font-size: 12px;\n line-height: 16px;\n\n opacity: 0.75;\n}\n\n.djs-tooltip-error:hover {\n opacity: 1;\n}\n\n\n/**\n * search pad\n */\n.djs-search-container {\n position: absolute;\n top: 20px;\n left: 0;\n right: 0;\n margin-left: auto;\n margin-right: auto;\n\n width: 25%;\n min-width: 300px;\n max-width: 400px;\n z-index: 10;\n\n font-size: 1.05em;\n opacity: 0.9;\n background: var(--search-container-background-color);\n border: solid 1px var(--search-container-border-color);\n border-radius: 2px;\n box-shadow: 0 0 0 2px var(--search-container-box-shadow-color), 0 0 0 1px var(--search-container-box-shadow-inset-color) inset;\n}\n\n.djs-search-container:not(.open) {\n display: none;\n}\n\n.djs-search-input input {\n font-size: 1.05em;\n width: 100%;\n padding: 6px 10px;\n border: 1px solid var(--search-input-border-color);\n box-sizing: border-box;\n}\n\n.djs-search-input input:focus {\n outline: none;\n border-color: var(--search-input-border-color);\n}\n\n.djs-search-results {\n position: relative;\n overflow-y: auto;\n max-height: 200px;\n}\n\n.djs-search-results:hover {\n cursor: pointer;\n}\n\n.djs-search-result {\n width: 100%;\n padding: 6px 10px;\n background: white;\n border-bottom: solid 1px var(--search-result-border-color);\n border-radius: 1px;\n}\n\n.djs-search-highlight {\n color: var(--search-result-highlight-color);\n}\n\n.djs-search-result-primary {\n margin: 0 0 10px;\n}\n\n.djs-search-result-secondary {\n font-family: monospace;\n margin: 0;\n}\n\n.djs-search-result:hover {\n background: var(--search-result-selected-color);\n}\n\n.djs-search-result-selected {\n background: var(--search-result-selected-color);\n}\n\n.djs-search-result-selected:hover {\n background: var(--search-result-selected-color);\n}\n\n.djs-search-overlay {\n background: var(--search-result-selected-color);\n}\n\n/**\n * hidden styles\n */\n.djs-element-hidden,\n.djs-element-hidden .djs-hit,\n.djs-element-hidden .djs-outline,\n.djs-label-hidden .djs-label {\n display: none !important;\n}\n","@font-face {\n font-family: 'bpmn';\n src: url('../font/bpmn.eot?26374340');\n src: url('../font/bpmn.eot?26374340#iefix') format('embedded-opentype'),\n url('../font/bpmn.woff2?26374340') format('woff2'),\n url('../font/bpmn.woff?26374340') format('woff'),\n url('../font/bpmn.ttf?26374340') format('truetype'),\n url('../font/bpmn.svg?26374340#bpmn') format('svg');\n font-weight: normal;\n font-style: normal;\n}\n/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */\n/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */\n/*\n@media screen and (-webkit-min-device-pixel-ratio:0) {\n @font-face {\n font-family: 'bpmn';\n src: url('../font/bpmn.svg?26374340#bpmn') format('svg');\n }\n}\n*/\n\n [class^=\"bpmn-icon-\"]:before, [class*=\" bpmn-icon-\"]:before {\n font-family: \"bpmn\";\n font-style: normal;\n font-weight: normal;\n speak: never;\n\n display: inline-block;\n text-decoration: inherit;\n width: 1em;\n /* margin-right: .2em; */\n text-align: center;\n /* opacity: .8; */\n\n /* For safety - reset parent styles, that can break glyph codes*/\n font-variant: normal;\n text-transform: none;\n\n /* fix buttons height, for twitter bootstrap */\n line-height: 1em;\n\n /* Animation center compensation - margins should be symmetric */\n /* remove if not needed */\n /* margin-left: .2em; */\n\n /* you can be more comfortable with increased icons size */\n /* font-size: 120%; */\n\n /* Font smoothing. That was taken from TWBS */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Uncomment for 3D effect */\n /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */\n}\n\n.bpmn-icon-screw-wrench:before { content: '\\e800'; } /* '' */\n.bpmn-icon-trash:before { content: '\\e801'; } /* '' */\n.bpmn-icon-conditional-flow:before { content: '\\e802'; } /* '' */\n.bpmn-icon-default-flow:before { content: '\\e803'; } /* '' */\n.bpmn-icon-gateway-parallel:before { content: '\\e804'; } /* '' */\n.bpmn-icon-intermediate-event-catch-cancel:before { content: '\\e805'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-message:before { content: '\\e806'; } /* '' */\n.bpmn-icon-start-event-compensation:before { content: '\\e807'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-parallel-multiple:before { content: '\\e808'; } /* '' */\n.bpmn-icon-loop-marker:before { content: '\\e809'; } /* '' */\n.bpmn-icon-parallel-mi-marker:before { content: '\\e80a'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-signal:before { content: '\\e80b'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-timer:before { content: '\\e80c'; } /* '' */\n.bpmn-icon-intermediate-event-catch-parallel-multiple:before { content: '\\e80d'; } /* '' */\n.bpmn-icon-intermediate-event-catch-compensation:before { content: '\\e80e'; } /* '' */\n.bpmn-icon-gateway-xor:before { content: '\\e80f'; } /* '' */\n.bpmn-icon-connection:before { content: '\\e810'; } /* '' */\n.bpmn-icon-end-event-cancel:before { content: '\\e811'; } /* '' */\n.bpmn-icon-intermediate-event-catch-condition:before { content: '\\e812'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-parallel-multiple:before { content: '\\e813'; } /* '' */\n.bpmn-icon-start-event-condition:before { content: '\\e814'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-timer:before { content: '\\e815'; } /* '' */\n.bpmn-icon-sequential-mi-marker:before { content: '\\e816'; } /* '' */\n.bpmn-icon-user-task:before { content: '\\e817'; } /* '' */\n.bpmn-icon-business-rule:before { content: '\\e818'; } /* '' */\n.bpmn-icon-sub-process-marker:before { content: '\\e819'; } /* '' */\n.bpmn-icon-start-event-parallel-multiple:before { content: '\\e81a'; } /* '' */\n.bpmn-icon-start-event-error:before { content: '\\e81b'; } /* '' */\n.bpmn-icon-intermediate-event-catch-signal:before { content: '\\e81c'; } /* '' */\n.bpmn-icon-intermediate-event-catch-error:before { content: '\\e81d'; } /* '' */\n.bpmn-icon-end-event-compensation:before { content: '\\e81e'; } /* '' */\n.bpmn-icon-subprocess-collapsed:before { content: '\\e81f'; } /* '' */\n.bpmn-icon-subprocess-expanded:before { content: '\\e820'; } /* '' */\n.bpmn-icon-task:before { content: '\\e821'; } /* '' */\n.bpmn-icon-end-event-error:before { content: '\\e822'; } /* '' */\n.bpmn-icon-intermediate-event-catch-escalation:before { content: '\\e823'; } /* '' */\n.bpmn-icon-intermediate-event-catch-timer:before { content: '\\e824'; } /* '' */\n.bpmn-icon-start-event-escalation:before { content: '\\e825'; } /* '' */\n.bpmn-icon-start-event-signal:before { content: '\\e826'; } /* '' */\n.bpmn-icon-business-rule-task:before { content: '\\e827'; } /* '' */\n.bpmn-icon-manual:before { content: '\\e828'; } /* '' */\n.bpmn-icon-receive:before { content: '\\e829'; } /* '' */\n.bpmn-icon-call-activity:before { content: '\\e82a'; } /* '' */\n.bpmn-icon-start-event-timer:before { content: '\\e82b'; } /* '' */\n.bpmn-icon-start-event-message:before { content: '\\e82c'; } /* '' */\n.bpmn-icon-intermediate-event-none:before { content: '\\e82d'; } /* '' */\n.bpmn-icon-intermediate-event-catch-link:before { content: '\\e82e'; } /* '' */\n.bpmn-icon-end-event-escalation:before { content: '\\e82f'; } /* '' */\n.bpmn-icon-text-annotation:before { content: '\\e830'; } /* '' */\n.bpmn-icon-bpmn-io:before { content: '\\e831'; } /* '' */\n.bpmn-icon-gateway-complex:before { content: '\\e832'; } /* '' */\n.bpmn-icon-gateway-eventbased:before { content: '\\e833'; } /* '' */\n.bpmn-icon-gateway-none:before { content: '\\e834'; } /* '' */\n.bpmn-icon-gateway-or:before { content: '\\e835'; } /* '' */\n.bpmn-icon-end-event-terminate:before { content: '\\e836'; } /* '' */\n.bpmn-icon-end-event-signal:before { content: '\\e837'; } /* '' */\n.bpmn-icon-end-event-none:before { content: '\\e838'; } /* '' */\n.bpmn-icon-end-event-multiple:before { content: '\\e839'; } /* '' */\n.bpmn-icon-end-event-message:before { content: '\\e83a'; } /* '' */\n.bpmn-icon-end-event-link:before { content: '\\e83b'; } /* '' */\n.bpmn-icon-intermediate-event-catch-message:before { content: '\\e83c'; } /* '' */\n.bpmn-icon-intermediate-event-throw-compensation:before { content: '\\e83d'; } /* '' */\n.bpmn-icon-start-event-multiple:before { content: '\\e83e'; } /* '' */\n.bpmn-icon-script:before { content: '\\e83f'; } /* '' */\n.bpmn-icon-manual-task:before { content: '\\e840'; } /* '' */\n.bpmn-icon-send:before { content: '\\e841'; } /* '' */\n.bpmn-icon-service:before { content: '\\e842'; } /* '' */\n.bpmn-icon-receive-task:before { content: '\\e843'; } /* '' */\n.bpmn-icon-user:before { content: '\\e844'; } /* '' */\n.bpmn-icon-start-event-none:before { content: '\\e845'; } /* '' */\n.bpmn-icon-intermediate-event-throw-escalation:before { content: '\\e846'; } /* '' */\n.bpmn-icon-intermediate-event-catch-multiple:before { content: '\\e847'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-escalation:before { content: '\\e848'; } /* '' */\n.bpmn-icon-intermediate-event-throw-link:before { content: '\\e849'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-condition:before { content: '\\e84a'; } /* '' */\n.bpmn-icon-data-object:before { content: '\\e84b'; } /* '' */\n.bpmn-icon-script-task:before { content: '\\e84c'; } /* '' */\n.bpmn-icon-send-task:before { content: '\\e84d'; } /* '' */\n.bpmn-icon-data-store:before { content: '\\e84e'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-escalation:before { content: '\\e84f'; } /* '' */\n.bpmn-icon-intermediate-event-throw-message:before { content: '\\e850'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-multiple:before { content: '\\e851'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-signal:before { content: '\\e852'; } /* '' */\n.bpmn-icon-intermediate-event-throw-multiple:before { content: '\\e853'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-message:before { content: '\\e854'; } /* '' */\n.bpmn-icon-ad-hoc-marker:before { content: '\\e855'; } /* '' */\n.bpmn-icon-service-task:before { content: '\\e856'; } /* '' */\n.bpmn-icon-task-none:before { content: '\\e857'; } /* '' */\n.bpmn-icon-compensation-marker:before { content: '\\e858'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-multiple:before { content: '\\e859'; } /* '' */\n.bpmn-icon-intermediate-event-throw-signal:before { content: '\\e85a'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-condition:before { content: '\\e85b'; } /* '' */\n.bpmn-icon-participant:before { content: '\\e85c'; } /* '' */\n.bpmn-icon-event-subprocess-expanded:before { content: '\\e85d'; } /* '' */\n.bpmn-icon-lane-insert-below:before { content: '\\e85e'; } /* '' */\n.bpmn-icon-space-tool:before { content: '\\e85f'; } /* '' */\n.bpmn-icon-connection-multi:before { content: '\\e860'; } /* '' */\n.bpmn-icon-lane:before { content: '\\e861'; } /* '' */\n.bpmn-icon-lasso-tool:before { content: '\\e862'; } /* '' */\n.bpmn-icon-lane-insert-above:before { content: '\\e863'; } /* '' */\n.bpmn-icon-lane-divide-three:before { content: '\\e864'; } /* '' */\n.bpmn-icon-lane-divide-two:before { content: '\\e865'; } /* '' */\n.bpmn-icon-data-input:before { content: '\\e866'; } /* '' */\n.bpmn-icon-data-output:before { content: '\\e867'; } /* '' */\n.bpmn-icon-hand-tool:before { content: '\\e868'; } /* '' */\n.bpmn-icon-group:before { content: '\\e869'; } /* '' */\n.bpmn-icon-transaction:before { content: '\\e8c4'; } /* '' */","@font-face {\n font-family: \"Material Icons\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons.woff2\") format(\"woff2\"), url(\"./material-icons.woff\") format(\"woff\");\n}\n.material-icons {\n font-family: \"Material Icons\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Outlined\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-outlined.woff2\") format(\"woff2\"), url(\"./material-icons-outlined.woff\") format(\"woff\");\n}\n.material-icons-outlined {\n font-family: \"Material Icons Outlined\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Round\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-round.woff2\") format(\"woff2\"), url(\"./material-icons-round.woff\") format(\"woff\");\n}\n.material-icons-round {\n font-family: \"Material Icons Round\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Sharp\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-sharp.woff2\") format(\"woff2\"), url(\"./material-icons-sharp.woff\") format(\"woff\");\n}\n.material-icons-sharp {\n font-family: \"Material Icons Sharp\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Two Tone\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-two-tone.woff2\") format(\"woff2\"), url(\"./material-icons-two-tone.woff\") format(\"woff\");\n}\n.material-icons-two-tone {\n font-family: \"Material Icons Two Tone\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n","@use 'sass:color';\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n\n/// Include content under the current selector (&) or the document root if there is no current\n/// selector.\n/// @param {String} $root [html] The default root selector to use when there is no current selector.\n/// @output The given content under the current selector, or root selector if there is no current\n/// selector.\n/// @content Content to output under the current selector, or root selector if there is no current\n/// selector.\n@mixin current-selector-or-root($root: html) {\n @if & {\n @content;\n }\n @else {\n #{$root} {\n @content;\n }\n }\n}\n\n/// A version of the standard `map.merge` function that takes a variable number of arguments.\n/// Each argument is merged into the final result from left to right.\n/// @param {List} $maps The maps to combine with map.merge\n/// @return {Map} The combined result of successively calling map.merge with each parameter.\n@function merge-all($maps...) {\n $result: ();\n @each $map in $maps {\n $result: map.merge($result, $map);\n }\n @return $result;\n}\n\n/// A version of the standard `map.deep-merge` function that takes a variable number of arguments.\n/// Each argument is deep-merged into the final result from left to right.\n/// @param {List} $maps The maps to combine with map.deep-merge\n/// @return {Map} The combined result of successively calling map.deep-merge with each parameter.\n@function deep-merge-all($maps...) {\n $result: ();\n @each $map in $maps {\n $result: map.deep-merge($result, $map);\n }\n @return $result;\n}\n\n/// Coerces the given value to a list, by converting any non-list value into a single-item list.\n/// This should be used when dealing with user-passed lists of args to avoid confusing errors,\n/// since Sass treats `($x)` as equivalent to `$x`.\n/// @param {Any} $value The value to coerce to a list.\n/// @return {List} The original $value if it was a list, otherwise a single-item list containing\n/// $value.\n@function coerce-to-list($value) {\n @return if(meta.type-of($value) != 'list', ($value,), $value);\n}\n\n/// A version of the Sass `color.change` function that is safe ot use with CSS variables.\n@function safe-color-change($color, $args...) {\n $args: meta.keywords($args);\n @return if(meta.type-of($color) == 'color', color.change($color, $args...), $color);\n}\n\n/// Gets the given arguments as a map of keywords and validates that only supported arguments were\n/// passed.\n/// @param {ArgList} $args The arguments to convert to a keywords map.\n/// @param {List} $supported-args The supported argument names.\n/// @return {Map} The $args as a map of argument name to argument value.\n@function validate-keyword-args($args, $supported-args) {\n @if list.length($args) > 0 {\n @error #{'Expected keyword args, but got positional args: '}#{$args};\n }\n $kwargs: meta.keywords($args);\n @each $arg, $v in $kwargs {\n @if list.index($supported-args, $arg) == null {\n @error #{'Unsupported argument '}#{$arg}#{'. Valid arguments are: '}#{$supported-args};\n }\n }\n @return $kwargs;\n}\n","//\n// Copyright 2020 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n@use './gss';\n\n/// When true, add an additional property/value declaration before declarations\n/// that use advanced features such as custom properties or CSS functions. This\n/// adds fallback support for older browsers such as IE11 that do not support\n/// these features at the cost of additional CSS. Set this variable to false to\n/// disable generating fallback declarations.\n$enable-fallback-declarations: true !default;\n\n/// Writes a CSS property/value declaration. This mixin is used throughout the\n/// theme package for consistency for dynamically setting CSS property values.\n///\n/// This mixin may optionally take a fallback value. For advanced features such\n/// as custom properties or CSS functions like min and max, a fallback value is\n/// recommended to support older browsers.\n///\n/// @param {String} $property - The CSS property of the declaration.\n/// @param {*} $value - The value of the CSS declaration. The value should be\n/// resolved by other theme functions first (i.e. custom property Maps and\n/// Material theme keys are not supported in this mixin). If the value is\n/// null, no declarations will be emitted.\n/// @param {*} $fallback - An optional fallback value for older browsers. If\n/// provided, a second property/value declaration will be added before the\n/// main property/value declaration.\n/// @param {Map} $gss - An optional Map of GSS annotations to add.\n/// @param {Bool} $important - If true, add `!important` to the declaration.\n@mixin declaration(\n $property,\n $value,\n $fallback-value: null,\n $gss: (),\n $important: false\n) {\n // Normally setting a null value to a property will not emit CSS, so mixins\n // wouldn't need to check this. However, Sass will throw an error if the\n // interpolated property is a custom property.\n @if $value != null {\n $important-rule: if($important, ' !important', '');\n\n @if $fallback-value and $enable-fallback-declarations {\n @include gss.annotate($gss);\n #{$property}: #{$fallback-value} #{$important-rule};\n\n // Add @alternate to annotations.\n $gss: map.merge(\n $gss,\n (\n alternate: true,\n )\n );\n }\n\n @include gss.annotate($gss);\n #{$property}: #{$value}#{$important-rule};\n }\n}\n\n/// Unpacks shorthand values for CSS properties (i.e. lists of 1-3 values).\n/// If a list of 4 values is given, it is returned as-is.\n///\n/// Examples:\n///\n/// unpack-value(4px) => 4px 4px 4px 4px\n/// unpack-value(4px 2px) => 4px 2px 4px 2px\n/// unpack-value(4px 2px 2px) => 4px 2px 2px 2px\n/// unpack-value(4px 2px 0 2px) => 4px 2px 0 2px\n///\n/// @param {Number | Map | List} $value - List of 1 to 4 value numbers.\n/// @return {List} a List of 4 value numbers.\n@function unpack-value($value) {\n @if meta.type-of($value) == 'map' or list.length($value) == 1 {\n @return $value $value $value $value;\n } @else if list.length($value) == 4 {\n @return $value;\n } @else if list.length($value) == 3 {\n @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 3)\n list.nth($value, 2);\n } @else if list.length($value) == 2 {\n @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 1)\n list.nth($value, 2);\n }\n\n @error \"Invalid CSS property value: '#{$value}' is more than 4 values\";\n}\n","// Custom Theming for Angular Material\n// For more information: https://material.angular.io/guide/theming\n@use \"@angular/material\" as mat;\n@import \"@angular/material\";\n@import \"material-icons/iconfont/material-icons.css\";\n// Plus imports for other components in your app.\n// Include the common styles for Angular Material. We include this here so that you only\n// have to load a single css file for Angular Material in your app.\n// Be sure that you only ever include this mixin once!\n@include mat.all-component-typographies();\n@include mat.core();\n\n:root {\n --borderGray10: #e8e9ed;\n}\n// Define the palettes for your theme using the Material Design palettes available in palette.scss\n// (imported above). For each palette, you can optionally specify a default, lighter, and darker\n// hue. Available color palettes: https://material.io/design/color/\n\n// This pallette was generated with https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors,\n// using the color of the left part of the Domain Storytelling logo (#A4D7E1) as primary color (nr. 100 in the palette):\n$egon-palette: (\n 50: #daeff3,\n 100: #a4d7e1,\n 200: #67bdcd,\n 300: #15a3b9,\n 400: #0093ac,\n 500: #00839f,\n 600: #00758f,\n 700: #006377,\n 800: #005160,\n 900: #003139,\n contrast: (\n 50: black,\n 100: black,\n 200: black,\n 300: white,\n 400: white,\n 500: white,\n 600: white,\n 700: white,\n 800: white,\n 900: white,\n ),\n);\n\n// mdc-filled-text-field-focus-label-text-color: rgba(164, 215, 225, 0.87);\n\n// This was generated (see egon-palette), with 100 as primary color\n$egon-contrast-palette: (\n 50: #eedddd,\n 100: #e1aea4,\n 200: #cb796b,\n 300: #b64435,\n 400: #a90e10,\n 500: #9b0000,\n 600: #940000,\n 700: #8a0000,\n 800: #7c0000,\n 900: #660000,\n contrast: (\n 50: black,\n 100: black,\n 200: black,\n 300: white,\n 400: white,\n 500: white,\n 600: white,\n 700: white,\n 800: white,\n 900: white,\n ),\n);\n\n// @param base-pallette\n// @param primary\n// @param lighter\n// @param darker\n$egon-primary: mat.define-palette($egon-palette, 100, 50, 200);\n$egon-accent: mat.define-palette($egon-palette, 400, 300, 500);\n\n// The warn palette is optional (defaults to red).\n$egon-warn: mat.define-palette($egon-contrast-palette, 100, 50, 300);\n\n// Create the theme object. A theme consists of configurations for individual\n// theming systems such as \"color\" or \"typography\".\n$egon-theme: mat.define-light-theme(\n (\n color: (\n primary: $egon-primary,\n accent: $egon-accent,\n warn: $egon-warn,\n ),\n )\n);\n\n// Include theme styles for core and each component used in your app.\n// Alternatively, you can import and @include the theme mixins for each component\n// that you are using.\n@include mat.all-component-themes($egon-theme);\n\n/* FONTS */\n\n@font-face {\n font-family: Roboto;\n font-style: normal, bold;\n src: local(\"Roboto-Regular\"), url(\"~src/assets/font/Roboto-Regular.woff\");\n}\n\n/* You can add global styles to this file, and also import other style files */\n\nhtml,\nbody {\n height: 100%;\n}\n\nbody {\n margin: 0;\n font-family: Roboto, \"Helvetica Neue\", Arial, sans-serif;\n}\n\n.smallScrollbar {\n /* Works on Firefox */\n scrollbar-width: thin;\n\n /* Works on Chrome, Edge, and Safari */\n *::-webkit-scrollbar {\n width: 12px;\n }\n}\n\n.headline {\n font-size: 1.1rem;\n cursor: pointer;\n}\n\n.headerButton {\n background-color: transparent;\n border: none;\n letter-spacing: 0.05em;\n}\n\n.headerButton:hover {\n color: #0093ac;\n cursor: pointer;\n}\n\n.spacer {\n flex: 1 1 auto;\n}\n\n.mr-1 {\n margin-right: 8px !important;\n}\n\n.mr-10 {\n margin-right: 10px !important;\n}\n\n.materialIconButton {\n font-size: 24px !important;\n padding-left: 5px;\n padding-right: 5px;\n margin-top: 9px;\n}\n\n.dense-8 {\n @include mat.all-component-densities(-8);\n}\n\napp-root {\n display: block;\n height: 100%;\n}\n\na {\n color: map-get($egon-accent, 900);\n}\n\n/* Material Design */\n\nmat-dialog-actions.mdc-dialog__actions {\n padding: 0 24px 20px 24px;\n justify-content: end;\n}\n\n.mat-mdc-snack-bar-container {\n &.snackbar_success {\n --mdc-snackbar-container-color: #a4d7e1;\n --mat-mdc-snack-bar-button-color: black;\n --mdc-snackbar-supporting-text-color: black;\n }\n &.snackbar_error {\n --mdc-snackbar-container-color: #b64435;\n --mat-mdc-snack-bar-button-color: #fff;\n --mdc-snackbar-supporting-text-color: #fff;\n }\n &.snackbar_info {\n --mdc-snackbar-container-color: #f7f7f8;\n --mat-mdc-snack-bar-button-color: black;\n --mat-snack-bar-button-color: black;\n --mdc-snackbar-supporting-text-color: black;\n }\n}\n\n/**\n * from diagram-js\n */\n\n/* context pad */\n\n.djs-overlay-context-pad {\n min-width: 7.5rem;\n height: auto;\n}\n\n.djs-context-pad.open {\n border: solid 1px #b9bcc6;\n}\n\n.djs-context-pad.open > .group {\n border: solid 1px #b9bcc6;\n padding: 1px;\n background-color: #f7f7f8;\n}\n\n/**\n * palette\n */\n\n.djs-palette {\n position: absolute;\n left: 20px;\n top: 20px;\n\n box-sizing: border-box;\n width: 32px;\n}\n\n.djs-palette .separator {\n margin: 0 2px;\n padding-top: 0;\n\n border: none;\n border-bottom: solid 1px #b9bcc6;\n\n clear: both;\n}\n\n.djs-palette .entry:before {\n vertical-align: middle;\n}\n\n.djs-palette .djs-palette-toggle {\n cursor: pointer;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n color: #333;\n font-size: 26px;\n\n text-align: center;\n}\n\n.djs-palette .entry {\n float: left;\n}\n\n.djs-palette .entry img {\n max-width: 100%;\n}\n\n.djs-palette .djs-palette-entries:after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.djs-palette .djs-palette-toggle:hover {\n background: #666;\n}\n\n.djs-palette .entry:hover {\n fill: #a4d7e1;\n}\n\n.djs-palette .highlighted-entry {\n color: #a4d7e1 !important;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n width: 30px;\n height: 30px;\n line-height: 30px;\n cursor: default;\n}\n\n/**\n * Palette open / two-column layout is controlled via\n * classes on the palette. Events to hook into palette\n * changed life-cycle are available in addition.\n */\n.djs-palette.two-column.open {\n width: 64px;\n}\n\n.djs-palette:not(.open) .djs-palette-entries {\n display: none;\n}\n\n.djs-palette:not(.open) {\n overflow: hidden;\n}\n\n.djs-palette.open .djs-palette-toggle {\n display: none;\n}\n\n/**\n * outline styles\n */\n\n.djs-outline {\n fill: none;\n visibility: hidden;\n}\n\n.djs-element.hover .djs-outline,\n.djs-element.selected .djs-outline {\n visibility: visible;\n shape-rendering: crispEdges;\n stroke-dasharray: 3, 3;\n}\n\n.djs-element.hover .djs-outline {\n stroke: #a4d7e1;\n}\n\n.djs-element.attach-ok .djs-visual > :nth-child(1) {\n stroke: #a4d7e1 !important;\n}\n\n/**\n* Selection box style\n*\n*/\n.djs-lasso-overlay {\n stroke: #a4d7e1;\n}\n\n/**\n * Resize styles\n */\n.djs-resize-overlay {\n stroke: #a4d7e1;\n}\n\n/**\n * drag styles\n */\n.djs-dragger .djs-visual circle,\n.djs-dragger .djs-visual path,\n.djs-dragger .djs-visual polygon,\n.djs-dragger .djs-visual polyline,\n.djs-dragger .djs-visual rect,\n.djs-dragger .djs-visual text {\n fill: none !important;\n stroke: #a4d7e1 !important;\n}\n\n/**\n * snapping\n */\n.djs-snap-line {\n stroke: #eedddd;\n}\n\n.djs-palette .entry:hover {\n color: #a4d7e1;\n}\n\n.djs-palette .highlighted-entry {\n color: #a4d7e1 !important;\n}\n\n.djs-context-pad .entry:hover {\n background: #a4d7e1;\n}\n\n.djs-popup .djs-popup-header .entry.active {\n color: #a4d7e1;\n border: solid 1px #a4d7e1;\n background-color: #f7f7f8;\n}\n\n.djs-popup-body .entry {\n width: auto !important;\n}\n\n.djs-segment-dragger:hover .djs-visual,\n.djs-segment-dragger.djs-dragging .djs-visual,\n.djs-bendpoint:hover .djs-visual,\n.djs-bendpoint.floating .djs-visual {\n fill: #a4d7e1;\n stroke-opacity: 0.5;\n stroke: black;\n}\n\n.djs-segment-dragger.djs-dragging .djs-visual,\n.djs-bendpoint.djs-dragging .djs-visual {\n fill: #a4d7e1;\n}\n\n.djs-tooltip-error > * {\n color: #a4d7e1;\n border-left: solid 5px #a4d7e1;\n}\n\n.autocomplete-items {\n border: 1px solid #b9bcc6;\n background-color: #f7f7f8;\n}\n\n.autocomplete-active {\n background-color: #a4d7e1 !important;\n}\n","@use 'sass:list';\n@use 'sass:map';\n@use 'sass:string';\n@use 'typography-utils';\n@use '../theming/inspection';\n@use './versioning';\n\n// Definition and versioning functions live in their own files to avoid circular dependencies, but\n// we re-export them here so that historical imports from this file continue to work without needing\n// to be updated.\n@forward './definition';\n@forward './versioning';\n\n@mixin typography-hierarchy($theme, $selector: '.mat-typography', $back-compat: false) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _m3-typography-hierarchy($theme, $selector, $back-compat);\n }\n @else {\n @include _m2-typography-hierarchy($theme, $selector);\n }\n}\n\n@function _get-selector($selectors, $prefix) {\n $result: ();\n @each $selector in $selectors {\n // Don't add \"naked\" tag selectors, and don't nest prefix selector.\n @if string.index($selector, '.') == 1 {\n $result: list.append($result, $selector, $separator: comma);\n }\n // Don't nest the prefix selector in itself.\n @if $selector != $prefix {\n $result: list.append($result, '#{$prefix} #{$selector}', $separator: comma);\n }\n }\n @return $result;\n}\n\n@mixin _m3-typography-level($theme, $selector-prefix, $level, $selectors, $margin: null) {\n #{_get-selector($selectors, $selector-prefix)} {\n // TODO(mmalerba): When we expose system tokens as CSS vars, we should change this to emit token\n // slots.\n font: inspection.get-theme-typography($theme, $level, font);\n letter-spacing: inspection.get-theme-typography($theme, $level, letter-spacing);\n @if $margin != null {\n margin: 0 0 $margin;\n }\n }\n}\n\n@mixin _m3-typography-hierarchy($theme, $selector-prefix, $add-m2-selectors) {\n $levels: (\n display-large: (\n selectors: ('.mat-display-large', 'h1'),\n m2-selectors: ('.mat-h1', '.mat-headline-1'),\n margin: 0.5em\n ),\n display-medium: (\n selectors: ('.mat-display-medium', 'h2'),\n m2-selectors: ('.mat-h2', '.mat-headline-2'),\n margin: 0.5em\n ),\n display-small: (\n selectors: ('.mat-display-small', 'h3'),\n m2-selectors: ('.mat-h3', '.mat-headline-3'),\n margin: 0.5em\n ),\n headline-large: (\n selectors: ('.mat-headline-large', 'h4'),\n m2-selectors: ('.mat-h4', '.mat-headline-4'),\n margin: 0.5em\n ),\n headline-medium: (\n selectors: ('.mat-headline-medium', 'h5'),\n m2-selectors: ('.mat-h5', '.mat-headline-5'),\n margin: 0.5em\n ),\n headline-small: (\n selectors: ('.mat-headline-small', 'h6'),\n m2-selectors: ('.mat-h6', '.mat-headline-6'),\n margin: 0.5em\n ),\n title-large: (\n selectors: ('.mat-title-large'),\n m2-selectors: ('.mat-subtitle-1'),\n ),\n title-medium: (\n selectors: ('.mat-title-medium'),\n m2-selectors: ('.mat-subtitle-2'),\n ),\n title-small: (\n selectors: ('.mat-title-small')\n ),\n body-large: (\n selectors: ('.mat-body-large', $selector-prefix),\n m2-selectors: ('.mat-body', '.mat-body-strong', '.mat-body-2'),\n ),\n body-medium: (\n selectors: ('.mat-body-medium')\n ),\n body-small: (\n selectors: ('.mat-body-small')\n ),\n label-large: (\n selectors: ('.mat-label-large')\n ),\n label-medium: (\n selectors: ('.mat-label-medium')\n ),\n label-small: (\n selectors: ('.mat-label-small'),\n m2-selectors: ('.mat-small', '.mat-caption')\n ),\n );\n\n @each $level, $options in $levels {\n @if $add-m2-selectors {\n $options: map.set($options, selectors,\n list.join(map.get($options, selectors), map.get($options, m2-selectors) or ()));\n }\n $options: map.remove($options, m2-selectors);\n\n // Apply styles for the level.\n @include _m3-typography-level($theme, $selector-prefix, $level, $options...);\n\n // Also style

inside body-large.\n @if $level == body-large {\n #{_get-selector(map.get($options, selectors), $selector-prefix)} {\n p {\n margin: 0 0 0.75em;\n }\n }\n }\n }\n}\n\n/// Emits baseline typographic styles based on a given config.\n/// @param {Map} $config-or-theme A typography config for an entire theme.\n/// @param {String} $selector Ancestor selector under which native elements, such as h1, will\n/// be styled.\n@mixin _m2-typography-hierarchy($theme, $selector) {\n // Note that it seems redundant to prefix the class rules with the `$selector`, however it's\n // necessary if we want to allow people to overwrite the tag selectors. This is due to\n // selectors like `#{$selector} h1` being more specific than ones like `.mat-title`.\n .mat-h1,\n .mat-headline-5,\n #{$selector} .mat-h1,\n #{$selector} .mat-headline-5,\n #{$selector} h1 {\n font: inspection.get-theme-typography($theme, headline-5, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-5, letter-spacing);\n margin: 0 0 16px;\n }\n\n .mat-h2,\n .mat-headline-6,\n #{$selector} .mat-h2,\n #{$selector} .mat-headline-6,\n #{$selector} h2 {\n font: inspection.get-theme-typography($theme, headline-6, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-6, letter-spacing);\n margin: 0 0 16px;\n }\n\n .mat-h3,\n .mat-subtitle-1,\n #{$selector} .mat-h3,\n #{$selector} .mat-subtitle-1,\n #{$selector} h3 {\n font: inspection.get-theme-typography($theme, subtitle-1, font);\n letter-spacing: inspection.get-theme-typography($theme, subtitle-1, letter-spacing);\n margin: 0 0 16px;\n }\n\n .mat-h4,\n .mat-body-1,\n #{$selector} .mat-h4,\n #{$selector} .mat-body-1,\n #{$selector} h4 {\n font: inspection.get-theme-typography($theme, body-1, font);\n letter-spacing: inspection.get-theme-typography($theme, body-1, letter-spacing);\n margin: 0 0 16px;\n }\n\n // Note: the spec doesn't have anything that would correspond to h5 and h6, but we add these for\n // consistency. The font sizes come from the Chrome user agent styles which have h5 at 0.83em\n // and h6 at 0.67em.\n .mat-h5,\n #{$selector} .mat-h5,\n #{$selector} h5 {\n @include typography-utils.font-shorthand(\n // calc is used here to support css variables\n calc(#{inspection.get-theme-typography($theme, body-2, font-size)} * 0.83),\n inspection.get-theme-typography($theme, body-2, font-weight),\n inspection.get-theme-typography($theme, body-2, line-height),\n inspection.get-theme-typography($theme, body-2, font-family)\n );\n\n margin: 0 0 12px;\n }\n\n .mat-h6,\n #{$selector} .mat-h6,\n #{$selector} h6 {\n @include typography-utils.font-shorthand(\n // calc is used here to support css variables\n calc(#{inspection.get-theme-typography($theme, body-2, font-size)} * 0.67),\n inspection.get-theme-typography($theme, body-2, font-weight),\n inspection.get-theme-typography($theme, body-2, line-height),\n inspection.get-theme-typography($theme, body-2, font-family)\n );\n\n margin: 0 0 12px;\n }\n\n .mat-body-strong,\n .mat-subtitle-2,\n #{$selector} .mat-body-strong,\n #{$selector} .mat-subtitle-2 {\n font: inspection.get-theme-typography($theme, subtitle-2, font);\n letter-spacing: inspection.get-theme-typography($theme, subtitle-2, letter-spacing);\n }\n\n .mat-body,\n .mat-body-2,\n #{$selector} .mat-body,\n #{$selector} .mat-body-2,\n #{$selector} {\n font: inspection.get-theme-typography($theme, body-2, font);\n letter-spacing: inspection.get-theme-typography($theme, body-2, letter-spacing);\n\n p {\n margin: 0 0 12px;\n }\n }\n\n .mat-small,\n .mat-caption,\n #{$selector} .mat-small,\n #{$selector} .mat-caption {\n font: inspection.get-theme-typography($theme, caption, font);\n letter-spacing: inspection.get-theme-typography($theme, caption, letter-spacing);\n }\n\n .mat-headline-1,\n #{$selector} .mat-headline-1 {\n font: inspection.get-theme-typography($theme, headline-1, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-1, letter-spacing);\n margin: 0 0 56px;\n }\n\n .mat-headline-2,\n #{$selector} .mat-headline-2 {\n font: inspection.get-theme-typography($theme, headline-2, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-2, letter-spacing);\n margin: 0 0 64px;\n }\n\n .mat-headline-3,\n #{$selector} .mat-headline-3 {\n font: inspection.get-theme-typography($theme, headline-3, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-3, letter-spacing);\n margin: 0 0 64px;\n }\n\n .mat-headline-4,\n #{$selector} .mat-headline-4 {\n font: inspection.get-theme-typography($theme, headline-4, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-4, letter-spacing);\n margin: 0 0 64px;\n }\n}\n","@use 'sass:list';\n@use 'sass:math';\n@use './property-getters';\n\n// Property getters live in their own file to avoid circular dependencies, but we re-export them\n// here so that historical imports from this file continue to work without needing to be updated.\n@forward './property-getters';\n\n/// Outputs the shorthand `font` CSS property, based on a set of typography values. Falls back to\n/// the individual properties if a value that isn't allowed in the shorthand is passed in.\n/// @param {String} $font-size The font-size value.\n/// @param {String | Number} $font-weight The font-weight value.\n/// @param {String | Number} $line-height The line-height value.\n/// @param {String} $font-family The font-family value.\n/// @returns {String} The `font` shorthand value combining the given parts.\n@mixin font-shorthand($font-size, $font-weight, $line-height, $font-family) {\n // If any of the values are set to `inherit`, we can't use the shorthand\n // so we fall back to passing in the individual properties.\n @if ($font-size == inherit or\n $font-weight == inherit or\n $line-height == inherit or\n $font-family == inherit or\n $font-size == null or\n $font-weight == null or\n $line-height == null or\n $font-family == null) {\n\n font-size: $font-size;\n font-weight: $font-weight;\n line-height: $line-height;\n font-family: $font-family;\n }\n @else {\n // Otherwise use the shorthand `font`, because it's the least amount of bytes.\n font: $font-weight list.slash($font-size, $line-height) $font-family;\n }\n}\n\n/// Emits CSS styles for the given typography level.\n/// @param {Map} $config A typography config.\n/// @param {Map} $level A typography level.\n@mixin typography-level($config, $level) {\n // we deliberately do not use the font shorthand here because it overrides\n // certain font properties that can't be configured in the current typography\n // config, e.g. the font-variant-caps or font-feature-settings property\n font-size: property-getters.font-size($config, $level);\n font-weight: property-getters.font-weight($config, $level);\n line-height: property-getters.line-height($config, $level);\n font-family: property-getters.font-family($config, $level);\n letter-spacing: property-getters.letter-spacing($config, $level);\n}\n\n/// Coerce a value to `em` if it is a unitless number, otherwise returns\n/// the value provided.\n@function private-coerce-unitless-to-em($value) {\n @return if(math.is-unitless($value), 1em * $value, $value);\n}\n","@use 'sass:color';\n@use '@material/chips/chip-theme' as mdc-chip-theme;\n@use '../core/tokens/m2/mdc/chip' as tokens-mdc-chip;\n@use '../core/tokens/m2/mat/chip' as tokens-mat-chip;\n@use '../core/tokens/token-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-chips.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n .mat-mdc-standard-chip {\n @include mdc-chip-theme.theme(tokens-mdc-chip.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected chip: primary, secondary, tertiary,\n/// or error (If not specified, default secondary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-standard-chip {\n $default-color-tokens: tokens-mdc-chip.get-color-tokens($theme);\n @include mdc-chip-theme.theme($default-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme));\n\n &.mat-mdc-chip-selected,\n &.mat-mdc-chip-highlighted {\n &.mat-primary {\n $primary-color-tokens: tokens-mdc-chip.get-color-tokens($theme, primary);\n @include mdc-chip-theme.theme($primary-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme, primary));\n }\n\n &.mat-accent {\n $accent-color-tokens: tokens-mdc-chip.get-color-tokens($theme, accent);\n @include mdc-chip-theme.theme($accent-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme, accent));\n }\n\n &.mat-warn {\n $warn-color-tokens: tokens-mdc-chip.get-color-tokens($theme, warn);\n @include mdc-chip-theme.theme($warn-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme, warn));\n }\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n $typography-tokens: tokens-mdc-chip.get-typography-tokens($theme);\n\n .mat-mdc-standard-chip {\n @include mdc-chip-theme.theme($typography-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $density-tokens: tokens-mdc-chip.get-density-tokens($theme);\n\n .mat-mdc-chip.mat-mdc-standard-chip {\n @include mdc-chip-theme.theme($density-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected chip: primary, secondary, tertiary,\n/// or error (If not specified, default secondary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-chips') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-chip-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-chip.$prefix, $options...);\n $mat-chip-tokens: token-utils.get-tokens-for($tokens, tokens-mat-chip.$prefix, $options...);\n @include mdc-chip-theme.theme($mdc-chip-tokens);\n @include token-utils.create-token-values(tokens-mat-chip.$prefix, $mat-chip-tokens);\n}\n","@use '@material/switch/switch-theme' as mdc-switch-theme;\n@use '@material/form-field/form-field-theme' as mdc-form-field-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/form-field' as tokens-mdc-form-field;\n@use '../core/tokens/m2/mat/switch' as tokens-mat-switch;\n@use '../core/tokens/m2/mdc/switch' as tokens-mdc-switch;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-switch.get-unthemable-tokens();\n $mdc-tokens: tokens-mdc-switch.get-unthemable-tokens();\n @include mdc-switch-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-tokens);\n }\n }\n}\n\n/// Outputs color theme styles for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slide-toggle: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n $is-dark: inspection.get-theme-type($theme) == dark;\n $mat-tokens: tokens-mat-switch.get-color-tokens($theme);\n $mdc-tokens: tokens-mdc-switch.get-color-tokens($theme);\n\n // Add values for MDC slide toggles tokens\n @include sass-utils.current-selector-or-root() {\n @include mdc-switch-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-tokens);\n\n // TODO(wagnermaciel): Use our token system to define this css variable.\n --mdc-switch-disabled-label-text-color: #{inspection.get-theme-color(\n $theme,\n foreground,\n disabled-text\n )};\n\n .mat-mdc-slide-toggle {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-color-tokens($theme));\n\n // Change the color palette related tokens to accent or warn if applicable\n &.mat-accent {\n @include mdc-switch-theme.theme(\n tokens-mdc-switch.private-get-color-palette-color-tokens($theme, accent));\n }\n\n &.mat-warn {\n @include mdc-switch-theme.theme(\n tokens-mdc-switch.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n $mat-tokens: tokens-mat-switch.get-typography-tokens($theme);\n $mdc-tokens: tokens-mdc-switch.get-typography-tokens($theme);\n\n // Add values for MDC slide toggle tokens\n @include sass-utils.current-selector-or-root() {\n @include mdc-switch-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-tokens);\n\n .mat-mdc-slide-toggle {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-typography-tokens($theme));\n }\n }\n }\n}\n\n/// Outputs density theme styles for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-switch.get-density-tokens($theme);\n $mdc-tokens: tokens-mdc-switch.get-density-tokens($theme);\n @include mdc-switch-theme.theme(tokens-mdc-switch.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slide-toggle: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-slide-toggle') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n // Don't pass $options here, since the mdc-form-field doesn't support color options,\n // only the mdc-switch does.\n $mdc-form-field-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-form-field.$prefix);\n $mat-switch-tokens: token-utils.get-tokens-for($tokens, tokens-mat-switch.$prefix);\n $mdc-switch-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-switch.$prefix, $options...);\n\n @include mdc-form-field-theme.theme($mdc-form-field-tokens);\n @include mdc-switch-theme.theme($mdc-switch-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-switch-tokens);\n}\n","@use '@material/radio/radio-theme' as mdc-radio-theme;\n@use '@material/form-field/form-field-theme' as mdc-form-field-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/form-field' as tokens-mdc-form-field;\n@use '../core/tokens/m2/mdc/radio' as tokens-mdc-radio;\n@use '../core/tokens/m2/mat/radio' as tokens-mat-radio;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-radio.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-radio.$prefix, tokens-mat-radio.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the radio button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-radio-button {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-color-tokens($theme));\n\n &.mat-primary {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, primary));\n @include token-utils.create-token-values(tokens-mat-radio.$prefix,\n tokens-mat-radio.get-color-tokens($theme, primary));\n }\n\n &.mat-accent {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-radio.$prefix,\n tokens-mat-radio.get-color-tokens($theme));\n }\n\n &.mat-warn {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, warn));\n @include token-utils.create-token-values(tokens-mat-radio.$prefix,\n tokens-mat-radio.get-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-typography-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-radio.$prefix, tokens-mat-radio.get-typography-tokens($theme));\n }\n\n .mat-mdc-radio-button {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $density-scale: inspection.get-theme-density($theme);\n\n @include sass-utils.current-selector-or-root() {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-density-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-radio.$prefix, tokens-mat-radio.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the radio button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-radio') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-radio-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-radio.$prefix, $options...);\n $mat-radio-tokens: token-utils.get-tokens-for($tokens, tokens-mat-radio.$prefix, $options...);\n // Don't pass $options here, since the mdc-form-field doesn't support color options,\n // only the mdc-radio and mat-radio do.\n $mdc-form-field-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-form-field.$prefix);\n @include mdc-radio-theme.theme($mdc-radio-tokens);\n @include mdc-form-field-theme.theme($mdc-form-field-tokens);\n @include token-utils.create-token-values(tokens-mat-radio.$prefix, $mat-radio-tokens);\n}\n","@use 'sass:map';\n@use '@material/list/evolution-mixins';\n@use '@material/checkbox/checkbox-theme' as mdc-checkbox-theme;\n@use '@material/radio/radio-theme' as mdc-radio-theme;\n@use '@material/list/list-theme' as mdc-list-theme;\n\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/m2/mat/list' as tokens-mat-list;\n@use '../core/tokens/m2/mdc/checkbox' as tokens-mdc-checkbox;\n@use '../core/tokens/m2/mdc/radio' as tokens-mdc-radio;\n@use '../core/tokens/m2/mdc/list' as tokens-mdc-list;\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n\n@mixin base($theme) {\n // Add default values for tokens not related to color, typography, or density.\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme(tokens-mdc-list.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-unthemable-tokens());\n }\n }\n}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n $mdc-list-color-tokens: tokens-mdc-list.get-color-tokens($theme);\n\n // Add values for MDC list tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme($mdc-list-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-color-tokens($theme));\n }\n\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, primary));\n }\n\n .mat-accent {\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, accent));\n }\n }\n\n .mat-warn {\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, warn));\n }\n }\n\n .mat-mdc-list-option {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, primary));\n }\n .mat-mdc-list-option.mat-accent {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, accent));\n }\n .mat-mdc-list-option.mat-warn {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, warn));\n }\n\n // There is no token for activated color on nav list.\n // TODO(mmalerba): Add a token to MDC or make a custom one.\n .mat-mdc-list-base.mat-mdc-list-base {\n @include evolution-mixins.list-selected-ink-color(\n inspection.get-theme-color($theme, primary));\n }\n\n // TODO(mmalerba): Leaking styles from the old MDC list mixins used in other components can\n // cause opacity issues, so we need this override for now. We can remove it when all\n // Angular Material components stop using the old MDC mixins.\n .mat-mdc-list-base .mdc-list-item--disabled {\n .mdc-list-item__start,\n .mdc-list-item__content,\n .mdc-list-item__end {\n opacity: 1;\n }\n }\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $density-scale: inspection.get-theme-density($theme);\n $mdc-list-density-tokens: tokens-mdc-list.get-density-tokens($theme);\n\n // Add values for MDC list tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme($mdc-list-density-tokens);\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-density-tokens($theme));\n }\n\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-density-tokens($theme));\n }\n\n // TODO(mmalerba): This is added to maintain the same style MDC used prior to the token-based\n // API, to avoid screenshot diffs. We should remove it in favor of following MDC's current\n // style, or add custom tokens for it.\n .mat-mdc-list-item {\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-icon {\n &.mdc-list-item--with-one-line {\n height: map.get((\n 0: 56px,\n -1: 52px,\n -2: 48px,\n -3: 44px,\n -4: 40px,\n -5: 40px,\n ), $density-scale);\n }\n\n &.mdc-list-item--with-two-lines {\n height: map.get((\n 0: 72px,\n -1: 68px,\n -2: 64px,\n -3: 60px,\n -4: 56px,\n -5: 56px,\n ), $density-scale);\n }\n }\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n $mdc-list-typography-tokens: tokens-mdc-list.get-typography-tokens($theme);\n\n // Add values for MDC list tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme($mdc-list-typography-tokens);\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-typography-tokens($theme));\n }\n\n // MDC does not have tokens for the subheader.\n // TODO(mmalerba): Discuss with MDC about adding them, or create custom tokens.\n .mdc-list-group__subheader {\n font: inspection.get-theme-typography($theme, subtitle-1, font);\n letter-spacing: inspection.get-theme-typography($theme, subtitle-1, letter-spacing);\n }\n }\n}\n\n@mixin theme($theme) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-list') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme));\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @include mdc-list-theme.theme(token-utils.get-tokens-for($tokens, tokens-mdc-list.$prefix));\n\n $mat-list-tokens: token-utils.get-tokens-for($tokens, tokens-mat-list.$prefix);\n @include token-utils.create-token-values(tokens-mat-list.$prefix, $mat-list-tokens);\n}\n","@use '@material/tab-indicator/tab-indicator-theme' as mdc-tab-indicator-theme;\n@use '@material/tab/tab-theme' as mdc-tab-theme;\n@use '../core/style/sass-utils';\n@use '../core/tokens/m2/mdc/tab' as tokens-mdc-tab;\n@use '../core/tokens/m2/mdc/tab-indicator' as tokens-mdc-tab-indicator;\n@use '../core/tokens/m2/mat/tab-header' as tokens-mat-tab-header;\n@use '../core/tokens/m2/mat/tab-header-with-background' as tokens-mat-tab-header-with-background;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/tokens/token-utils';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-tab.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-tab-indicator-theme.theme(tokens-mdc-tab-indicator.get-unthemable-tokens());\n @include mdc-tab-theme.secondary-navigation-tab-theme(tokens-mdc-tab.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-tab-header.$prefix, tokens-mat-tab-header.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-unthemable-tokens()\n );\n }\n }\n}\n\n/// Outputs color theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the tab indicator: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-tab-group, .mat-mdc-tab-nav-bar {\n @include _palette-styles($theme, primary);\n\n &.mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-styles($theme, warn);\n }\n\n &.mat-background-primary {\n @include _background-styles($theme, primary);\n }\n\n &.mat-background-accent {\n @include _background-styles($theme, accent);\n }\n\n &.mat-background-warn {\n @include _background-styles($theme, warn);\n }\n }\n }\n}\n\n@mixin _background-styles($theme, $palette-name) {\n @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-color-tokens($theme, $palette-name));\n}\n\n@mixin _palette-styles($theme, $palette-name) {\n @include mdc-tab-theme.secondary-navigation-tab-theme(\n tokens-mdc-tab.get-color-tokens($theme, $palette-name));\n @include mdc-tab-indicator-theme.theme(\n tokens-mdc-tab-indicator.get-color-tokens($theme, $palette-name));\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,\n tokens-mat-tab-header.get-color-tokens($theme, $palette-name));\n}\n\n/// Outputs typography theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n .mat-mdc-tab-header {\n @include mdc-tab-theme.secondary-navigation-tab-theme(\n tokens-mdc-tab.get-typography-tokens($theme));\n @include mdc-tab-indicator-theme.theme(\n tokens-mdc-tab-indicator.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,\n tokens-mat-tab-header.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n .mat-mdc-tab-header {\n @include mdc-tab-theme.secondary-navigation-tab-theme(\n tokens-mdc-tab.get-density-tokens($theme));\n @include mdc-tab-indicator-theme.theme(\n tokens-mdc-tab-indicator.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,\n tokens-mat-tab-header.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the tab indicator: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-tabs') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-tab-indicator-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mdc-tab-indicator.$prefix, $options...);\n $mat-tab-header-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mat-tab-header.$prefix, $options...);\n // Don't pass $options here, because the mdc-tab doesn't have color variants,\n // only the mdc-tab-indicator and mat-tab-header do.\n $mdc-tab-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-tab.$prefix);\n @include mdc-tab-theme.secondary-navigation-tab-theme($mdc-tab-tokens);\n @include mdc-tab-indicator-theme.theme($mdc-tab-indicator-tokens);\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix, $mat-tab-header-tokens);\n}\n","@use '@material/checkbox/checkbox-theme' as mdc-checkbox-theme;\n@use '@material/form-field/form-field-theme' as mdc-form-field-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/checkbox' as tokens-mdc-checkbox;\n@use '../core/tokens/m2/mdc/form-field' as tokens-mdc-form-field;\n@use '../core/tokens/m2/mat/checkbox' as tokens-mat-checkbox;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-checkbox.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the checkbox: primary, secondary, tertiary, or\n/// error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-color-tokens($theme));\n }\n\n .mat-mdc-checkbox {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-color-tokens($theme));\n\n &.mat-primary {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, primary));\n }\n\n &.mat-warn {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-typography-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-typography-tokens($theme));\n }\n\n .mat-mdc-checkbox {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n $density-scale: inspection.get-theme-density($theme);\n\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-density-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the checkbox: primary, secondary, tertiary, or\n/// error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-checkbox') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-checkbox-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mdc-checkbox.$prefix, $options...);\n // Don't pass $options here, since the mdc-form-field doesn't support color options,\n // only the mdc-checkbox does.\n $mdc-form-field-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-form-field.$prefix);\n $mat-checkbox-tokens: token-utils.get-tokens-for($tokens, tokens-mat-checkbox.$prefix);\n @include mdc-checkbox-theme.theme($mdc-checkbox-tokens);\n @include mdc-form-field-theme.theme($mdc-form-field-tokens);\n @include token-utils.create-token-values(tokens-mat-checkbox.$prefix, $mat-checkbox-tokens);\n}\n","@use '@angular/cdk';\n@use '../tokens/m2/mat/ripple' as tokens-mat-ripple;\n@use '../tokens/token-utils';\n\n@mixin ripple() {\n // The host element of an mat-ripple directive should always have a position of \"absolute\" or\n // \"relative\" so that the ripples inside are correctly positioned relatively to the container.\n .mat-ripple {\n overflow: hidden;\n\n // By default, every ripple container should have position: relative in favor of creating an\n // easy API for developers using the MatRipple directive.\n position: relative;\n\n // Promote containers that have ripples to a new layer. We want to target `:not(:empty)`,\n // because we don't want all ripple containers to have their own layer since they're used in a\n // lot of places and the layer is only relevant while animating. Note that ideally we'd use\n // the `contain` property here (see #13175), because `:empty` can be broken by having extra\n // text inside the element, but it isn't very well supported yet.\n &:not(:empty) {\n transform: translateZ(0);\n }\n }\n\n .mat-ripple.mat-ripple-unbounded {\n overflow: visible;\n }\n\n .mat-ripple-element {\n position: absolute;\n border-radius: 50%;\n pointer-events: none;\n\n transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);\n\n // We use a 3d transform here in order to avoid an issue in Safari where\n // the ripples aren't clipped when inside the shadow DOM (see #24028).\n transform: scale3d(0, 0, 0);\n\n @include token-utils.use-tokens(\n tokens-mat-ripple.$prefix, tokens-mat-ripple.get-token-slots()) {\n // We have to emit a fallback value here, because some internal builds depend on it.\n background-color: var(#{token-utils.get-token-variable(color)}, rgba(#000, 0.1));\n }\n\n // In high contrast mode the ripple is opaque, causing it to obstruct the content.\n @include cdk.high-contrast(active, off) {\n display: none;\n }\n }\n}\n","/// Emits a CSS class, `.cdk-visually-hidden`. This class can be applied to an element\n/// to make that element visually hidden while remaining available to assistive technology.\n@mixin a11y-visually-hidden() {\n .cdk-visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px;\n\n // This works around a Chrome bug that can cause the tab to crash when large amounts of\n // non-English text get wrapped: https://bugs.chromium.org/p/chromium/issues/detail?id=1201444\n white-space: nowrap;\n\n // Avoid browsers rendering the focus ring in some cases.\n outline: 0;\n\n // Avoid some cases where the browser will still render the native controls (see #9049).\n -webkit-appearance: none;\n -moz-appearance: none;\n\n // We need at least one of top/bottom/left/right in order to prevent cases where the\n // absolute-positioned element is pushed down and can affect scrolling (see #24597).\n // `left` was chosen here, because it's the least likely to break overrides where the\n // element might have been positioned (e.g. `mat-checkbox`).\n left: 0;\n\n [dir='rtl'] & {\n left: auto;\n right: 0;\n }\n }\n}\n\n/// @deprecated Use `a11y-visually-hidden`.\n@mixin a11y() {\n @include a11y-visually-hidden;\n}\n\n/// Emits the mixin's content nested under `$selector-context` if `$selector-context`\n/// is non-empty.\n/// @param {String} selector-context The selector under which to nest the mixin's content.\n@mixin _optionally-nest-content($selector-context) {\n @if ($selector-context == '') {\n @content;\n }\n @else {\n #{$selector-context} {\n @content;\n }\n }\n}\n\n/// Applies styles for users in high contrast mode. Note that this only applies\n/// to Microsoft browsers. Chrome can be included by checking for the `html[hc]`\n/// attribute, however Chrome handles high contrast differently.\n///\n/// @param {String} target Type of high contrast setting to target. Defaults to `active`, can be\n/// `white-on-black` or `black-on-white`.\n/// @param {String} encapsulation Whether to emit styles for view encapsulation. Values are:\n/// * `on` - works for `Emulated`, `Native`, and `ShadowDom`\n/// * `off` - works for `None`\n/// * `any` - works for all encapsulation modes by emitting the CSS twice (default).\n@mixin high-contrast($target: active, $encapsulation: 'any') {\n @if ($target != 'active' and $target != 'black-on-white' and $target != 'white-on-black') {\n @error 'Unknown cdk-high-contrast value \"#{$target}\" provided. ' +\n 'Allowed values are \"active\", \"black-on-white\", and \"white-on-black\"';\n }\n\n @if ($encapsulation != 'on' and $encapsulation != 'off' and $encapsulation != 'any') {\n @error 'Unknown cdk-high-contrast encapsulation \"#{$encapsulation}\" provided. ' +\n 'Allowed values are \"on\", \"off\", and \"any\"';\n }\n\n // If the selector context has multiple parts, such as `.section, .region`, just doing\n // `.cdk-high-contrast-xxx #{&}` will only apply the parent selector to the first part of the\n // context. We address this by nesting the selector context under .cdk-high-contrast.\n @at-root {\n $selector-context: #{&};\n\n @if ($encapsulation != 'on') {\n // Note that if this selector is updated, the same change has to be made inside\n // `_overlay.scss` which can't depend on this mixin due to some infrastructure limitations.\n .cdk-high-contrast-#{$target} {\n @include _optionally-nest-content($selector-context) {\n @content;\n }\n }\n }\n\n @if ($encapsulation != 'off') {\n .cdk-high-contrast-#{$target} :host {\n @include _optionally-nest-content($selector-context) {\n @content;\n }\n }\n }\n }\n}\n","// We want overlays to always appear over user content, so set a baseline\n// very high z-index for the overlay container, which is where we create the new\n// stacking context for all overlays.\n$overlay-container-z-index: 1000 !default;\n$overlay-z-index: 1000 !default;\n$overlay-backdrop-z-index: 1000 !default;\n\n// Background color for all of the backdrops\n$overlay-backdrop-color: rgba(0, 0, 0, 0.32) !default;\n\n// Default backdrop animation is based on the Material Design swift-ease-out.\n$backdrop-animation-duration: 400ms !default;\n$backdrop-animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\n\n/// Emits structural styles required for cdk/overlay to function.\n@mixin overlay() {\n .cdk-overlay-container, .cdk-global-overlay-wrapper {\n // Disable events from being captured on the overlay container.\n pointer-events: none;\n\n // The container should be the size of the viewport.\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n\n // The overlay-container is an invisible element which contains all individual overlays.\n .cdk-overlay-container {\n position: fixed;\n z-index: $overlay-container-z-index;\n\n &:empty {\n // Hide the element when it doesn't have any child nodes. This doesn't\n // include overlays that have been detached, rather than disposed.\n display: none;\n }\n }\n\n // We use an extra wrapper element in order to use make the overlay itself a flex item.\n // This makes centering the overlay easy without running into the subpixel rendering\n // problems tied to using `transform` and without interfering with the other position\n // strategies.\n .cdk-global-overlay-wrapper {\n display: flex;\n position: absolute;\n z-index: $overlay-z-index;\n }\n\n // A single overlay pane.\n .cdk-overlay-pane {\n // Note: it's important for this one to start off `absolute`,\n // in order for us to be able to measure it correctly.\n position: absolute;\n pointer-events: auto;\n box-sizing: border-box;\n z-index: $overlay-z-index;\n\n // For connected-position overlays, we set `display: flex` in\n // order to force `max-width` and `max-height` to take effect.\n display: flex;\n max-width: 100%;\n max-height: 100%;\n }\n\n .cdk-overlay-backdrop {\n // TODO(jelbourn): reuse sidenav fullscreen mixin.\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n\n z-index: $overlay-backdrop-z-index;\n pointer-events: auto;\n -webkit-tap-highlight-color: transparent;\n transition: opacity $backdrop-animation-duration $backdrop-animation-timing-function;\n opacity: 0;\n\n &.cdk-overlay-backdrop-showing {\n opacity: 1;\n\n // Note that we can't import and use the `high-contrast` mixin from `_a11y.scss`, because\n // this file will be copied to the top-level `cdk` package when putting together the files\n // for npm. Any relative import paths we use here will become invalid once the file is copied.\n .cdk-high-contrast-active & {\n // In high contrast mode the rgba background will become solid\n // so we need to fall back to making it opaque using `opacity`.\n opacity: 0.6;\n }\n }\n }\n\n .cdk-overlay-dark-backdrop {\n background: $overlay-backdrop-color;\n }\n\n .cdk-overlay-transparent-backdrop {\n // Define a transition on the visibility so that the `transitionend` event can fire immediately.\n transition: visibility 1ms linear, opacity 1ms linear;\n visibility: hidden;\n opacity: 1;\n\n // Note: as of Firefox 57, having the backdrop be `background: none` will prevent it from\n // capturing the user's mouse scroll events. Since we also can't use something like\n // `rgba(0, 0, 0, 0)`, we work around the inconsistency by not setting the background at\n // all and using `opacity` to make the element transparent.\n &.cdk-overlay-backdrop-showing {\n opacity: 0;\n visibility: visible;\n }\n }\n\n .cdk-overlay-backdrop-noop-animation {\n transition: none;\n }\n\n // Overlay parent element used with the connected position strategy. Used to constrain the\n // overlay element's size to fit within the viewport.\n .cdk-overlay-connected-position-bounding-box {\n position: absolute;\n z-index: $overlay-z-index;\n\n // We use `display: flex` on this element exclusively for centering connected overlays.\n // When *not* centering, a top/left/bottom/right will be set which overrides the normal\n // flex layout.\n display: flex;\n\n // We use the `column` direction here to avoid some flexbox issues in Edge\n // when using the \"grow after open\" options.\n flex-direction: column;\n\n // Add some dimensions so the element has an `innerText` which some people depend on in tests.\n min-width: 1px;\n min-height: 1px;\n }\n\n // Used when disabling global scrolling.\n .cdk-global-scrollblock {\n position: fixed;\n\n // Necessary for the content not to lose its width. Note that we're using 100%, instead of\n // 100vw, because 100vw includes the width plus the scrollbar, whereas 100% is the width\n // that the element had before we made it `fixed`.\n width: 100%;\n\n // Note: this will always add a scrollbar to whatever element it is on, which can\n // potentially result in double scrollbars. It shouldn't be an issue, because we won't\n // block scrolling on a page that doesn't have a scrollbar in the first place.\n overflow-y: scroll;\n }\n}\n","// Structural styles for the autosize text fields.\n@mixin text-field-autosize() {\n // Remove the resize handle on autosizing textareas, because whatever height\n // the user resized to will be overwritten once they start typing again.\n textarea.cdk-textarea-autosize {\n resize: none;\n }\n\n // This class is temporarily applied to the textarea when it is being measured. It is immediately\n // removed when measuring is complete. We use `!important` rules here to make sure user-specified\n // rules do not interfere with the measurement.\n textarea.cdk-textarea-autosize-measuring {\n @include _autosize-measuring-base;\n height: auto !important;\n overflow: hidden !important;\n }\n\n // Similar to the `cdk-textarea-autosize-measuring` class, but only applied on Firefox. We need\n // to use this class, because Firefox has a bug where changing the `overflow` breaks the user's\n // ability to undo/redo what they were typing (see #16629). This class is only scoped to Firefox,\n // because the measurements there don't seem to be affected by the `height: 0`, whereas on other\n // browsers they are, e.g. Chrome detects longer text and IE does't resize back to normal.\n // Identical issue report: https://bugzilla.mozilla.org/show_bug.cgi?id=448784\n textarea.cdk-textarea-autosize-measuring-firefox {\n @include _autosize-measuring-base;\n height: 0 !important;\n }\n}\n\n// Core styles that enable monitoring autofill state of text fields.\n@mixin text-field-autofill() {\n // Keyframes that apply no styles, but allow us to monitor when an text field becomes autofilled\n // by watching for the animation events that are fired when they start. Note: the /*!*/ comment is\n // needed to prevent LibSass from stripping the keyframes out.\n // Based on: https://medium.com/@brunn/detecting-autofilled-fields-in-javascript-aed598d25da7\n @keyframes cdk-text-field-autofill-start {/*!*/}\n @keyframes cdk-text-field-autofill-end {/*!*/}\n\n .cdk-text-field-autofill-monitored:-webkit-autofill {\n // Since Chrome 80 we need a 1ms delay, or the animationstart event won't fire.\n animation: cdk-text-field-autofill-start 0s 1ms;\n }\n\n .cdk-text-field-autofill-monitored:not(:-webkit-autofill) {\n // Since Chrome 80 we need a 1ms delay, or the animationstart event won't fire.\n animation: cdk-text-field-autofill-end 0s 1ms;\n }\n}\n\n@mixin _autosize-measuring-base {\n // Having 2px top and bottom padding seems to fix a bug where Chrome gets an incorrect\n // measurement. We just have to account for it later and subtract it off the final result.\n padding: 2px 0 !important;\n box-sizing: content-box !important;\n}\n\n// Used to generate UIDs for keyframes used to change the text field autofill styles.\n$autofill-color-frame-count: 0;\n\n// Mixin used to apply custom background and foreground colors to an autofilled text field.\n// Based on: https://stackoverflow.com/questions/2781549/\n// removing-input-background-colour-for-chrome-autocomplete#answer-37432260\n@mixin text-field-autofill-color($background, $foreground:'') {\n @keyframes cdk-text-field-autofill-color-#{$autofill-color-frame-count} {\n to {\n background: $background;\n @if $foreground != '' { color: $foreground; }\n }\n }\n\n &:-webkit-autofill {\n animation: cdk-text-field-autofill-color-#{$autofill-color-frame-count} both;\n }\n\n &.cdk-text-field-autofill-monitored:-webkit-autofill {\n // Since Chrome 80 we need a 1ms delay for cdk-text-field-autofill-start, or the animationstart\n // event won't fire.\n animation: cdk-text-field-autofill-start 0s 1ms,\n cdk-text-field-autofill-color-#{$autofill-color-frame-count} both;\n }\n\n $autofill-color-frame-count: $autofill-color-frame-count + 1 !global;\n}\n\n// @deprecated Use `autosize` and `autofill` instead.\n@mixin text-field {\n @include text-field-autosize();\n @include text-field-autofill();\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use '@angular/cdk';\n@use '../style/layout-common';\n@use '../theming/theming';\n@use '../theming/inspection';\n\n// Private sass variables that will be used as reference throughout component stylesheets.\n$default-border-width: 3px;\n$default-border-style: solid;\n$default-border-color: transparent;\n$default-border-radius: 4px;\n\n// Mixin that renders the focus indicator structural styles.\n@mixin structural-styling($prefix) {\n .#{$prefix}-focus-indicator {\n position: relative;\n\n &::before {\n @include layout-common.fill();\n box-sizing: border-box;\n pointer-events: none;\n display: var(--#{$prefix}-focus-indicator-display, none); // Hide the indicator by default.\n border: var(\n --#{$prefix}-focus-indicator-border-width,\n #{$default-border-width}\n )\n var(\n --#{$prefix}-focus-indicator-border-style,\n #{$default-border-style}\n )\n var(\n --#{$prefix}-focus-indicator-border-color,\n #{$default-border-color}\n );\n border-radius: var(\n --#{$prefix}-focus-indicator-border-radius,\n #{$default-border-radius}\n );\n }\n\n // By default, render the focus indicator when the focus indicator host element takes focus.\n // Defining a pseudo element's content will cause it to render.\n &:focus::before {\n content: '';\n }\n }\n\n // Enable the indicator in high contrast mode.\n @include cdk.high-contrast(active, off) {\n @include customize-focus-indicators((display: block), $prefix);\n }\n}\n\n// Generates CSS variable declarations from a map.\n@mixin _output-variables($map) {\n @each $key, $value in $map {\n @if ($value) {\n --#{$key}: #{$value};\n }\n }\n}\n\n// Mixin that dedups CSS variables for the strong-focus-indicators mixin.\n@mixin customize-focus-indicators($config, $prefix) {\n $border-style: map.get($config, border-style);\n $border-width: map.get($config, border-width);\n $border-radius: map.get($config, border-radius);\n $border-color: map.get($config, border-color);\n $display: map.get($config, display);\n $map: (\n '#{$prefix}-focus-indicator-border-style': $border-style,\n '#{$prefix}-focus-indicator-border-width': $border-width,\n '#{$prefix}-focus-indicator-border-radius': $border-radius,\n '#{$prefix}-focus-indicator-border-color': $border-color,\n '#{$prefix}-focus-indicator-display': $display,\n );\n\n @if (&) {\n @include _output-variables($map);\n }\n @else {\n // We use `html` here instead of `:root`, because the\n // latter causes some issues with internal tooling.\n html {\n @include _output-variables($map);\n }\n }\n}\n\n@mixin strong-focus-indicators($config: ()) {\n // Default focus indicator config.\n $default-config: (\n border-color: black,\n display: block,\n );\n\n // Merge default config with user config.\n $config: map.merge($default-config, $config);\n\n @include customize-focus-indicators($config, 'mat');\n}\n\n@mixin mdc-strong-focus-indicators($config: ()) {\n // Default focus indicator config.\n $default-config: (\n border-color: black,\n display: block,\n );\n\n // Merge default config with user config.\n $config: map.merge($default-config, $config);\n\n @include customize-focus-indicators($config, 'mat-mdc');\n}\n\n@mixin strong-focus-indicators-color($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat');\n }\n @else {\n $border-color: inspection.get-theme-color($theme-or-color, primary);\n @include customize-focus-indicators((\n border-color: $border-color\n ), 'mat');\n }\n}\n\n@mixin strong-focus-indicators-theme($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat');\n }\n @else {\n @include theming.private-check-duplicate-theme-styles($theme-or-color, 'mat-focus-indicators') {\n @if inspection.theme-has($theme-or-color, color) {\n @include strong-focus-indicators-color($theme-or-color);\n }\n }\n }\n}\n\n@mixin mdc-strong-focus-indicators-color($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat-mdc');\n }\n @else {\n $border-color: inspection.get-theme-color($theme-or-color, primary);\n @include customize-focus-indicators((\n border-color: $border-color\n ), 'mat-mdc');\n }\n}\n\n@mixin mdc-strong-focus-indicators-theme($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat-mdc');\n }\n @else {\n @include theming.private-check-duplicate-theme-styles(\n $theme-or-color, 'mat-mdc-focus-indicators') {\n @if inspection.theme-has($theme-or-color, color) {\n @include mdc-strong-focus-indicators-color($theme-or-color);\n }\n }\n }\n}\n","// This mixin ensures an element spans to fill the nearest ancestor with defined positioning.\n@mixin fill {\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n position: absolute;\n}\n","@use '@angular/cdk';\n@use './tokens/m2/mat/app' as tokens-mat-app;\n@use './tokens/token-utils';\n@use './ripple/ripple';\n@use './focus-indicators/private';\n@use './mdc-helpers/mdc-helpers';\n\n// Mixin that renders all of the core styles that are not theme-dependent.\n@mixin core() {\n @include ripple.ripple();\n @include cdk.a11y-visually-hidden();\n @include cdk.overlay();\n @include cdk.text-field-autosize();\n @include cdk.text-field-autofill();\n @include private.structural-styling('mat');\n @include private.structural-styling('mat-mdc');\n\n // Wrapper element that provides the theme background when the\n // user's content isn't inside of a `mat-sidenav-container`.\n @at-root {\n .mat-app-background {\n @include mdc-helpers.disable-mdc-fallback-declarations {\n @include token-utils.use-tokens(tokens-mat-app.$prefix, tokens-mat-app.get-token-slots()) {\n // Note: we need to emit fallback values here to avoid errors in internal builds.\n @include token-utils.create-token-slot(background-color, background-color, transparent);\n @include token-utils.create-token-slot(color, text-color, inherit);\n }\n }\n }\n }\n}\n","@use '../tokens/m2/mat/option' as tokens-mat-option;\n@use '../tokens/token-utils';\n@use '../style/sass-utils';\n@use '../theming/theming';\n@use '../theming/inspection';\n@use '../theming/validation';\n@use '../typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-option.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {}\n}\n\n/// Outputs color theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected option: primary, secondary,\n/// tertiary, or error (If not specified, default secondary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-color-tokens($theme));\n }\n\n .mat-accent {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-color-tokens($theme, accent));\n }\n\n .mat-warn {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-color-tokens($theme, warn));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {}\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected option: primary, secondary,\n/// tertiary, or error (If not specified, default secondary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-option') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-option-tokens: token-utils.get-tokens-for($tokens, tokens-mat-option.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-option.$prefix, $mat-option-tokens);\n}\n","@use '../../theming/theming';\n@use '../../theming/inspection';\n@use '../../theming/validation';\n@use '../../style/sass-utils';\n@use '../../tokens/token-utils';\n@use '../../tokens/m2/mat/full-pseudo-checkbox' as tokens-mat-full-pseudo-checkbox;\n@use '../../tokens/m2/mat/minimal-pseudo-checkbox' as tokens-mat-minimal-pseudo-checkbox;\n\n@mixin _palette-styles($theme, $palette-name) {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-full-pseudo-checkbox.$prefix,\n tokens-mat-full-pseudo-checkbox.get-color-tokens($theme, $palette-name));\n @include token-utils.create-token-values(tokens-mat-minimal-pseudo-checkbox.$prefix,\n tokens-mat-minimal-pseudo-checkbox.get-color-tokens($theme, $palette-name));\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-full-pseudo-checkbox-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-full-pseudo-checkbox.$prefix, $options...);\n $mat-minimal-pseudo-checkbox-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-minimal-pseudo-checkbox.$prefix, $options...);\n @include token-utils.create-token-values(\n tokens-mat-full-pseudo-checkbox.$prefix, $mat-full-pseudo-checkbox-tokens);\n @include token-utils.create-token-values(\n tokens-mat-minimal-pseudo-checkbox.$prefix, $mat-minimal-pseudo-checkbox-tokens);\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {}\n\n/// Outputs color theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the pseudo-checkbox: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-primary {\n @include _palette-styles($theme, primary);\n }\n\n // Default to the accent color. Note that the pseudo checkboxes are meant to inherit the\n // theme from their parent, rather than implementing their own theming, which is why we\n // don't attach to the `mat-*` classes. Also note that this needs to be below `.mat-primary`\n // in order to allow for the color to be overwritten if the checkbox is inside a parent that\n // has `mat-accent` and is placed inside another parent that has `mat-primary`.\n @include _palette-styles($theme, accent);\n .mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n .mat-warn {\n @include _palette-styles($theme, warn);\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n}\n\n/// Outputs density theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the pseudo-checkbox: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-pseudo-checkbox') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n","@use './theming/theming';\n@use './theming/inspection';\n@use './theming/validation';\n@use './style/private';\n@use './ripple/ripple-theme';\n@use './option/option-theme';\n@use './option/optgroup-theme';\n@use './selection/pseudo-checkbox/pseudo-checkbox-theme';\n@use './style/elevation';\n@use './style/sass-utils';\n@use './typography/typography';\n@use './tokens/token-utils';\n@use './tokens/m2/mat/app' as tokens-mat-app;\n@use './tokens/m2/mat/ripple' as tokens-mat-ripple;\n@use './tokens/m2/mat/option' as tokens-mat-option;\n@use './tokens/m2/mat/full-pseudo-checkbox' as tokens-mat-full-pseudo-checkbox;\n@use './tokens/m2/mat/minimal-pseudo-checkbox' as tokens-mat-minimal-pseudo-checkbox;\n\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include ripple-theme.base($theme);\n @include option-theme.base($theme);\n @include optgroup-theme.base($theme);\n @include pseudo-checkbox-theme.base($theme);\n }\n}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n @include ripple-theme.color($theme);\n @include option-theme.color($theme);\n @include optgroup-theme.color($theme);\n @include pseudo-checkbox-theme.color($theme);\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-app.$prefix,\n tokens-mat-app.get-color-tokens($theme));\n }\n\n // Provides external CSS classes for each elevation value. Each CSS class is formatted as\n // `mat-elevation-z$zValue` where `$zValue` corresponds to the z-space to which the element is\n // elevated.\n @for $zValue from 0 through 24 {\n $selector: elevation.$prefix + $zValue;\n // We need the `mat-mdc-elevation-specific`, because some MDC mixins\n // come with elevation baked in and we don't have a way of removing it.\n .#{$selector}, .mat-mdc-elevation-specific.#{$selector} {\n @include private.private-theme-elevation($zValue, $theme);\n }\n }\n }\n\n // TODO(crisbeto): move this into the base.\n // Marker that is used to determine whether the user has added a theme to their page.\n @at-root {\n .mat-theme-loaded-marker {\n display: none;\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include option-theme.typography($theme);\n @include optgroup-theme.typography($theme);\n @include pseudo-checkbox-theme.typography($theme);\n @include ripple-theme.typography($theme);\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include option-theme.density($theme);\n @include optgroup-theme.density($theme);\n @include pseudo-checkbox-theme.density($theme);\n @include ripple-theme.density($theme);\n }\n}\n\n// Mixin that renders all of the core styles that depend on the theme.\n@mixin theme($theme, $options...) {\n // Wrap the sub-theme includes in the duplicate theme styles mixin. This ensures that\n // there won't be multiple warnings. e.g. if `mat-core-theme` reports a warning, then\n // the imported themes (such as `mat-ripple-theme`) should not report again.\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-core') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-app-tokens: token-utils.get-tokens-for($tokens, tokens-mat-app.$prefix, $options...);\n $mat-ripple-tokens: token-utils.get-tokens-for($tokens, tokens-mat-ripple.$prefix, $options...);\n $mat-option-tokens: token-utils.get-tokens-for($tokens, tokens-mat-option.$prefix, $options...);\n $mat-full-pseudo-checkbox-tokens: token-utils.get-tokens-for($tokens,\n tokens-mat-full-pseudo-checkbox.$prefix, $options...);\n $mat-minimal-pseudo-checkbox-tokens: token-utils.get-tokens-for($tokens,\n tokens-mat-minimal-pseudo-checkbox.$prefix, $options...);\n\n @include token-utils.create-token-values(tokens-mat-app.$prefix, $mat-app-tokens);\n @include token-utils.create-token-values(tokens-mat-ripple.$prefix, $mat-ripple-tokens);\n @include token-utils.create-token-values(tokens-mat-option.$prefix, $mat-option-tokens);\n @include token-utils.create-token-values(tokens-mat-full-pseudo-checkbox.$prefix,\n $mat-full-pseudo-checkbox-tokens);\n @include token-utils.create-token-values(tokens-mat-minimal-pseudo-checkbox.$prefix,\n $mat-minimal-pseudo-checkbox-tokens);\n}\n","@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mdc/linear-progress' as tokens-mdc-linear-progress;\n@use '@material/linear-progress/linear-progress-theme' as mdc-linear-progress-theme;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-linear-progress-theme.theme(tokens-mdc-linear-progress.get-unthemable-tokens());\n }\n }\n}\n\n@mixin _palette-styles($theme, $palette-name) {\n @include mdc-linear-progress-theme.theme(\n tokens-mdc-linear-progress.get-color-tokens($theme, $palette-name));\n}\n\n/// Outputs color theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the progress bar: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-progress-bar {\n @include _palette-styles($theme, primary);\n\n &.mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-styles($theme, warn);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {}\n\n\n/// Outputs density theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the progress bar: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-progress-bar') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-linear-progress-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-linear-progress.$prefix, $options...);\n @include mdc-linear-progress-theme.theme($mdc-linear-progress-tokens);\n}\n","@use '@material/textfield/filled-text-field-theme' as mdc-filled-text-field-theme;\n@use '@material/textfield/outlined-text-field-theme' as mdc-outlined-text-field-theme;\n@use '../core/tokens/m2/mdc/filled-text-field' as tokens-mdc-filled-text-field;\n@use '../core/tokens/m2/mdc/outlined-text-field' as tokens-mdc-outlined-text-field;\n@use '../core/tokens/m2/mat/form-field' as tokens-mat-form-field;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-form-field.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(\n tokens-mdc-filled-text-field.$prefix,\n tokens-mdc-filled-text-field.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mdc-outlined-text-field.$prefix,\n tokens-mdc-outlined-text-field.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the form field: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.get-color-tokens($theme));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.get-color-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-color-tokens($theme));\n }\n\n .mat-mdc-form-field.mat-accent {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.private-get-color-palette-color-tokens($theme, accent));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.private-get-color-palette-color-tokens($theme, accent));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-mdc-form-field.mat-warn {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.private-get-color-palette-color-tokens($theme, warn));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.private-get-color-palette-color-tokens($theme, warn));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.get-typography-tokens($theme));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the form field: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-filled-text-field-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-filled-text-field.$prefix, $options...);\n $mdc-outlined-text-field-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-outlined-text-field.$prefix, $options...);\n $mat-form-field-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-form-field.$prefix, $options...);\n @include mdc-filled-text-field-theme.theme($mdc-filled-text-field-tokens);\n @include mdc-outlined-text-field-theme.theme($mdc-outlined-text-field-tokens);\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix, $mat-form-field-tokens);\n}\n","@use '../core/tokens/m2/mat/select' as tokens-mat-select;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-select.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-select.get-unthemable-tokens();\n @include token-utils.create-token-values(tokens-mat-select.$prefix, $mat-tokens);\n }\n }\n}\n\n/// Outputs color theme styles for the mat-select.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the select arrow: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-color-tokens($theme));\n\n .mat-mdc-form-field.mat-accent {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-color-tokens($theme, accent));\n }\n\n .mat-mdc-form-field.mat-warn {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-select.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-select.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the select arrow: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-select') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-select-tokens: token-utils.get-tokens-for($tokens, tokens-mat-select.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-select.$prefix, $mat-select-tokens);\n}\n","@use '@material/slider/slider-theme' as mdc-slider-theme;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mat/slider' as tokens-mat-slider;\n@use '../core/tokens/m2/mdc/slider' as tokens-mdc-slider;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-slider.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-slider.get-unthemable-tokens();\n @include token-utils.create-token-values(tokens-mat-slider.$prefix, $mat-tokens);\n @include mdc-slider-theme.theme(tokens-mdc-slider.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-slider.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slider: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n $is-dark: inspection.get-theme-type($theme) == dark;\n\n $mdc-color-tokens: token-utils.resolve-elevation(\n tokens-mdc-slider.get-color-tokens($theme),\n handle-elevation,\n handle-shadow-color\n );\n\n $mat-slider-color-tokens: tokens-mat-slider.get-color-tokens($theme);\n\n // Add values for MDC slider tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-slider-theme.theme($mdc-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-slider.$prefix,\n $mat-slider-color-tokens\n );\n\n .mat-accent {\n @include token-utils.create-token-values(\n tokens-mat-slider.$prefix,\n tokens-mat-slider.private-get-color-palette-color-tokens($theme, accent),\n );\n @include mdc-slider-theme.theme(\n tokens-mdc-slider.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-warn {\n @include token-utils.create-token-values(\n tokens-mat-slider.$prefix,\n tokens-mat-slider.private-get-color-palette-color-tokens($theme, warn),\n );\n @include mdc-slider-theme.theme(\n tokens-mdc-slider.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n }\n}\n\n\n/// Outputs typography theme styles for the mat-slider.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n // Add values for MDC slider tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-slider-theme.theme(tokens-mdc-slider.get-typography-tokens($theme));\n }\n }\n}\n\n\n/// Outputs density theme styles for the mat-slider.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n // Add values for MDC slider tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-slider-theme.theme(tokens-mdc-slider.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slider: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-slider') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-slider-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-slider.$prefix, $options...);\n $mat-slider-tokens: token-utils.get-tokens-for($tokens, tokens-mat-slider.$prefix, $options...);\n @include mdc-slider-theme.theme($mdc-slider-tokens);\n @include token-utils.create-token-values(tokens-mat-slider.$prefix, $mat-slider-tokens);\n}\n","//\n// Copyright 2022 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n// stylelint-disable selector-class-pattern --\n// Internal stylesheet for material list component. Selector '.mdc-*' should\n// only be used in this project.\n\n@use '@material/density/functions' as density-functions;\n@use '@material/dom/mixins' as dom-mixins;\n@use '@material/feature-targeting/feature-targeting';\n@use '@material/ripple/ripple-theme';\n@use '@material/ripple/ripple';\n@use '@material/rtl/rtl';\n@use '@material/shape/mixins' as shape-mixins;\n@use '@material/theme/theme-color';\n@use '@material/theme/theme';\n@use '@material/typography/typography';\n@use './evolution-variables' as variables;\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:math';\n\n$ripple-target: variables.$ripple-target;\n\n@mixin static-styles($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include _high-contrast-mode($query: $query);\n .mdc-list {\n @include _static-list-base($query: $query);\n }\n\n .mdc-list-item__wrapper {\n @include feature-targeting.targets($feat-structure) {\n display: block;\n }\n }\n\n .mdc-list-item {\n @include item-base($query: $query);\n @include _list-item-baseline-height($query: $query);\n @include one-line-item-start-alignment(center, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n @include three-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n\n @include one-line-item-end-alignment(center, $query: $query);\n @include two-line-item-end-alignment(center, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n\n @include feature-targeting.targets($feat-structure) {\n align-items: stretch;\n cursor: pointer;\n }\n\n // Reset mouse cursor for disabled and non-interactive items.\n &.mdc-list-item--disabled,\n &.mdc-list-item--non-interactive {\n @include feature-targeting.targets($feat-structure) {\n cursor: auto;\n }\n }\n\n // TODO(b/254711887): Likely need to update this to adhere to a HCM focus\n // ring spec.\n // For components using aria-activedescendant, the focus pseudoclass is\n // never applied and use `.mdc-ripple-upgraded--background-focused` instead.\n &:not(.mdc-list-item--selected):focus::before,\n &.mdc-ripple-upgraded--background-focused::before {\n @include dom-mixins.transparent-border($query: $query);\n }\n\n &.mdc-list-item--selected::before {\n @include dom-mixins.transparent-border(\n $border-width: 3px,\n $border-style: double,\n $query: $query\n );\n }\n\n &.mdc-list-item--selected:focus::before {\n @include dom-mixins.transparent-border(\n $border-width: 3px,\n $query: $query\n );\n }\n }\n\n // stylelint-disable selector-max-type --\n // Override anchor tag styles for the use-case of a list being used for navigation\n a.mdc-list-item {\n @include feature-targeting.targets($feat-structure) {\n color: inherit;\n text-decoration: none;\n }\n }\n // stylelint-enable selector-max-type\n\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n fill: currentColor;\n flex-shrink: 0;\n pointer-events: none;\n }\n }\n\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n flex-shrink: 0;\n pointer-events: none;\n }\n }\n\n .mdc-list-item__content {\n @include typography.overflow-ellipsis($query);\n @include feature-targeting.targets($feat-structure) {\n align-self: center;\n flex: 1;\n pointer-events: none;\n }\n\n .mdc-list-item--with-two-lines &,\n .mdc-list-item--with-three-lines & {\n @include feature-targeting.targets($feat-structure) {\n align-self: stretch;\n }\n }\n\n // Disable interaction on label elements that may automatically\n // toggle corresponding checkbox / radio input.\n &[for] {\n @include feature-targeting.targets($feat-structure) {\n pointer-events: none;\n }\n }\n }\n\n .mdc-list-item__primary-text {\n @include typography.overflow-ellipsis($query);\n\n .mdc-list-item--with-two-lines &,\n .mdc-list-item--with-three-lines & {\n @include typography.text-baseline(\n $top: 28px,\n $bottom: 20px,\n $query: $query\n );\n }\n }\n\n .mdc-list-item__secondary-text {\n @include typography.overflow-ellipsis($query);\n @include typography.text-baseline(\n $top: 20px,\n $display: block,\n $query: $query\n );\n\n .mdc-list-item--with-three-lines & {\n @include feature-targeting.targets($feat-structure) {\n white-space: normal;\n line-height: 20px;\n }\n }\n\n .mdc-list-item--with-overline & {\n @include feature-targeting.targets($feat-structure) {\n white-space: nowrap;\n line-height: auto;\n }\n }\n }\n\n .mdc-list-item__overline-text {\n @include typography.overflow-ellipsis($query);\n\n .mdc-list-item--with-two-lines & {\n @include typography.text-baseline(\n $top: 24px,\n $bottom: 20px,\n $query: $query\n );\n }\n\n .mdc-list-item--with-three-lines & {\n @include typography.text-baseline(\n $top: 28px,\n $bottom: 20px,\n $query: $query\n );\n }\n }\n\n .mdc-list-item--with-leading-avatar {\n @include item-start-spacing(16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n border-radius: 50%;\n }\n }\n }\n\n .mdc-list-item--with-leading-icon {\n @include item-start-spacing(\n $leading: 16px,\n $trailing: 32px,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-thumbnail {\n @include item-start-spacing(16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-image {\n @include item-start-spacing(16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _one-line-item-taller-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n @include _two-line-item-tall-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n }\n\n .mdc-list-item--with-leading-video {\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 8px,\n $query: $query\n );\n @include item-start-spacing($leading: 0, $trailing: 16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _one-line-item-taller-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n @include _two-line-item-tall-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n }\n\n .mdc-list-item--with-leading-checkbox {\n $leading: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-start-spacing($leading, $trailing, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-radio {\n $leading: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-start-spacing($leading, $trailing, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-switch {\n @include item-start-spacing(16px, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-trailing-icon {\n @include item-end-spacing(16px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-meta {\n @include two-line-item-end-alignment(flex-start, $query: $query);\n @include three-line-item-end-alignment(flex-start, $query: $query);\n @include item-end-spacing($leading: 28px, $trailing: 16px, $query: $query);\n @include _multi-line-item-end-text-baseline($query: $query);\n\n .mdc-list-item__end {\n @include typography.typography(caption, $query);\n }\n }\n\n .mdc-list-item--with-trailing-checkbox {\n $leading: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-end-spacing($leading, $trailing, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n }\n\n .mdc-list-item--with-trailing-radio {\n $leading: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-end-spacing($leading, $trailing, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n }\n\n .mdc-list-item--with-trailing-switch {\n @include item-end-spacing(16px, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n }\n\n .mdc-list-item--with-overline {\n @include _two-line-item-primary-text-baseline(20px, 0px, $query: $query);\n @include _three-line-item-primary-baseline(20px, 0px, $query: $query);\n }\n\n // This must be specified last to ensure that RTL padding takes priority over\n // LTR padding in the cascade.\n .mdc-list-item {\n @include item-spacing(16px, $query: $query);\n }\n\n //\n // Grouping\n //\n .mdc-list-group {\n @include feature-targeting.targets($feat-structure) {\n // Cancel top/bottom padding on individual lists within group\n .mdc-deprecated-list {\n padding: 0;\n }\n }\n }\n .mdc-list-group__subheader {\n @include _list-group-subheader-margin($query: $query);\n }\n\n //\n // Dividers\n //\n\n .mdc-list-divider {\n @include feature-targeting.targets($feat-structure) {\n padding: 0;\n\n // Allows the use of padding to specify leading and trailing insets\n // independently.\n background-clip: content-box;\n }\n }\n\n // The base inset variant corresponds to the item's padding.\n .mdc-list-divider,\n .mdc-list-divider--with-leading-text,\n .mdc-list-divider--with-leading-icon,\n .mdc-list-divider--with-leading-image,\n .mdc-list-divider--with-leading-thumbnail,\n .mdc-list-divider--with-leading-avatar,\n .mdc-list-divider--with-leading-checkbox,\n .mdc-list-divider--with-leading-switch,\n .mdc-list-divider--with-leading-radio {\n @include divider-leading-inset(16px, $query: $query);\n @include divider-trailing-inset(16px, $query: $query);\n }\n\n .mdc-list-divider--with-leading-video {\n @include divider-leading-inset(0px, $query: $query);\n }\n\n // This is needed to ensure that default padding isn't applied in RTL locales.\n .mdc-list-divider {\n @include feature-targeting.targets($feat-structure) {\n @include rtl.rtl {\n padding: 0;\n }\n }\n }\n}\n\n@mixin core-styles($query: feature-targeting.all()) {\n @include without-ripple($query);\n @include with-ripple($query);\n}\n\n@mixin without-ripple($query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n $feat-structure: feature-targeting.create-target($query, structure);\n $feat-typography: feature-targeting.create-target($query, typography);\n\n //\n // Items\n //\n\n @include list-primary-text-ink-color(text-primary-on-background, $query);\n @include list-secondary-text-ink-color(text-secondary-on-background, $query);\n @include list-overline-text-ink-color(text-hint-on-background, $query);\n @include list-icon-fill-color(transparent, $query);\n @include list-icon-ink-color(text-icon-on-background, $query);\n @include list-meta-text-ink-color(text-hint-on-background, $query);\n @include list-disabled-opacity(variables.$content-disabled-opacity, $query);\n @include list-disabled-ink-color(variables.$content-disabled-color, $query);\n @include list-selected-ink-color(variables.$content-selected-color, $query);\n\n @include group-subheader-ink-color(text-primary-on-background, $query);\n\n @include _high-contrast-mode-border-color($query);\n\n .mdc-list {\n @include _typography-list-base($query: $query);\n }\n\n .mdc-list-item__primary-text {\n @include typography.typography(subtitle1, $query);\n }\n\n .mdc-list-item__secondary-text {\n @include typography.typography(body2, $query);\n }\n\n .mdc-list-item__overline-text {\n @include typography.typography(overline, $query);\n }\n\n .mdc-list-item--with-leading-avatar {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-icon {\n @include item-start-size(24px, $query: $query);\n }\n\n .mdc-list-item--with-leading-thumbnail {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-image {\n @include item-start-size(56px, $query: $query);\n }\n\n .mdc-list-item--with-leading-video {\n @include item-start-size($width: 100px, $height: 56px, $query: $query);\n }\n\n .mdc-list-item--with-leading-checkbox {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-radio {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-switch {\n @include item-start-size($width: 36px, $height: 20px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-icon {\n @include item-end-size(24px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-meta {\n .mdc-list-item__end {\n @include typography.typography(caption, $query);\n }\n }\n\n .mdc-list-item--with-trailing-checkbox {\n @include item-end-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-radio {\n @include item-end-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-switch {\n @include item-end-size($width: 36px, $height: 20px, $query: $query);\n }\n\n .mdc-list-group__subheader {\n @include typography.typography(subtitle1, $query);\n }\n\n //\n // Dividers\n //\n\n $divider-color: if(\n theme-color.tone(theme-color.$background) == 'dark',\n variables.$divider-color-on-dark-bg,\n variables.$divider-color-on-light-bg\n );\n\n @include divider-color($divider-color, $query: $query);\n @include divider-height(1px, $query: $query);\n @include static-styles($query: $query);\n} // end of without-ripple\n\n@mixin with-ripple($query: feature-targeting.all()) {\n @include ripple.common($query); // COPYBARA_COMMENT_THIS_LINE\n\n :not(.mdc-list-item--disabled).mdc-list-item {\n @include _item-interactive-ripple($query);\n }\n}\n\n///\n/// Adjusts an offset (i.e., margin) to accomodate contents that are larger than\n/// the space allocated by the specification.\n///\n/// For instance, the specification provides 24x24dp for a checkbox with a 16dp\n/// margin. However, checkboxes are actually 40x40dp. To ensure that the\n/// checkbox is positioned correctly, the margin is reduced by 8dp to reflect\n/// that the margin is already \"baked into\" the checkbox.\n///\n/// Concretely, 40dp - 24dp = 16dp. Assuming that the control is symmetrical,\n/// half of the overflow (8dp) is on the leading side and half on the trailing\n/// side. Therefore, the leading and trailing margins are reduced by 8dp.\n///\n/// Note: this might be more useful if it's added into the leading/trailing\n/// margin mixins as a parameter.\n///\n@function absorb-overflow($offset, $actual, $available, $symmetric: true) {\n @if $actual <= $available {\n @return $offset;\n }\n $overflow: $actual - $available;\n @return $offset - math.div($overflow, if($symmetric, 2, 1));\n}\n\n@mixin one-line-item-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-one-line {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n }\n}\n\n@mixin two-line-item-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-two-lines {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n }\n}\n@mixin three-line-item-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-three-lines {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n }\n}\n\n@mixin list-item-height($height) {\n &.mdc-list-item--with-one-line,\n &.mdc-list-item--with-two-lines,\n &.mdc-list-item--with-three-lines {\n @include theme.property(height, $height);\n }\n}\n\n@mixin item-spacing(\n $leading,\n $trailing: $leading,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n @include rtl.reflexive-property(padding, $leading, $trailing);\n }\n}\n\n@mixin one-line-item-start-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-one-line {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin two-line-item-start-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin three-line-item-start-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin one-line-item-end-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-one-line {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin two-line-item-end-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin three-line-item-end-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin item-start-spacing(\n $leading,\n $trailing: $leading,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n // Extra specificity needed to override default customizations.\n &.mdc-list-item {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, 0, auto);\n }\n\n .mdc-list-item__start {\n @include rtl.reflexive-property(margin, $leading, $trailing);\n }\n }\n}\n\n@mixin item-end-spacing(\n $leading,\n $trailing: $leading,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n // Extra specificity needed to override default customizations.\n &.mdc-list-item {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, auto, 0);\n }\n\n .mdc-list-item__end {\n @include rtl.reflexive-property(margin, $leading, $trailing);\n }\n }\n}\n\n@mixin item-start-size(\n $width,\n $height: $width,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n .mdc-list-item__start {\n @include theme.property(width, $width);\n @include theme.property(height, $height);\n }\n }\n}\n\n@mixin item-end-size($width, $height: $width, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n .mdc-list-item__end {\n @include theme.property(width, $width);\n @include theme.property(height, $height);\n }\n }\n}\n\n@mixin list-item-selected-container-color($color) {\n &.mdc-list-item.mdc-list-item--selected {\n @include theme.property(background-color, $color);\n }\n}\n\n@mixin list-primary-text-typography($typography-theme) {\n .mdc-list-item__primary-text {\n @include typography.theme-styles($typography-theme);\n }\n}\n\n@mixin list-primary-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__primary-text {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-secondary-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__secondary-text {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-secondary-text-typography($typography-theme) {\n .mdc-list-item__secondary-text {\n @include typography.theme-styles($typography-theme);\n }\n}\n\n@mixin list-overline-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__overline-text {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-meta-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-icon-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--with-leading-icon .mdc-list-item__start,\n .mdc-list-item--with-trailing-icon .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-icon-fill-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--with-leading-icon .mdc-list-item__start,\n .mdc-list-item--with-trailing-icon .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(background-color, $color);\n }\n }\n}\n\n@mixin list-selected-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--selected,\n .mdc-list-item--activated {\n @include list-primary-text-ink-color($color, $query);\n @include _item-icon-ink-color($color, $leading-only: true, $query: $query);\n }\n}\n\n@mixin list-selected-meta-text-ink-color(\n $color,\n $query: feature-targeting.all()\n) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--selected,\n .mdc-list-item--activated {\n @include list-meta-text-ink-color($color, $query);\n }\n}\n\n@mixin list-disabled-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--disabled {\n @include list-primary-text-ink-color($color, $query);\n @include list-secondary-text-ink-color($color, $query);\n @include list-overline-text-ink-color($color, $query);\n @include _item-icon-ink-color($color, $query: $query);\n @include item-meta-text-ink-color($color, $query);\n }\n}\n\n@mixin list-disabled-opacity($opacity, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--disabled {\n .mdc-list-item__start,\n .mdc-list-item__content,\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(opacity, $opacity);\n }\n }\n }\n}\n\n@mixin group-subheader-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-deprecated-list-group__subheader {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n///\n/// Sets shape radius (rounded) to single line list variant.\n///\n/// @param {Number | List} $radius Radius size in `px` or percentage. It can be 4 value corner or single radius.\n/// Set to `50%` for rounded shape.\n/// @param {Boolean} $rtl-reflexive Set to true to flip border radius in RTL context. Defaults to `false`.\n/// @param {Number} $density-scale Density scale of single line list. Set this only when custom density is applied.\n/// Defaults to `$mdc-deprecated-list-single-line-density-scale`.\n///\n/// @access public\n///\n@mixin one-line-list-radius(\n $radius,\n $rtl-reflexive: false,\n $density-scale: variables.$one-line-item-density-scale,\n $query: feature-targeting.all()\n) {\n .mdc-list-item--with-one-line {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$one-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$one-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$one-line-item-taller-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n }\n}\n\n@mixin two-line-list-radius(\n $radius,\n $rtl-reflexive: false,\n $density-scale: variables.$two-line-item-density-scale,\n $query: feature-targeting.all()\n) {\n .mdc-list-item--with-two-lines {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$two-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch,\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$two-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n }\n}\n\n@mixin three-line-list-radius(\n $radius,\n $rtl-reflexive: false,\n $density-scale: variables.$three-line-item-density-scale,\n $query: feature-targeting.all()\n) {\n .mdc-list-item--with-three-lines {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$three-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n}\n\n@mixin divider-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-divider {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(background-color, $color);\n }\n }\n}\n\n@mixin divider-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n .mdc-list-divider {\n @include feature-targeting.targets($feat-structure) {\n @include theme.property(height, $height);\n }\n }\n}\n\n@mixin divider-leading-inset($inset, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-divider--with-leading-inset {\n @include feature-targeting.targets($feat-structure) {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, $inset, auto);\n }\n }\n}\n\n@mixin divider-trailing-inset($inset, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-divider--with-trailing-inset {\n @include feature-targeting.targets($feat-structure) {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, auto, $inset);\n }\n }\n}\n\n// The public density mixins apply the appropriate density styles regardless of\n// the item's start contents.\n@mixin one-line-item-density(\n $density-scale,\n $exclude-variants: false,\n $query: feature-targeting.all()\n) {\n @include _one-line-item-density($density-scale, $query: $query);\n\n @if not $exclude-variants {\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch {\n @include _one-line-item-tall-density($density-scale, $query: $query);\n }\n\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include _one-line-item-taller-density($density-scale, $query: $query);\n }\n }\n}\n\n@mixin two-line-item-density($density-scale, $query: feature-targeting.all()) {\n @include _two-line-item-density($density-scale, $query: $query);\n\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch,\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include _two-line-item-tall-density($density-scale, $query: $query);\n }\n}\n\n@mixin three-line-item-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n @include _three-line-item-density($density-scale, $query: $query);\n}\n\n//\n// Private\n//\n\n// Mixins that apply baseline height for one-, two-, and three- line item\n// container heights. This mixin calls the density mixins so that the styles\n// can be overwritten by future density mixin calls.\n@mixin _list-item-baseline-height($query: feature-targeting.all()) {\n @include _one-line-item-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n\n @include _two-line-item-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n\n @include _three-line-item-density(\n variables.$three-line-item-density-scale,\n $query: $query\n );\n}\n\n@mixin _tall-list-item-baseline-height($query: feature-targeting.all()) {\n @include _one-line-item-tall-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n @include _two-line-item-tall-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n}\n\n// The private density mixins allow density properties to be overridden\n// individually to avoid increasing specificity.\n\n@mixin _one-line-item-density($density-scale, $query: feature-targeting.all()) {\n $height: density-functions.prop-value(\n $density-config: variables.$one-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include one-line-item-height($height, $query: $query);\n}\n\n@mixin _one-line-item-tall-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$one-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include one-line-item-height($height, $query: $query);\n}\n\n@mixin _one-line-item-taller-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$one-line-item-taller-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include one-line-item-height($height, $query: $query);\n}\n\n@mixin _two-line-item-density($density-scale, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n $height: density-functions.prop-value(\n $density-config: variables.$two-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include two-line-item-height($height, $query: $query);\n\n @if ($density-scale and $density-scale != 0) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n .mdc-list-item__primary-text,\n .mdc-list-item__secondary-text {\n margin-top: 0px;\n margin-bottom: 0px;\n line-height: 1.4;\n &::before,\n &::after {\n display: none;\n }\n }\n }\n }\n}\n\n@mixin _two-line-item-tall-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$two-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include two-line-item-height($height, $query: $query);\n}\n\n@mixin _three-line-item-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$three-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include three-line-item-height($height, $query: $query);\n}\n\n// Split the list-base mixin into two sub-mixins, one holding the\n// structural/static styles (static-list-base) and the other holding styles\n// that are themable (typography-list-base). However, the existing list-base\n// mixin need to be preserved as Angular calls this mixin for autocomplete\n// base styling.\n@mixin _typography-list-base($query: feature-targeting.all()) {\n $feat-typography: feature-targeting.create-target($query, typography);\n @include typography.typography(subtitle1, $query);\n @include feature-targeting.targets($feat-typography) {\n // According to the mocks and stickersheet, the line-height is\n // adjusted to 24px for text content, same as for body1.\n /* @alternate */\n line-height: map.get(map.get(typography.$styles, body1), line-height);\n }\n}\n\n@mixin _static-list-base($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include feature-targeting.targets($feat-structure) {\n margin: 0;\n padding: 8px 0;\n list-style-type: none;\n\n &:focus // lint-disable-focus-psuedo-selector\n {\n outline: none;\n }\n }\n}\n\n@mixin list-base($query: feature-targeting.all()) {\n @include _typography-list-base($query: $query);\n @include _static-list-base($query: $query);\n}\n\n@mixin item-base($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-start;\n overflow: hidden;\n padding: 0;\n\n &:focus // lint-disable-focus-psuedo-selector\n {\n outline: none;\n }\n }\n}\n\n@mixin _item-interactive-ripple($query: feature-targeting.all()) {\n @include ripple.surface(\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple.radius-bounded(\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple-theme.states(\n theme-color.prop-value(on-surface),\n false,\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple-theme.states-activated(\n primary,\n false,\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple-theme.states-selected(\n primary,\n false,\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n\n #{variables.$ripple-target} {\n @include ripple.surface-styles($query: $query);\n @include ripple.target-common($query: $query);\n }\n}\n\n@mixin _two-line-item-text-baseline($query: feature-targeting.all()) {\n @include _two-line-item-primary-text-baseline(32px, 20px, $query: $query);\n @include _two-line-item-overline-text-baseline(28px, 20px, $query: $query);\n @include _two-line-item-meta-text-baseline($top: 32px, $query: $query);\n}\n\n@mixin _two-line-item-primary-text-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__primary-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _three-line-item-primary-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__primary-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _two-line-item-overline-text-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__overline-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _three-line-item-overline-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__overline-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _multi-line-item-end-text-baseline($query: feature-targeting.all()) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__end {\n @include typography.text-baseline(\n $display: block,\n $top: 28px,\n $query: $query\n );\n }\n }\n\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__end {\n @include typography.text-baseline(\n $display: block,\n $top: 28px,\n $query: $query\n );\n }\n }\n}\n\n@mixin _two-line-item-meta-text-baseline(\n $top,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-two-lines {\n &.mdc-list-item--with-trailing-meta {\n .mdc-list-item__end {\n @include typography.text-baseline(\n $display: block,\n $top: $top,\n $query: $query\n );\n }\n }\n }\n}\n\n@mixin item-meta-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n &.mdc-list-item--with-trailing-meta {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n }\n}\n\n@mixin _item-icon-ink-color(\n $color,\n $leading-only: false,\n $query: feature-targeting.all()\n) {\n $feat-color: feature-targeting.create-target($query, color);\n\n &.mdc-list-item--with-leading-icon {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n }\n\n @if (not $leading-only) {\n &.mdc-list-item--with-trailing-icon {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n }\n }\n}\n\n@mixin _high-contrast-mode-border-color($query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n .mdc-list-divider::after {\n @include feature-targeting.targets($feat-color) {\n // Color ensures border is shown, but will be overridden by the browser.\n @include theme.property(border-bottom-color, white);\n }\n }\n}\n\n@mixin _high-contrast-mode($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include dom-mixins.forced-colors-mode {\n .mdc-list-divider::after {\n @include feature-targeting.targets($feat-structure) {\n content: '';\n display: block;\n border-bottom-width: 1px;\n border-bottom-style: solid;\n }\n }\n }\n}\n\n@mixin _list-group-subheader-margin($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n $mdc-list-subheader-virtual-height: 3rem;\n $mdc-list-subheader-leading: map.get(\n map.get(typography.$styles, body1),\n line-height\n );\n $mdc-list-subheader-margin: calc(\n (#{$mdc-list-subheader-virtual-height} - #{$mdc-list-subheader-leading}) / 2\n );\n\n @include feature-targeting.targets($feat-structure) {\n margin: $mdc-list-subheader-margin variables.$side-padding;\n }\n}\n","@use '@material/button/button-text-theme' as mdc-button-text-theme;\n@use '@material/button/button-filled-theme' as mdc-button-filled-theme;\n@use '@material/button/button-protected-theme' as mdc-button-protected-theme;\n@use '@material/button/button-outlined-theme' as mdc-button-outlined-theme;\n\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/filled-button' as tokens-mdc-filled-button;\n@use '../core/tokens/m2/mat/filled-button' as tokens-mat-filled-button;\n@use '../core/tokens/m2/mdc/outlined-button' as tokens-mdc-outlined-button;\n@use '../core/tokens/m2/mat/outlined-button' as tokens-mat-outlined-button;\n@use '../core/tokens/m2/mdc/protected-button' as tokens-mdc-protected-button;\n@use '../core/tokens/m2/mat/protected-button' as tokens-mat-protected-button;\n@use '../core/tokens/m2/mdc/text-button' as tokens-mdc-text-button;\n@use '../core/tokens/m2/mat/text-button' as tokens-mat-text-button;\n@use '../core/style/sass-utils';\n\n@mixin _text-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-text-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-text-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-text-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-text-button.get-color-tokens($theme)\n );\n\n @include mdc-button-text-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix, $mat-tokens);\n}\n\n@mixin _filled-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-filled-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-filled-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-filled-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-filled-button.get-color-tokens($theme)\n );\n\n @include mdc-button-filled-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix, $mat-tokens);\n}\n\n@mixin _protected-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-protected-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-protected-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-protected-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-protected-button.get-color-tokens($theme)\n );\n\n @include mdc-button-protected-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix, $mat-tokens);\n}\n\n@mixin _outlined-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-outlined-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-outlined-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-outlined-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-outlined-button.get-color-tokens($theme)\n );\n\n @include mdc-button-outlined-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix, $mat-tokens);\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-text-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-text-button.$prefix, $options...);\n $mdc-protected-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-protected-button.$prefix, $options...);\n $mdc-filled-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-filled-button.$prefix, $options...);\n $mdc-outlined-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-outlined-button.$prefix, $options...);\n $mat-text-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-text-button.$prefix, $options...);\n $mat-protected-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-protected-button.$prefix, $options...);\n $mat-filled-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-filled-button.$prefix, $options...);\n $mat-outlined-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-outlined-button.$prefix, $options...);\n @include mdc-button-text-theme.theme($mdc-text-button-tokens);\n @include mdc-button-protected-theme.theme($mdc-protected-button-tokens);\n @include mdc-button-filled-theme.theme($mdc-filled-button-tokens);\n @include mdc-button-outlined-theme.theme($mdc-outlined-button-tokens);\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix, $mat-text-button-tokens);\n @include token-utils.create-token-values(\n tokens-mat-protected-button.$prefix, $mat-protected-button-tokens);\n @include token-utils.create-token-values(\n tokens-mat-filled-button.$prefix, $mat-filled-button-tokens);\n @include token-utils.create-token-values(\n tokens-mat-outlined-button.$prefix, $mat-outlined-button-tokens);\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-button.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-button-text-theme.theme(\n tokens-mdc-text-button.get-unthemable-tokens());\n @include mdc-button-filled-theme.theme(\n tokens-mdc-filled-button.get-unthemable-tokens());\n @include mdc-button-protected-theme.theme(\n tokens-mdc-protected-button.get-unthemable-tokens());\n @include mdc-button-outlined-theme.theme(\n tokens-mdc-outlined-button.get-unthemable-tokens());\n\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix,\n tokens-mat-text-button.get-unthemable-tokens());\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix,\n tokens-mat-filled-button.get-unthemable-tokens());\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix,\n tokens-mat-protected-button.get-unthemable-tokens());\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix,\n tokens-mat-outlined-button.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include _text-button-variant($theme, null);\n @include _filled-button-variant($theme, null);\n @include _protected-button-variant($theme, null);\n @include _outlined-button-variant($theme, null);\n }\n\n .mat-mdc-button {\n &.mat-primary {\n @include _text-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _text-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _text-button-variant($theme, warn);\n }\n }\n\n .mat-mdc-unelevated-button {\n &.mat-primary {\n @include _filled-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _filled-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _filled-button-variant($theme, warn);\n }\n }\n\n .mat-mdc-raised-button {\n &.mat-primary {\n @include _protected-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _protected-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _protected-button-variant($theme, warn);\n }\n }\n\n .mat-mdc-outlined-button {\n &.mat-primary {\n @include _outlined-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _outlined-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _outlined-button-variant($theme, warn);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-button-text-theme.theme(\n tokens-mdc-text-button.get-typography-tokens($theme));\n @include mdc-button-filled-theme.theme(\n tokens-mdc-filled-button.get-typography-tokens($theme));\n @include mdc-button-outlined-theme.theme(\n tokens-mdc-outlined-button.get-typography-tokens($theme));\n @include mdc-button-protected-theme.theme(\n tokens-mdc-protected-button.get-typography-tokens($theme));\n\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix,\n tokens-mat-text-button.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix,\n tokens-mat-filled-button.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix,\n tokens-mat-protected-button.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix,\n tokens-mat-outlined-button.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-button-text-theme.theme(\n tokens-mdc-text-button.get-density-tokens($theme));\n @include mdc-button-filled-theme.theme(\n tokens-mdc-filled-button.get-density-tokens($theme));\n @include mdc-button-outlined-theme.theme(\n tokens-mdc-outlined-button.get-density-tokens($theme));\n @include mdc-button-protected-theme.theme(\n tokens-mdc-protected-button.get-density-tokens($theme));\n\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix,\n tokens-mat-text-button.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix,\n tokens-mat-filled-button.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix,\n tokens-mat-protected-button.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix,\n tokens-mat-outlined-button.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-button') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n","@use 'sass:map';\n@use 'sass:math';\n@use '@material/density/functions' as mdc-density-functions;\n@use '@material/icon-button/icon-button-theme' as mdc-icon-button-theme;\n@use '../core/tokens/m2/mdc/icon-button' as tokens-mdc-icon-button;\n@use '../core/tokens/m2/mat/icon-button' as tokens-mat-icon-button;\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n\n\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-icon-button-theme.theme(tokens-mdc-icon-button.get-unthemable-tokens());\n }\n }\n}\n\n@mixin _icon-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-icon-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-icon-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-icon-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-icon-button.get-color-tokens($theme)\n );\n\n @include mdc-icon-button-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-icon-button.$prefix, $mat-tokens);\n}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include _icon-button-variant($theme, null);\n\n .mat-mdc-icon-button {\n &.mat-primary {\n @include _icon-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _icon-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _icon-button-variant($theme, warn);\n }\n }\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-icon-button.$prefix,\n tokens-mat-icon-button.get-typography-tokens($theme));\n }\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $icon-size: 24px;\n $density-scale: inspection.get-theme-density($theme);\n // Manually apply the expected density theming, and include the padding\n // as it was applied before\n $calculated-size: mdc-density-functions.prop-value(\n $density-config: (\n size: (\n default: 48px,\n maximum: 48px,\n minimum: 28px,\n ),\n ),\n $density-scale: $density-scale,\n $property-name: size,\n );\n\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-icon-button.$prefix,\n tokens-mat-icon-button.get-density-tokens($theme));\n }\n\n // Use `mat-mdc-button-base` to increase the specificity over the button's structural styles.\n .mat-mdc-icon-button.mat-mdc-button-base {\n // Match the styles that used to be present. This is necessary for backwards\n // compat to match the previous implementations selector count (two classes).\n @include mdc-icon-button-theme.theme((\n state-layer-size: $calculated-size,\n ));\n\n // TODO: Switch calculated-size to \"var(--mdc-icon-button-state-layer-size)\"\n // Currently fails validation because the variable is \"undefined\"\n // in the sass stack.\n // TODO: Switch icon-size to \"var(--mdc-icon-button-icon-size)\". Currently\n // fails validation because the variable is \"undefined\" in the sass stack.\n width: var(--mdc-icon-button-state-layer-size);\n height: var(--mdc-icon-button-state-layer-size);\n padding: math.div($calculated-size - $icon-size, 2);\n }\n }\n}\n\n@mixin theme($theme) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-icon-button') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme));\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @if ($tokens != ()) {\n @include mdc-icon-button-theme.theme(map.get($tokens, tokens-mdc-icon-button.$prefix));\n @include token-utils.create-token-values(\n tokens-mat-icon-button.$prefix, map.get($tokens, tokens-mat-icon-button.$prefix));\n }\n}\n","@use '@material/fab/fab-theme' as mdc-fab-theme;\n@use '@material/fab/fab-small-theme' as mdc-fab-small-theme;\n@use '@material/fab/extended-fab-theme' as mdc-extended-fab-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/m2/mdc/fab' as tokens-mdc-fab;\n@use '../core/tokens/m2/mdc/fab-small' as tokens-mdc-fab-small;\n@use '../core/tokens/m2/mdc/extended-fab' as tokens-mdc-extended-fab;\n@use '../core/tokens/m2/mat/fab' as tokens-mat-fab;\n@use '../core/tokens/m2/mat/fab-small' as tokens-mat-fab-small;\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-fab.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-fab-theme.theme(tokens-mdc-fab.get-unthemable-tokens());\n @include mdc-fab-small-theme.theme(tokens-mdc-fab-small.get-unthemable-tokens());\n @include mdc-extended-fab-theme.theme(\n tokens-mdc-extended-fab.get-unthemable-tokens()\n );\n }\n }\n}\n\n@mixin _fab-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-fab.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-fab.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-fab.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-fab.get-color-tokens($theme)\n );\n\n @include mdc-fab-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-fab.$prefix, $mat-tokens);\n}\n\n@mixin _fab-small-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-fab-small.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-fab-small.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-fab-small.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-fab-small.get-color-tokens($theme)\n );\n\n @include mdc-fab-small-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix, $mat-tokens);\n}\n\n/// Outputs color theme styles for the mat-fab.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the fab: primary, secondary, or tertiary\n/// (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include _fab-variant($theme, null);\n @include _fab-small-variant($theme, null);\n @include mdc-extended-fab-theme.theme(tokens-mdc-extended-fab.get-color-tokens($theme));\n\n .mat-mdc-fab {\n &.mat-primary {\n @include _fab-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _fab-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _fab-variant($theme, warn);\n }\n }\n\n .mat-mdc-mini-fab {\n &.mat-primary {\n @include _fab-small-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _fab-small-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _fab-small-variant($theme, warn);\n }\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-fab.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-extended-fab-theme.theme(tokens-mdc-extended-fab.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-fab.$prefix,\n tokens-mat-fab.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix,\n tokens-mat-fab-small.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-fab.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-fab.$prefix,\n tokens-mat-fab.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix,\n tokens-mat-fab-small.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the fab: primary, secondary, or tertiary\n/// (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-fab') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-extended-fab-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mdc-extended-fab.$prefix, $options...);\n $mdc-fab-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-fab.$prefix, $options...);\n $mdc-fab-small-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-fab-small.$prefix,\n $options...);\n $mat-fab-tokens: token-utils.get-tokens-for($tokens, tokens-mat-fab.$prefix, $options...);\n $mat-fab-small-tokens: token-utils.get-tokens-for($tokens, tokens-mat-fab-small.$prefix,\n $options...);\n @include mdc-extended-fab-theme.theme($mdc-extended-fab-tokens);\n @include mdc-fab-theme.theme($mdc-fab-tokens);\n @include mdc-fab-small-theme.theme($mdc-fab-small-tokens);\n @include token-utils.create-token-values(tokens-mat-fab.$prefix, $mat-fab-tokens);\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix, $mat-fab-small-tokens);\n}\n","@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mdc/circular-progress' as tokens-mdc-circular-progress;\n@use '@material/circular-progress/circular-progress-theme' as mdc-circular-progress-theme;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-circular-progress-theme.theme(\n tokens-mdc-circular-progress.get-unthemable-tokens()\n );\n }\n }\n}\n\n/// Outputs color theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the spinner: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n $mdc-circular-progress-color-tokens: tokens-mdc-circular-progress.get-color-tokens($theme);\n\n @include sass-utils.current-selector-or-root() {\n @include mdc-circular-progress-theme.theme($mdc-circular-progress-color-tokens);\n\n .mat-accent {\n $color: inspection.get-theme-color($theme, accent);\n @include mdc-circular-progress-theme.theme((active-indicator-color: $color));\n }\n\n .mat-warn {\n $color: inspection.get-theme-color($theme, warn);\n @include mdc-circular-progress-theme.theme((active-indicator-color: $color));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n}\n\n/// Outputs density theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the spinner: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-progress-spinner') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-circular-progress-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-circular-progress.$prefix, $options...);\n @include mdc-circular-progress-theme.theme($mdc-circular-progress-tokens);\n}\n","@use 'sass:color';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mat/badge' as tokens-mat-badge;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-badge.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the badge: primary, secondary, tertiary,\n/// or error (If not specified, default error color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.get-color-tokens($theme));\n }\n\n .mat-badge-accent {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-badge-warn {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {}\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the badge: primary, secondary, tertiary,\n/// or error (If not specified, default error color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-badge') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-badge-tokens: token-utils.get-tokens-for($tokens, tokens-mat-badge.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-badge.$prefix, $mat-badge-tokens);\n}\n","@use 'sass:color';\n@use 'sass:map';\n@use '../core/tokens/m2/mat/datepicker' as tokens-mat-datepicker;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n@use '../core/typography/typography';\n@use '../button/icon-button-theme';\n\n// TODO(crisbeto): these variables aren't used anymore and should be removed.\n$selected-today-box-shadow-width: 1px;\n$selected-fade-amount: 0.6;\n$range-fade-amount: 0.2;\n$today-fade-amount: 0.2;\n$calendar-body-font-size: 13px !default;\n$calendar-weekday-table-font-size: 11px !default;\n\n@mixin _calendar-color($theme, $palette-name) {\n $palette-color: inspection.get-theme-color($theme, $palette-name);\n $range-color: tokens-mat-datepicker.private-get-range-background-color($palette-color);\n $range-tokens: tokens-mat-datepicker.get-range-color-tokens($range-color);\n $calendar-tokens:\n tokens-mat-datepicker.private-get-calendar-color-palette-color-tokens($theme, $palette-name);\n\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n map.merge($calendar-tokens, $range-tokens));\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-datepicker.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n tokens-mat-datepicker.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the main selection: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n tokens-mat-datepicker.get-color-tokens($theme));\n }\n\n .mat-datepicker-content {\n &.mat-accent {\n @include _calendar-color($theme, accent);\n }\n\n &.mat-warn {\n @include _calendar-color($theme, warn);\n }\n }\n\n .mat-datepicker-toggle-active {\n &.mat-accent {\n $accent-tokens:\n tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, accent);\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $accent-tokens);\n }\n\n &.mat-warn {\n $warn-tokens:\n tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, warn);\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $warn-tokens);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n tokens-mat-datepicker.get-typography-tokens($theme));\n }\n }\n}\n\n@mixin date-range-colors(\n $range-color,\n $comparison-color: tokens-mat-datepicker.$private-default-comparison-color,\n $overlap-color: tokens-mat-datepicker.$private-default-overlap-color,\n $overlap-selected-color:\n tokens-mat-datepicker.private-get-default-overlap-selected-color($overlap-color)) {\n $tokens: tokens-mat-datepicker.get-range-color-tokens(\n $range-color: $range-color,\n $comparison-color: $comparison-color,\n $overlap-color: $overlap-color,\n $overlap-selected-color: $overlap-selected-color,\n );\n\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $tokens);\n }\n}\n\n/// Outputs density theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n // TODO(crisbeto): move this into the structural styles\n // once the icon button density is switched to tokens.\n\n // Regardless of the user-passed density, we want the calendar\n // previous/next buttons to remain at density -2\n .mat-calendar-controls {\n @include icon-button-theme.density(-2);\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the main selection: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-datepicker') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-datepicker-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-datepicker.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $mat-datepicker-tokens);\n}\n","@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/m2/mat/icon' as tokens-mat-icon;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n@mixin _palette-colors($theme, $palette-name) {\n $color: inspection.get-theme-color($theme, $palette-name, text);\n $tokens: tokens-mat-icon.private-get-icon-color-tokens($color);\n @include token-utils.create-token-values(tokens-mat-icon.$prefix, $tokens);\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-icon.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {}\n}\n\n/// Outputs color theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the icon: primary, secondary, tertiary, or error\n/// (If not specified, default neutral color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-icon.$prefix,\n tokens-mat-icon.get-color-tokens($theme));\n }\n\n .mat-icon {\n &.mat-primary {\n @include _palette-colors($theme, primary);\n }\n\n &.mat-accent {\n @include _palette-colors($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-colors($theme, warn);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {}\n}\n\n/// Outputs density theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {}\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the icon: surface, primary, secondary, tertiary,\n/// or error (If not specified, default surface color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-icon') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-icon-tokens: token-utils.get-tokens-for($tokens, tokens-mat-icon.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-icon.$prefix, $mat-icon-tokens);\n}\n","@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mat/stepper' as tokens-mat-stepper;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for mat-stepper.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {}\n}\n\n/// Outputs color theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the stepper: primary, secondary,\n/// tertiary, or error (If not specified, primary color values will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.get-color-tokens($theme));\n\n .mat-step-header.mat-accent {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-step-header.mat-warn {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the stepper: primary, secondary,\n/// tertiary, or error (If not specified, primary color values will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-stepper') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @if ($tokens != ()) {\n $mat-stepper-tokens: token-utils.get-tokens-for(\n $tokens,\n tokens-mat-stepper.$prefix,\n $options...\n );\n @include token-utils.create-token-values(\n tokens-mat-stepper.$prefix, $mat-stepper-tokens);\n }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mat/toolbar' as tokens-mat-toolbar;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n@mixin _palette-styles($theme, $palette-name) {\n @include token-utils.create-token-values(\n tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.private-get-color-palette-color-tokens(\n $background-color: inspection.get-theme-color($theme, $palette-name),\n $text-color: inspection.get-theme-color($theme, $palette-name, default-contrast)\n )\n );\n}\n\n@mixin base($theme) {}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.get-color-tokens($theme));\n }\n\n .mat-toolbar {\n &.mat-primary {\n @include _palette-styles($theme, primary);\n }\n\n &.mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-styles($theme, warn);\n }\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n // TODO(mmalerba): Stop calling this and resolve resulting screen diffs.\n $theme: inspection.private-get-typography-back-compat-theme($theme);\n\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.get-typography-tokens($theme));\n }\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.get-density-tokens($theme));\n }\n }\n}\n\n@mixin theme($theme) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-toolbar') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme));\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @if ($tokens != ()) {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n map.get($tokens, tokens-mat-toolbar.$prefix));\n }\n}\n"],"names":[],"sourceRoot":"webpack:///","x_google_ignoreList":[0,1,2,3,4,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37]} \ No newline at end of file +{"version":3,"file":"styles.css","mappings":"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EC6DA;EAAA;ACwnBJ;;AkBnpBM;EnB2BF;AC4nBJ;;AkBvpBM;EnB2BF;ACgoBJ;;AkB3pBM;EnB2BF;ACooBJ;;AkB/pBM;EnB2BF;ACwoBJ;;AkBnqBM;EnB2BF;AC4oBJ;;AkBvqBM;EnB2BF;ACgpBJ;;AkB3qBM;EnB2BF;ACopBJ;;AkB/qBM;EnB2BF;ACwpBJ;;AkBnrBM;EnB2BF;AC4pBJ;;AkBvrBM;EnB2BF;ACgqBJ;;AkB3rBM;EnB2BF;ACoqBJ;;AkB/rBM;EnB2BF;ACwqBJ;;AkBnsBM;EnB2BF;AC4qBJ;;AkBvsBM;EnB2BF;ACgrBJ;;AkB3sBM;EnB2BF;ACorBJ;;AkB/sBM;EnB2BF;ACwrBJ;;AkBntBM;EnB2BF;AC4rBJ;;AkBvtBM;EnB2BF;ACgsBJ;;AkB3tBM;EnB2BF;ACosBJ;;AkB/tBM;EnB2BF;ACwsBJ;;AkBnuBM;EnB2BF;AC4sBJ;;AkBvuBM;EnB2BF;ACgtBJ;;AkB3uBM;EnB2BF;ACotBJ;;AkB/uBM;EnB2BF;ACwtBJ;;AkBnvBM;EnB2BF;AC4tBJ;;AkB9uBI;EACE;AlBivBN;;AF7xBI;EC6DA;EAAA;EAAA;ACsuBJ;;AFnyBI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+uBJ;;AF5yBI;EC6DA;EAAA;EAAA;ACqvBJ;;AmB7xBI;EpBwCA;EAAA;AC0vBJ;AmB/xBM;EpBqCF;EAAA;AC8vBJ;AmB/xBM;EpBiCF;EAAA;ACkwBJ;;AF/zBI;EC6DA;EAAA;ACuwBJ;;AFp0BI;EC6DA;EAAA;AC4wBJ;;AFz0BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACqxBJ;;AFl1BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACi1BJ;;AoB12BI;ErByBA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC21BJ;;AoB32BI;ErBgBA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACq2BJ;;AFl6BI;EC6DA;EAAA;EAAA;EAAA;EAAA;AC62BJ;;AF16BI;EC6DA;ACi3BJ;;AF96BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC43BJ;AqBp6BM;EtBwCF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACs4BJ;AqBz6BM;EtBmCF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACg5BJ;;AF78BI;EC6DA;ACo5BJ;;AFj9BI;EC6DA;EAAA;ACy5BJ;;AFt9BI;EC6DA;AC65BJ;;AF19BI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC26BJ;;AFx+BI;EC6DA;EAAA;EAAA;ACi7BJ;;AG7+BI;EJ4DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC28BJ;;AGr/BI;EJ0CA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACk+BJ;AGpgCQ;EJkCJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACw/BJ;AGnhCQ;EJ2BJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC8gCJ;AGliCQ;EJoBJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACoiCJ;;AGnhCI;EJjBA;ACwiCJ;;AFrmCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACilCJ;;AF9oCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EK7BA;AJopCJ;AI9oCI;ELuBA;AC0nCJ;AI7oCQ;ELmBJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACuoCJ;AIrpCQ;ELcJ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACopCJ;;AFjtCI;EC6DA;ACwpCJ;;AFrtCI;EC6DA;EAAA;EAAA;AC8pCJ;;AKtsCI;ENwCA;ACkqCJ;AKvsCM;ENqCF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACgrCJ;AK/sCM;EN+BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC8rCJ;AKvtCM;ENyBF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC4sCJ;;AFzwCI;EC6DA;EAAA;ACitCJ;;AF9wCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACuuCJ;;AFpyCI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC6vCJ;AsBpxCI;EvBuBA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACywCJ;AsBvxCM;EvBcF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACqxCJ;;AFl1CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACiyCJ;;AF91CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;AC0yCJ;;AFv2CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC4zCJ;;AFz3CI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACg1CJ;;AMj3CI;;EPiCA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC61CJ;;AMx3CM;;EP2BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC02CJ;;AM93CM;;EPoBF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACu3CJ;;AMr4CI;EPcA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC24CJ;;AMt5CI;EPWA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+5CJ;;AMv6CI;EPQA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACm7CJ;;AuBztBE;;ExB1tBE;ACw7CJ;AuB/CI;;ExBz4CA;AC47CJ;;AMr7CM;;;EAGE;ANw7CR;;AF//CI;EC6DA;EAAA;EAAA;EAAA;EAAA;AC08CJ;;AM36CI;;EP/BA;AC+8CJ;;AMp6CQ;EACE;ANu6CV;AM75CQ;EACE;AN+5CV;;AFnhDI;EC6DA;EAAA;EAAA;EAAA;AC69CJ;;AF1hDI;EC6DA;EAAA;EAAA;ACm+CJ;;AFhiDI;EC6DA;EAAA;EAAA;EAAA;EAAA;AC2+CJ;;AO7gDI;ERkCA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC2/CJ;AO1hDM;ER+BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC0gDJ;AOriDM;ER2BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACyhDJ;AOhjDM;ERuBF;EAAA;AC6hDJ;AOhjDM;ERmBF;EAAA;ACiiDJ;AOhjDM;EReF;EAAA;ACqiDJ;;AOpgDI;ERjCA;ACyiDJ;;AFtmDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACmjDJ;;AFhnDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACwkDJ;;AQ1mDI;ETkCA;AC4kDJ;AQ3mDM;ET+BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+lDJ;AQ1nDM;ET2BF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACknDJ;;AF/qDI;EC6DA;EAAA;ACunDJ;;AFprDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACgpDJ;;AF7sDI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC+rDJ;;AwB7mDM;EzBlFF;EAAA;EAAA;ACqsDJ;AwB/mDM;EzBtFF;EAAA;EAAA;AC0sDJ;AwBhnDM;EzB1FF;EAAA;EAAA;AC+sDJ;;AwB/mDM;EzBhGF;EAAA;EAAA;EAAA;ACstDJ;AwBlnDM;EzBpGF;EAAA;EAAA;EAAA;AC4tDJ;AwBpnDM;EzBxGF;EAAA;EAAA;EAAA;ACkuDJ;;AwBpnDM;EzB9GF;EAAA;EAAA;EAAA;ACyuDJ;AwBvnDM;EzBlHF;EAAA;EAAA;EAAA;AC+uDJ;AwBznDM;EzBtHF;EAAA;EAAA;EAAA;ACqvDJ;;AwBznDM;EzB5HF;EAAA;EAAA;EAAA;AC4vDJ;AwB5nDM;EzBhIF;EAAA;EAAA;EAAA;ACkwDJ;AwB9nDM;EzBpIF;EAAA;EAAA;EAAA;ACwwDJ;;AFr0DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACmxDJ;;AFh1DI;EC6DA;ACuxDJ;;AFp1DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACkyDJ;AyB/zDQ;E1B6BJ;EAAA;EAAA;ACuyDJ;AyBh0DQ;E1ByBJ;EAAA;EAAA;AC4yDJ;AyBj0DQ;E1BqBJ;EAAA;EAAA;ACizDJ;;AF92DI;EC6DA;ACqzDJ;;AyB3xDI;E1B1BA;E0BsCE;EACA;EACA;AzBoxDN;;AFz3DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACq0DJ;;AFl4DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC22DJ;A0Bz2DQ;E3BFJ;EAAA;EAAA;EAAA;ACi3DJ;A0B32DQ;E3BNJ;EAAA;EAAA;EAAA;ACu3DJ;A0B72DQ;E3BVJ;EAAA;EAAA;EAAA;AC63DJ;A0B72DQ;E3BhBJ;EAAA;EAAA;EAAA;ACm4DJ;A0B/2DQ;E3BpBJ;EAAA;EAAA;EAAA;ACy4DJ;A0Bj3DQ;E3BxBJ;EAAA;EAAA;EAAA;AC+4DJ;;AF58DI;EC6DA;EAAA;ACo5DJ;;AFj9DI;EC6DA;ACw5DJ;;AFr9DI;EC6DA;EAAA;EAAA;AC85DJ;;AF39DI;EC6DA;ACk6DJ;;AF/9DI;EC6DA;EAAA;EAAA;EAAA;ACy6DJ;;AFt+DI;EC6DA;EAAA;EAAA;AC+6DJ;;AF5+DI;EC6DA;EAAA;ACo7DJ;;AFj/DI;EC6DA;ACw7DJ;A2B99DM;E5BsCF;AC27DJ;A2B59DM;E5BiCF;AC87DJ;;AF3/DI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACi9DJ;;AF9gEI;EC6DA;EAAA;EAAA;EAAA;ACw9DJ;;A4B//DI;E7BuCA;EAAA;AC69DJ;;A4B//DI;E7BkCA;EAAA;ACk+DJ;;AF/hEI;EC6DA;ACs+DJ;;AFniEI;EC6DA;EAAA;AC2+DJ;;AFxiEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACo/DJ;;AFjjEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACwgEJ;;AFrkEI;EC6DA;AC4gEJ;;AFzkEI;EC6DA;EAAA;EAAA;EAAA;ACmhEJ;;AFhlEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACmjEJ;;A6BpkEM;E9BiBF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACgkEJ;A6B7kEM;E9BaF;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AC4kEJ;;A6BnlEM;E9BOF;ACglEJ;A6BjlEM;E9BCF;ACmlEJ;;A6B/hEI;E9BpDA;ACulEJ;AyB7jEI;E1B1BA;E0BsCE;EACA;EACA;AzBqjEN;;AF1pEI;EC6DA;ACimEJ;;AF9pEI;EC6DA;ACqmEJ;;AFlqEI;EC6DA;EAAA;EAAA;AC2mEJ;;AFxqEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;ACunEJ;;AFprEI;EC6DA;EAAA;AC4nEJ;;AFzrEI;EC6DA;ACgoEJ;;A8BvqEM;E/BuCF;ACooEJ;A8BvqEM;E/BmCF;ACuoEJ;A8BtqEM;E/B+BF;AC0oEJ;;AFvsEI;EC6DA;EAAA;EAAA;ACgpEJ;;AF7sEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;ACypEJ;;AFttEI;EC6DA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;E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","sources":["./node_modules/diagram-js/assets/diagram-js.css","./node_modules/bpmn-js/dist/assets/bpmn-font/css/bpmn.css","./node_modules/material-icons/iconfont/material-icons.css","./node_modules/@angular/material/core/style/_sass-utils.scss","./node_modules/@material/theme/_css.scss","./src/styles.scss","./node_modules/@angular/material/core/typography/_typography.scss","./node_modules/@angular/material/core/typography/_typography-utils.scss","./node_modules/@angular/material/chips/_chips-theme.scss","./node_modules/@angular/material/slide-toggle/_slide-toggle-theme.scss","./node_modules/@angular/material/radio/_radio-theme.scss","./node_modules/@angular/material/list/_list-theme.scss","./node_modules/@angular/material/tabs/_tabs-theme.scss","./node_modules/@angular/material/checkbox/_checkbox-theme.scss","./node_modules/@angular/material/core/ripple/_ripple.scss","./node_modules/@angular/cdk/a11y/_index.scss","./node_modules/@angular/cdk/overlay/_index.scss","./node_modules/@angular/cdk/text-field/_index.scss","./node_modules/@angular/material/core/focus-indicators/_private.scss","./node_modules/@angular/material/core/style/_layout-common.scss","./node_modules/@angular/material/core/_core.scss","./node_modules/@angular/material/core/option/_option-theme.scss","./node_modules/@angular/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss","./node_modules/@angular/material/core/_core-theme.scss","./node_modules/@angular/material/progress-bar/_progress-bar-theme.scss","./node_modules/@angular/material/form-field/_form-field-theme.scss","./node_modules/@angular/material/select/_select-theme.scss","./node_modules/@angular/material/slider/_slider-theme.scss","./node_modules/@material/list/_list.scss","./node_modules/@angular/material/button/_button-theme.scss","./node_modules/@angular/material/button/_icon-button-theme.scss","./node_modules/@angular/material/button/_fab-theme.scss","./node_modules/@angular/material/progress-spinner/_progress-spinner-theme.scss","./node_modules/@angular/material/badge/_badge-theme.scss","./node_modules/@angular/material/datepicker/_datepicker-theme.scss","./node_modules/@angular/material/icon/_icon-theme.scss","./node_modules/@angular/material/stepper/_stepper-theme.scss","./node_modules/@angular/material/toolbar/_toolbar-theme.scss"],"sourcesContent":["/**\n * color definitions\n */\n.djs-container {\n --color-grey-225-10-15: hsl(225, 10%, 15%);\n --color-grey-225-10-35: hsl(225, 10%, 35%);\n --color-grey-225-10-55: hsl(225, 10%, 55%);\n --color-grey-225-10-75: hsl(225, 10%, 75%);\n --color-grey-225-10-80: hsl(225, 10%, 80%);\n --color-grey-225-10-85: hsl(225, 10%, 85%);\n --color-grey-225-10-90: hsl(225, 10%, 90%);\n --color-grey-225-10-95: hsl(225, 10%, 95%); \n --color-grey-225-10-97: hsl(225, 10%, 97%);\n\n --color-blue-205-100-45: hsl(205, 100%, 45%);\n --color-blue-205-100-45-opacity-30: hsla(205, 100%, 45%, 30%);\n --color-blue-205-100-50: hsl(205, 100%, 50%);\n --color-blue-205-100-95: hsl(205, 100%, 95%);\n\n --color-green-150-86-44: hsl(150, 86%, 44%);\n\n --color-red-360-100-40: hsl(360, 100%, 40%);\n --color-red-360-100-45: hsl(360, 100%, 45%);\n --color-red-360-100-92: hsl(360, 100%, 92%);\n --color-red-360-100-97: hsl(360, 100%, 97%);\n\n --color-white: hsl(0, 0%, 100%);\n --color-black: hsl(0, 0%, 0%); \n --color-black-opacity-05: hsla(0, 0%, 0%, 5%); \n --color-black-opacity-10: hsla(0, 0%, 0%, 10%);\n\n --bendpoint-fill-color: var(--color-blue-205-100-45-opacity-30);\n --bendpoint-stroke-color: var(--color-blue-205-100-50);\n\n --context-pad-entry-background-color: var(--color-white);\n --context-pad-entry-hover-background-color: var(--color-grey-225-10-95);\n\n --element-dragger-color: var(--color-blue-205-100-50);\n --element-hover-outline-fill-color: var(--color-blue-205-100-45);\n --element-selected-outline-stroke-color: var(--color-blue-205-100-50);\n\n --lasso-fill-color: var(--color-black-opacity-05);\n --lasso-stroke-color: var(--color-black);\n\n --palette-entry-color: var(--color-grey-225-10-15);\n --palette-entry-hover-color: var(--color-blue-205-100-45);\n --palette-entry-selected-color: var(--color-blue-205-100-50);\n --palette-separator-color: var(--color-grey-225-10-75);\n --palette-toggle-hover-background-color: var(--color-grey-225-10-55);\n --palette-background-color: var(--color-grey-225-10-97);\n --palette-border-color: var(--color-grey-225-10-75);\n\n --popup-body-background-color: var(--color-white);\n --popup-header-entry-selected-color: var(--color-blue-205-100-50);\n --popup-header-entry-selected-background-color: var(--color-black-opacity-10);\n --popup-header-separator-color: var(--color-grey-225-10-75);\n --popup-background-color: var(--color-grey-225-10-97);\n --popup-border-color: var(--color-grey-225-10-75);\n\n --resizer-fill-color: var(--color-blue-205-100-45-opacity-30);\n --resizer-stroke-color: var(--color-blue-205-100-50);\n\n --search-container-background-color: var(--color-grey-225-10-97);\n --search-container-border-color: var(--color-blue-205-100-50);\n --search-container-box-shadow-color: var(--color-blue-205-100-95);\n --search-container-box-shadow-inset-color: var(--color-grey-225-10-80);\n --search-input-border-color: var(--color-grey-225-10-75);\n --search-result-border-color: var(--color-grey-225-10-75);\n --search-result-highlight-color: var(--color-black);\n --search-result-selected-color: var(--color-blue-205-100-45-opacity-30);\n\n --shape-attach-allowed-stroke-color: var(--color-blue-205-100-50);\n --shape-connect-allowed-fill-color: var(--color-grey-225-10-97);\n --shape-drop-allowed-fill-color: var(--color-grey-225-10-97);\n --shape-drop-not-allowed-fill-color: var(--color-red-360-100-97);\n --shape-resize-preview-stroke-color: var(--color-blue-205-100-50);\n\n --snap-line-stroke-color: var(--color-blue-205-100-45-opacity-30);\n\n --space-tool-crosshair-stroke-color: var(--color-black);\n\n --tooltip-error-background-color: var(--color-red-360-100-97);\n --tooltip-error-border-color: var(--color-red-360-100-45);\n --tooltip-error-color: var(--color-red-360-100-45);\n}\n\n/**\n * outline styles\n */\n\n.djs-outline {\n fill: none;\n visibility: hidden;\n}\n\n.djs-element.hover .djs-outline,\n.djs-element.selected .djs-outline {\n visibility: visible;\n shape-rendering: geometricPrecision;\n stroke-dasharray: 3,3;\n}\n\n.djs-element.selected .djs-outline {\n stroke: var(--element-selected-outline-stroke-color);\n stroke-width: 1px;\n}\n\n.djs-element.hover .djs-outline {\n stroke: var(--element-hover-outline-fill-color);\n stroke-width: 1px;\n}\n\n.djs-shape.connect-ok .djs-visual > :nth-child(1) {\n fill: var(--shape-connect-allowed-fill-color) !important;\n}\n\n.djs-shape.connect-not-ok .djs-visual > :nth-child(1),\n.djs-shape.drop-not-ok .djs-visual > :nth-child(1) {\n fill: var(--shape-drop-not-allowed-fill-color) !important;\n}\n\n.djs-shape.new-parent .djs-visual > :nth-child(1) {\n fill: var(--shape-drop-allowed-fill-color) !important;\n}\n\nsvg.drop-not-ok {\n background: var(--shape-drop-not-allowed-fill-color) !important;\n}\n\nsvg.new-parent {\n background: var(--shape-drop-allowed-fill-color) !important;\n}\n\n.djs-connection.connect-ok .djs-visual > :nth-child(1),\n.djs-connection.drop-ok .djs-visual > :nth-child(1) {\n stroke: var(--shape-drop-allowed-fill-color) !important;\n}\n\n.djs-connection.connect-not-ok .djs-visual > :nth-child(1),\n.djs-connection.drop-not-ok .djs-visual > :nth-child(1) {\n stroke: var(--shape-drop-not-allowed-fill-color) !important;\n}\n\n.drop-not-ok,\n.connect-not-ok {\n cursor: not-allowed;\n}\n\n.djs-element.attach-ok .djs-visual > :nth-child(1) {\n stroke-width: 5px !important;\n stroke: var(--shape-attach-allowed-stroke-color) !important;\n}\n\n.djs-frame.connect-not-ok .djs-visual > :nth-child(1),\n.djs-frame.drop-not-ok .djs-visual > :nth-child(1) {\n stroke-width: 3px !important;\n stroke: var(--shape-drop-not-allowed-fill-color) !important;\n fill: none !important;\n}\n\n/**\n* Selection box style\n*\n*/\n.djs-lasso-overlay {\n fill: var(--lasso-fill-color);\n\n stroke-dasharray: 5 1 3 1;\n stroke: var(--lasso-stroke-color);\n\n shape-rendering: geometricPrecision;\n pointer-events: none;\n}\n\n/**\n * Resize styles\n */\n.djs-resize-overlay {\n fill: none;\n\n stroke-dasharray: 5 1 3 1;\n stroke: var(--shape-resize-preview-stroke-color);\n\n pointer-events: none;\n}\n\n.djs-resizer-hit {\n fill: none;\n pointer-events: all;\n}\n\n.djs-resizer-visual {\n fill: var(--resizer-fill-color);\n stroke-width: 1px;\n stroke-opacity: 0.5;\n stroke: var(--resizer-stroke-color);\n shape-rendering: geometricprecision;\n}\n\n.djs-resizer:hover .djs-resizer-visual {\n stroke: var(--resizer-stroke-color);\n stroke-opacity: 1;\n}\n\n.djs-cursor-resize-ns,\n.djs-resizer-n,\n.djs-resizer-s {\n cursor: ns-resize;\n}\n\n.djs-cursor-resize-ew,\n.djs-resizer-e,\n.djs-resizer-w {\n cursor: ew-resize;\n}\n\n.djs-cursor-resize-nwse,\n.djs-resizer-nw,\n.djs-resizer-se {\n cursor: nwse-resize;\n}\n\n.djs-cursor-resize-nesw,\n.djs-resizer-ne,\n.djs-resizer-sw {\n cursor: nesw-resize;\n}\n\n.djs-shape.djs-resizing > .djs-outline {\n visibility: hidden !important;\n}\n\n.djs-shape.djs-resizing > .djs-resizer {\n visibility: hidden;\n}\n\n.djs-dragger > .djs-resizer {\n visibility: hidden;\n}\n\n/**\n * drag styles\n */\n.djs-dragger * {\n fill: none !important;\n stroke: var(--element-dragger-color) !important;\n}\n\n.djs-dragger tspan,\n.djs-dragger text {\n fill: var(--element-dragger-color) !important;\n stroke: none !important;\n}\n\nmarker.djs-dragger circle,\nmarker.djs-dragger path,\nmarker.djs-dragger polygon,\nmarker.djs-dragger polyline,\nmarker.djs-dragger rect {\n fill: var(--element-dragger-color) !important;\n stroke: none !important;\n}\n\nmarker.djs-dragger text,\nmarker.djs-dragger tspan {\n fill: none !important;\n stroke: var(--element-dragger-color) !important;\n}\n\n.djs-dragging {\n opacity: 0.3;\n}\n\n.djs-dragging,\n.djs-dragging > * {\n pointer-events: none !important;\n}\n\n.djs-dragging .djs-context-pad,\n.djs-dragging .djs-outline {\n display: none !important;\n}\n\n/**\n * no pointer events for visual\n */\n.djs-visual,\n.djs-outline {\n pointer-events: none;\n}\n\n.djs-element.attach-ok .djs-hit {\n stroke-width: 60px !important;\n}\n\n/**\n * all pointer events for hit shape\n */\n.djs-element > .djs-hit-all {\n pointer-events: all;\n}\n\n.djs-element > .djs-hit-stroke,\n.djs-element > .djs-hit-click-stroke {\n pointer-events: stroke;\n}\n\n/**\n * all pointer events for hit shape\n */\n.djs-drag-active .djs-element > .djs-hit-click-stroke {\n pointer-events: all;\n}\n\n/**\n * shape / connection basic styles\n */\n.djs-connection .djs-visual {\n stroke-width: 2px;\n fill: none;\n}\n\n.djs-cursor-grab {\n cursor: -webkit-grab;\n cursor: -moz-grab;\n cursor: grab;\n}\n\n.djs-cursor-grabbing {\n cursor: -webkit-grabbing;\n cursor: -moz-grabbing;\n cursor: grabbing;\n}\n\n.djs-cursor-crosshair {\n cursor: crosshair;\n}\n\n.djs-cursor-move {\n cursor: move;\n}\n\n.djs-cursor-resize-ns {\n cursor: ns-resize;\n}\n\n.djs-cursor-resize-ew {\n cursor: ew-resize;\n}\n\n\n/**\n * snapping\n */\n.djs-snap-line {\n stroke: var(--snap-line-stroke-color);\n stroke-linecap: round;\n stroke-width: 2px;\n pointer-events: none;\n}\n\n/**\n * snapping\n */\n.djs-crosshair {\n stroke: var(--space-tool-crosshair-stroke-color);\n stroke-linecap: round;\n stroke-width: 1px;\n pointer-events: none;\n shape-rendering: crispEdges;\n stroke-dasharray: 5, 5;\n}\n\n/**\n * palette\n */\n\n.djs-palette {\n position: absolute;\n left: 20px;\n top: 20px;\n\n box-sizing: border-box;\n width: 48px;\n}\n\n.djs-palette .separator {\n margin: 0 5px;\n padding-top: 5px;\n\n border: none;\n border-bottom: solid 1px var(--palette-separator-color);\n\n clear: both;\n}\n\n.djs-palette .entry:before {\n vertical-align: text-bottom;\n}\n\n.djs-palette .djs-palette-toggle {\n cursor: pointer;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n color: var(--palette-entry-color);\n font-size: 30px;\n\n text-align: center;\n}\n\n.djs-palette .entry {\n float: left;\n}\n\n.djs-palette .entry img {\n max-width: 100%;\n}\n\n.djs-palette .djs-palette-entries:after {\n content: '';\n display: table;\n clear: both;\n}\n\n.djs-palette .djs-palette-toggle:hover {\n background: var(--palette-toggle-hover-background-color);\n}\n\n.djs-palette .entry:hover {\n color: var(--palette-entry-hover-color);\n}\n\n.djs-palette .highlighted-entry {\n color: var(--palette-entry-selected-color) !important;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n width: 46px;\n height: 46px;\n line-height: 46px;\n cursor: default;\n}\n\n/**\n * Palette open / two-column layout is controlled via\n * classes on the palette. Events to hook into palette\n * changed life-cycle are available in addition.\n */\n.djs-palette.two-column.open {\n width: 94px;\n}\n\n.djs-palette:not(.open) .djs-palette-entries {\n display: none;\n}\n\n.djs-palette:not(.open) {\n overflow: hidden;\n}\n\n.djs-palette.open .djs-palette-toggle {\n display: none;\n}\n\n/**\n * context-pad\n */\n.djs-overlay-context-pad {\n width: 72px;\n z-index: 100;\n}\n\n.djs-context-pad {\n position: absolute;\n display: none;\n pointer-events: none;\n line-height: 1;\n}\n\n.djs-context-pad .entry {\n width: 22px;\n height: 22px;\n text-align: center;\n display: inline-block;\n font-size: 22px;\n margin: 0 2px 2px 0;\n\n border-radius: 3px;\n\n cursor: default;\n\n background-color: var(--context-pad-entry-background-color);\n box-shadow: 0 0 2px 1px var(--context-pad-entry-background-color);\n pointer-events: all;\n vertical-align: middle;\n}\n\n.djs-context-pad .entry:hover {\n background: var(--context-pad-entry-hover-background-color);\n}\n\n.djs-context-pad.open {\n display: block;\n}\n\n/**\n * popup styles\n */\n.djs-popup .entry {\n line-height: 20px;\n white-space: nowrap;\n cursor: default;\n}\n\n/* larger font for prefixed icons */\n.djs-popup .entry:before {\n vertical-align: middle;\n font-size: 20px;\n}\n\n.djs-popup .entry > span {\n vertical-align: middle;\n font-size: 14px;\n}\n\n.djs-popup .entry:hover,\n.djs-popup .entry.active:hover {\n background: var(--popup-header-entry-selected-background-color);\n}\n\n.djs-popup .entry.disabled {\n background: inherit;\n}\n\n.djs-popup .djs-popup-header .entry {\n display: inline-block;\n padding: 2px 3px 2px 3px;\n\n border: solid 1px transparent;\n border-radius: 3px;\n}\n\n.djs-popup .djs-popup-header .entry.active {\n color: var(--popup-header-entry-selected-color);\n border: solid 1px var(--popup-header-entry-selected-color);\n background-color: var(--popup-header-entry-selected-background-color);\n}\n\n.djs-popup-body .entry {\n padding: 4px 10px 4px 5px;\n}\n\n.djs-popup-body .entry > span {\n margin-left: 5px;\n}\n\n.djs-popup-body {\n background-color: var(--popup-body-background-color);\n}\n\n.djs-popup-header {\n border-bottom: 1px solid var(--popup-header-separator-color);\n}\n\n.djs-popup-header .entry {\n margin: 1px;\n margin-left: 3px;\n}\n\n.djs-popup-header .entry:last-child {\n margin-right: 3px;\n}\n\n/**\n * popup / palette styles\n */\n.djs-palette {\n background: var(--palette-background-color);\n border: solid 1px var(--palette-border-color);\n border-radius: 2px;\n}\n\n.djs-popup {\n background: var(--popup-background-color);\n border: solid 1px var(--popup-border-color);\n border-radius: 2px;\n}\n\n/**\n * touch\n */\n\n.djs-shape,\n.djs-connection {\n touch-action: none;\n}\n\n.djs-segment-dragger,\n.djs-bendpoint {\n display: none;\n}\n\n/**\n * bendpoints\n */\n.djs-segment-dragger .djs-visual {\n display: none;\n\n fill: var(--bendpoint-fill-color);\n stroke: var(--bendpoint-stroke-color);\n stroke-width: 1px;\n stroke-opacity: 1;\n}\n\n.djs-segment-dragger:hover .djs-visual {\n display: block;\n}\n\n.djs-bendpoint .djs-visual {\n fill: var(--bendpoint-fill-color);\n stroke: var(--bendpoint-stroke-color);\n stroke-width: 1px;\n stroke-opacity: 0.5;\n}\n\n.djs-segment-dragger:hover,\n.djs-bendpoints.hover .djs-segment-dragger,\n.djs-bendpoints.selected .djs-segment-dragger,\n.djs-bendpoint:hover,\n.djs-bendpoints.hover .djs-bendpoint,\n.djs-bendpoints.selected .djs-bendpoint {\n display: block;\n}\n\n.djs-drag-active .djs-bendpoints * {\n display: none;\n}\n\n.djs-bendpoints:not(.hover) .floating {\n display: none;\n}\n\n.djs-segment-dragger:hover .djs-visual,\n.djs-segment-dragger.djs-dragging .djs-visual,\n.djs-bendpoint:hover .djs-visual,\n.djs-bendpoint.floating .djs-visual {\n fill: var(--bendpoint-fill-color);\n stroke: var(--bendpoint-stroke-color);\n stroke-opacity: 1;\n}\n\n.djs-bendpoint.floating .djs-hit {\n pointer-events: none;\n}\n\n.djs-segment-dragger .djs-hit,\n.djs-bendpoint .djs-hit {\n fill: none;\n pointer-events: all;\n}\n\n.djs-segment-dragger.horizontal .djs-hit {\n cursor: ns-resize;\n}\n\n.djs-segment-dragger.vertical .djs-hit {\n cursor: ew-resize;\n}\n\n.djs-segment-dragger.djs-dragging .djs-hit {\n pointer-events: none;\n}\n\n.djs-updating,\n.djs-updating > * {\n pointer-events: none !important;\n}\n\n.djs-updating .djs-context-pad,\n.djs-updating .djs-outline,\n.djs-updating .djs-bendpoint,\n.connect-ok .djs-bendpoint,\n.connect-not-ok .djs-bendpoint,\n.drop-ok .djs-bendpoint,\n.drop-not-ok .djs-bendpoint {\n display: none !important;\n}\n\n.djs-segment-dragger.djs-dragging,\n.djs-bendpoint.djs-dragging {\n display: block;\n opacity: 1.0;\n}\n\n\n/**\n * tooltips\n */\n.djs-tooltip-error {\n width: 160px;\n padding: 6px;\n\n background: var(--tooltip-error-background-color);\n border: solid 1px var(--tooltip-error-border-color);\n border-radius: 2px;\n color: var(--tooltip-error-color);\n font-size: 12px;\n line-height: 16px;\n\n opacity: 0.75;\n}\n\n.djs-tooltip-error:hover {\n opacity: 1;\n}\n\n\n/**\n * search pad\n */\n.djs-search-container {\n position: absolute;\n top: 20px;\n left: 0;\n right: 0;\n margin-left: auto;\n margin-right: auto;\n\n width: 25%;\n min-width: 300px;\n max-width: 400px;\n z-index: 10;\n\n font-size: 1.05em;\n opacity: 0.9;\n background: var(--search-container-background-color);\n border: solid 1px var(--search-container-border-color);\n border-radius: 2px;\n box-shadow: 0 0 0 2px var(--search-container-box-shadow-color), 0 0 0 1px var(--search-container-box-shadow-inset-color) inset;\n}\n\n.djs-search-container:not(.open) {\n display: none;\n}\n\n.djs-search-input input {\n font-size: 1.05em;\n width: 100%;\n padding: 6px 10px;\n border: 1px solid var(--search-input-border-color);\n box-sizing: border-box;\n}\n\n.djs-search-input input:focus {\n outline: none;\n border-color: var(--search-input-border-color);\n}\n\n.djs-search-results {\n position: relative;\n overflow-y: auto;\n max-height: 200px;\n}\n\n.djs-search-results:hover {\n cursor: pointer;\n}\n\n.djs-search-result {\n width: 100%;\n padding: 6px 10px;\n background: white;\n border-bottom: solid 1px var(--search-result-border-color);\n border-radius: 1px;\n}\n\n.djs-search-highlight {\n color: var(--search-result-highlight-color);\n}\n\n.djs-search-result-primary {\n margin: 0 0 10px;\n}\n\n.djs-search-result-secondary {\n font-family: monospace;\n margin: 0;\n}\n\n.djs-search-result:hover {\n background: var(--search-result-selected-color);\n}\n\n.djs-search-result-selected {\n background: var(--search-result-selected-color);\n}\n\n.djs-search-result-selected:hover {\n background: var(--search-result-selected-color);\n}\n\n.djs-search-overlay {\n background: var(--search-result-selected-color);\n}\n\n/**\n * hidden styles\n */\n.djs-element-hidden,\n.djs-element-hidden .djs-hit,\n.djs-element-hidden .djs-outline,\n.djs-label-hidden .djs-label {\n display: none !important;\n}\n","@font-face {\n font-family: 'bpmn';\n src: url('../font/bpmn.eot?26374340');\n src: url('../font/bpmn.eot?26374340#iefix') format('embedded-opentype'),\n url('../font/bpmn.woff2?26374340') format('woff2'),\n url('../font/bpmn.woff?26374340') format('woff'),\n url('../font/bpmn.ttf?26374340') format('truetype'),\n url('../font/bpmn.svg?26374340#bpmn') format('svg');\n font-weight: normal;\n font-style: normal;\n}\n/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */\n/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */\n/*\n@media screen and (-webkit-min-device-pixel-ratio:0) {\n @font-face {\n font-family: 'bpmn';\n src: url('../font/bpmn.svg?26374340#bpmn') format('svg');\n }\n}\n*/\n\n [class^=\"bpmn-icon-\"]:before, [class*=\" bpmn-icon-\"]:before {\n font-family: \"bpmn\";\n font-style: normal;\n font-weight: normal;\n speak: never;\n\n display: inline-block;\n text-decoration: inherit;\n width: 1em;\n /* margin-right: .2em; */\n text-align: center;\n /* opacity: .8; */\n\n /* For safety - reset parent styles, that can break glyph codes*/\n font-variant: normal;\n text-transform: none;\n\n /* fix buttons height, for twitter bootstrap */\n line-height: 1em;\n\n /* Animation center compensation - margins should be symmetric */\n /* remove if not needed */\n /* margin-left: .2em; */\n\n /* you can be more comfortable with increased icons size */\n /* font-size: 120%; */\n\n /* Font smoothing. That was taken from TWBS */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n /* Uncomment for 3D effect */\n /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */\n}\n\n.bpmn-icon-screw-wrench:before { content: '\\e800'; } /* '' */\n.bpmn-icon-trash:before { content: '\\e801'; } /* '' */\n.bpmn-icon-conditional-flow:before { content: '\\e802'; } /* '' */\n.bpmn-icon-default-flow:before { content: '\\e803'; } /* '' */\n.bpmn-icon-gateway-parallel:before { content: '\\e804'; } /* '' */\n.bpmn-icon-intermediate-event-catch-cancel:before { content: '\\e805'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-message:before { content: '\\e806'; } /* '' */\n.bpmn-icon-start-event-compensation:before { content: '\\e807'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-parallel-multiple:before { content: '\\e808'; } /* '' */\n.bpmn-icon-loop-marker:before { content: '\\e809'; } /* '' */\n.bpmn-icon-parallel-mi-marker:before { content: '\\e80a'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-signal:before { content: '\\e80b'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-timer:before { content: '\\e80c'; } /* '' */\n.bpmn-icon-intermediate-event-catch-parallel-multiple:before { content: '\\e80d'; } /* '' */\n.bpmn-icon-intermediate-event-catch-compensation:before { content: '\\e80e'; } /* '' */\n.bpmn-icon-gateway-xor:before { content: '\\e80f'; } /* '' */\n.bpmn-icon-connection:before { content: '\\e810'; } /* '' */\n.bpmn-icon-end-event-cancel:before { content: '\\e811'; } /* '' */\n.bpmn-icon-intermediate-event-catch-condition:before { content: '\\e812'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-parallel-multiple:before { content: '\\e813'; } /* '' */\n.bpmn-icon-start-event-condition:before { content: '\\e814'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-timer:before { content: '\\e815'; } /* '' */\n.bpmn-icon-sequential-mi-marker:before { content: '\\e816'; } /* '' */\n.bpmn-icon-user-task:before { content: '\\e817'; } /* '' */\n.bpmn-icon-business-rule:before { content: '\\e818'; } /* '' */\n.bpmn-icon-sub-process-marker:before { content: '\\e819'; } /* '' */\n.bpmn-icon-start-event-parallel-multiple:before { content: '\\e81a'; } /* '' */\n.bpmn-icon-start-event-error:before { content: '\\e81b'; } /* '' */\n.bpmn-icon-intermediate-event-catch-signal:before { content: '\\e81c'; } /* '' */\n.bpmn-icon-intermediate-event-catch-error:before { content: '\\e81d'; } /* '' */\n.bpmn-icon-end-event-compensation:before { content: '\\e81e'; } /* '' */\n.bpmn-icon-subprocess-collapsed:before { content: '\\e81f'; } /* '' */\n.bpmn-icon-subprocess-expanded:before { content: '\\e820'; } /* '' */\n.bpmn-icon-task:before { content: '\\e821'; } /* '' */\n.bpmn-icon-end-event-error:before { content: '\\e822'; } /* '' */\n.bpmn-icon-intermediate-event-catch-escalation:before { content: '\\e823'; } /* '' */\n.bpmn-icon-intermediate-event-catch-timer:before { content: '\\e824'; } /* '' */\n.bpmn-icon-start-event-escalation:before { content: '\\e825'; } /* '' */\n.bpmn-icon-start-event-signal:before { content: '\\e826'; } /* '' */\n.bpmn-icon-business-rule-task:before { content: '\\e827'; } /* '' */\n.bpmn-icon-manual:before { content: '\\e828'; } /* '' */\n.bpmn-icon-receive:before { content: '\\e829'; } /* '' */\n.bpmn-icon-call-activity:before { content: '\\e82a'; } /* '' */\n.bpmn-icon-start-event-timer:before { content: '\\e82b'; } /* '' */\n.bpmn-icon-start-event-message:before { content: '\\e82c'; } /* '' */\n.bpmn-icon-intermediate-event-none:before { content: '\\e82d'; } /* '' */\n.bpmn-icon-intermediate-event-catch-link:before { content: '\\e82e'; } /* '' */\n.bpmn-icon-end-event-escalation:before { content: '\\e82f'; } /* '' */\n.bpmn-icon-text-annotation:before { content: '\\e830'; } /* '' */\n.bpmn-icon-bpmn-io:before { content: '\\e831'; } /* '' */\n.bpmn-icon-gateway-complex:before { content: '\\e832'; } /* '' */\n.bpmn-icon-gateway-eventbased:before { content: '\\e833'; } /* '' */\n.bpmn-icon-gateway-none:before { content: '\\e834'; } /* '' */\n.bpmn-icon-gateway-or:before { content: '\\e835'; } /* '' */\n.bpmn-icon-end-event-terminate:before { content: '\\e836'; } /* '' */\n.bpmn-icon-end-event-signal:before { content: '\\e837'; } /* '' */\n.bpmn-icon-end-event-none:before { content: '\\e838'; } /* '' */\n.bpmn-icon-end-event-multiple:before { content: '\\e839'; } /* '' */\n.bpmn-icon-end-event-message:before { content: '\\e83a'; } /* '' */\n.bpmn-icon-end-event-link:before { content: '\\e83b'; } /* '' */\n.bpmn-icon-intermediate-event-catch-message:before { content: '\\e83c'; } /* '' */\n.bpmn-icon-intermediate-event-throw-compensation:before { content: '\\e83d'; } /* '' */\n.bpmn-icon-start-event-multiple:before { content: '\\e83e'; } /* '' */\n.bpmn-icon-script:before { content: '\\e83f'; } /* '' */\n.bpmn-icon-manual-task:before { content: '\\e840'; } /* '' */\n.bpmn-icon-send:before { content: '\\e841'; } /* '' */\n.bpmn-icon-service:before { content: '\\e842'; } /* '' */\n.bpmn-icon-receive-task:before { content: '\\e843'; } /* '' */\n.bpmn-icon-user:before { content: '\\e844'; } /* '' */\n.bpmn-icon-start-event-none:before { content: '\\e845'; } /* '' */\n.bpmn-icon-intermediate-event-throw-escalation:before { content: '\\e846'; } /* '' */\n.bpmn-icon-intermediate-event-catch-multiple:before { content: '\\e847'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-escalation:before { content: '\\e848'; } /* '' */\n.bpmn-icon-intermediate-event-throw-link:before { content: '\\e849'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-condition:before { content: '\\e84a'; } /* '' */\n.bpmn-icon-data-object:before { content: '\\e84b'; } /* '' */\n.bpmn-icon-script-task:before { content: '\\e84c'; } /* '' */\n.bpmn-icon-send-task:before { content: '\\e84d'; } /* '' */\n.bpmn-icon-data-store:before { content: '\\e84e'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-escalation:before { content: '\\e84f'; } /* '' */\n.bpmn-icon-intermediate-event-throw-message:before { content: '\\e850'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-multiple:before { content: '\\e851'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-signal:before { content: '\\e852'; } /* '' */\n.bpmn-icon-intermediate-event-throw-multiple:before { content: '\\e853'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-message:before { content: '\\e854'; } /* '' */\n.bpmn-icon-ad-hoc-marker:before { content: '\\e855'; } /* '' */\n.bpmn-icon-service-task:before { content: '\\e856'; } /* '' */\n.bpmn-icon-task-none:before { content: '\\e857'; } /* '' */\n.bpmn-icon-compensation-marker:before { content: '\\e858'; } /* '' */\n.bpmn-icon-start-event-non-interrupting-multiple:before { content: '\\e859'; } /* '' */\n.bpmn-icon-intermediate-event-throw-signal:before { content: '\\e85a'; } /* '' */\n.bpmn-icon-intermediate-event-catch-non-interrupting-condition:before { content: '\\e85b'; } /* '' */\n.bpmn-icon-participant:before { content: '\\e85c'; } /* '' */\n.bpmn-icon-event-subprocess-expanded:before { content: '\\e85d'; } /* '' */\n.bpmn-icon-lane-insert-below:before { content: '\\e85e'; } /* '' */\n.bpmn-icon-space-tool:before { content: '\\e85f'; } /* '' */\n.bpmn-icon-connection-multi:before { content: '\\e860'; } /* '' */\n.bpmn-icon-lane:before { content: '\\e861'; } /* '' */\n.bpmn-icon-lasso-tool:before { content: '\\e862'; } /* '' */\n.bpmn-icon-lane-insert-above:before { content: '\\e863'; } /* '' */\n.bpmn-icon-lane-divide-three:before { content: '\\e864'; } /* '' */\n.bpmn-icon-lane-divide-two:before { content: '\\e865'; } /* '' */\n.bpmn-icon-data-input:before { content: '\\e866'; } /* '' */\n.bpmn-icon-data-output:before { content: '\\e867'; } /* '' */\n.bpmn-icon-hand-tool:before { content: '\\e868'; } /* '' */\n.bpmn-icon-group:before { content: '\\e869'; } /* '' */\n.bpmn-icon-transaction:before { content: '\\e8c4'; } /* '' */","@font-face {\n font-family: \"Material Icons\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons.woff2\") format(\"woff2\"), url(\"./material-icons.woff\") format(\"woff\");\n}\n.material-icons {\n font-family: \"Material Icons\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Outlined\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-outlined.woff2\") format(\"woff2\"), url(\"./material-icons-outlined.woff\") format(\"woff\");\n}\n.material-icons-outlined {\n font-family: \"Material Icons Outlined\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Round\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-round.woff2\") format(\"woff2\"), url(\"./material-icons-round.woff\") format(\"woff\");\n}\n.material-icons-round {\n font-family: \"Material Icons Round\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Sharp\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-sharp.woff2\") format(\"woff2\"), url(\"./material-icons-sharp.woff\") format(\"woff\");\n}\n.material-icons-sharp {\n font-family: \"Material Icons Sharp\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n\n@font-face {\n font-family: \"Material Icons Two Tone\";\n font-style: normal;\n font-weight: 400;\n font-display: block;\n src: url(\"./material-icons-two-tone.woff2\") format(\"woff2\"), url(\"./material-icons-two-tone.woff\") format(\"woff\");\n}\n.material-icons-two-tone {\n font-family: \"Material Icons Two Tone\";\n font-weight: normal;\n font-style: normal;\n font-size: 24px;\n line-height: 1;\n letter-spacing: normal;\n text-transform: none;\n display: inline-block;\n white-space: nowrap;\n word-wrap: normal;\n direction: ltr;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n font-feature-settings: \"liga\";\n}\n","@use 'sass:color';\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n\n/// Include content under the current selector (&) or the document root if there is no current\n/// selector.\n/// @param {String} $root [html] The default root selector to use when there is no current selector.\n/// @output The given content under the current selector, or root selector if there is no current\n/// selector.\n/// @content Content to output under the current selector, or root selector if there is no current\n/// selector.\n@mixin current-selector-or-root($root: html) {\n @if & {\n @content;\n }\n @else {\n #{$root} {\n @content;\n }\n }\n}\n\n/// A version of the standard `map.merge` function that takes a variable number of arguments.\n/// Each argument is merged into the final result from left to right.\n/// @param {List} $maps The maps to combine with map.merge\n/// @return {Map} The combined result of successively calling map.merge with each parameter.\n@function merge-all($maps...) {\n $result: ();\n @each $map in $maps {\n $result: map.merge($result, $map);\n }\n @return $result;\n}\n\n/// A version of the standard `map.deep-merge` function that takes a variable number of arguments.\n/// Each argument is deep-merged into the final result from left to right.\n/// @param {List} $maps The maps to combine with map.deep-merge\n/// @return {Map} The combined result of successively calling map.deep-merge with each parameter.\n@function deep-merge-all($maps...) {\n $result: ();\n @each $map in $maps {\n $result: map.deep-merge($result, $map);\n }\n @return $result;\n}\n\n/// Coerces the given value to a list, by converting any non-list value into a single-item list.\n/// This should be used when dealing with user-passed lists of args to avoid confusing errors,\n/// since Sass treats `($x)` as equivalent to `$x`.\n/// @param {Any} $value The value to coerce to a list.\n/// @return {List} The original $value if it was a list, otherwise a single-item list containing\n/// $value.\n@function coerce-to-list($value) {\n @return if(meta.type-of($value) != 'list', ($value,), $value);\n}\n\n/// A version of the Sass `color.change` function that is safe ot use with CSS variables.\n@function safe-color-change($color, $args...) {\n $args: meta.keywords($args);\n @return if(meta.type-of($color) == 'color', color.change($color, $args...), $color);\n}\n\n/// Gets the given arguments as a map of keywords and validates that only supported arguments were\n/// passed.\n/// @param {ArgList} $args The arguments to convert to a keywords map.\n/// @param {List} $supported-args The supported argument names.\n/// @return {Map} The $args as a map of argument name to argument value.\n@function validate-keyword-args($args, $supported-args) {\n @if list.length($args) > 0 {\n @error #{'Expected keyword args, but got positional args: '}#{$args};\n }\n $kwargs: meta.keywords($args);\n @each $arg, $v in $kwargs {\n @if list.index($supported-args, $arg) == null {\n @error #{'Unsupported argument '}#{$arg}#{'. Valid arguments are: '}#{$supported-args};\n }\n }\n @return $kwargs;\n}\n","//\n// Copyright 2020 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n@use './gss';\n\n/// When true, add an additional property/value declaration before declarations\n/// that use advanced features such as custom properties or CSS functions. This\n/// adds fallback support for older browsers such as IE11 that do not support\n/// these features at the cost of additional CSS. Set this variable to false to\n/// disable generating fallback declarations.\n$enable-fallback-declarations: true !default;\n\n/// Writes a CSS property/value declaration. This mixin is used throughout the\n/// theme package for consistency for dynamically setting CSS property values.\n///\n/// This mixin may optionally take a fallback value. For advanced features such\n/// as custom properties or CSS functions like min and max, a fallback value is\n/// recommended to support older browsers.\n///\n/// @param {String} $property - The CSS property of the declaration.\n/// @param {*} $value - The value of the CSS declaration. The value should be\n/// resolved by other theme functions first (i.e. custom property Maps and\n/// Material theme keys are not supported in this mixin). If the value is\n/// null, no declarations will be emitted.\n/// @param {*} $fallback - An optional fallback value for older browsers. If\n/// provided, a second property/value declaration will be added before the\n/// main property/value declaration.\n/// @param {Map} $gss - An optional Map of GSS annotations to add.\n/// @param {Bool} $important - If true, add `!important` to the declaration.\n@mixin declaration(\n $property,\n $value,\n $fallback-value: null,\n $gss: (),\n $important: false\n) {\n // Normally setting a null value to a property will not emit CSS, so mixins\n // wouldn't need to check this. However, Sass will throw an error if the\n // interpolated property is a custom property.\n @if $value != null {\n $important-rule: if($important, ' !important', '');\n\n @if $fallback-value and $enable-fallback-declarations {\n @include gss.annotate($gss);\n #{$property}: #{$fallback-value} #{$important-rule};\n\n // Add @alternate to annotations.\n $gss: map.merge(\n $gss,\n (\n alternate: true,\n )\n );\n }\n\n @include gss.annotate($gss);\n #{$property}: #{$value}#{$important-rule};\n }\n}\n\n/// Unpacks shorthand values for CSS properties (i.e. lists of 1-3 values).\n/// If a list of 4 values is given, it is returned as-is.\n///\n/// Examples:\n///\n/// unpack-value(4px) => 4px 4px 4px 4px\n/// unpack-value(4px 2px) => 4px 2px 4px 2px\n/// unpack-value(4px 2px 2px) => 4px 2px 2px 2px\n/// unpack-value(4px 2px 0 2px) => 4px 2px 0 2px\n///\n/// @param {Number | Map | List} $value - List of 1 to 4 value numbers.\n/// @return {List} a List of 4 value numbers.\n@function unpack-value($value) {\n @if meta.type-of($value) == 'map' or list.length($value) == 1 {\n @return $value $value $value $value;\n } @else if list.length($value) == 4 {\n @return $value;\n } @else if list.length($value) == 3 {\n @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 3)\n list.nth($value, 2);\n } @else if list.length($value) == 2 {\n @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 1)\n list.nth($value, 2);\n }\n\n @error \"Invalid CSS property value: '#{$value}' is more than 4 values\";\n}\n","// Custom Theming for Angular Material\n// For more information: https://material.angular.io/guide/theming\n@use \"@angular/material\" as mat;\n@import \"@angular/material\";\n@import \"material-icons/iconfont/material-icons.css\";\n// Plus imports for other components in your app.\n// Include the common styles for Angular Material. We include this here so that you only\n// have to load a single css file for Angular Material in your app.\n// Be sure that you only ever include this mixin once!\n@include mat.all-component-typographies();\n@include mat.core();\n\n:root {\n --borderGray10: #e8e9ed;\n}\n// Define the palettes for your theme using the Material Design palettes available in palette.scss\n// (imported above). For each palette, you can optionally specify a default, lighter, and darker\n// hue. Available color palettes: https://material.io/design/color/\n\n// This pallette was generated with https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors,\n// using the color of the left part of the Domain Storytelling logo (#A4D7E1) as primary color (nr. 100 in the palette):\n$egon-palette: (\n 50: #daeff3,\n 100: #a4d7e1,\n 200: #67bdcd,\n 300: #15a3b9,\n 400: #0093ac,\n 500: #00839f,\n 600: #00758f,\n 700: #006377,\n 800: #005160,\n 900: #003139,\n contrast: (\n 50: black,\n 100: black,\n 200: black,\n 300: white,\n 400: white,\n 500: white,\n 600: white,\n 700: white,\n 800: white,\n 900: white,\n ),\n);\n\n// mdc-filled-text-field-focus-label-text-color: rgba(164, 215, 225, 0.87);\n\n// This was generated (see egon-palette, with 100 as primary color)\n$egon-contrast-palette: (\n 50: #eedddd,\n 100: #e1aea4,\n 200: #cb796b,\n 300: #b64435,\n 400: #a90e10,\n 500: #9b0000,\n 600: #940000,\n 700: #8a0000,\n 800: #7c0000,\n 900: #660000,\n contrast: (\n 50: black,\n 100: black,\n 200: black,\n 300: white,\n 400: white,\n 500: white,\n 600: white,\n 700: white,\n 800: white,\n 900: white,\n ),\n);\n\n// @param base-pallette\n// @param primary\n// @param lighter\n// @param darker\n$egon-primary: mat.define-palette($egon-palette, 100, 50, 200);\n$egon-accent: mat.define-palette($egon-palette, 400, 300, 500);\n\n// The warn palette is optional (defaults to red).\n$egon-warn: mat.define-palette($egon-contrast-palette, 200, 100, 300);\n\n// Create the theme object. A theme consists of configurations for individual\n// theming systems such as \"color\" or \"typography\".\n$egon-theme: mat.define-light-theme(\n (\n color: (\n primary: $egon-primary,\n accent: $egon-accent,\n warn: $egon-warn,\n ),\n )\n);\n\n// Include theme styles for core and each component used in your app.\n// Alternatively, you can import and @include the theme mixins for each component\n// that you are using.\n@include mat.all-component-themes($egon-theme);\n\n/* FONTS */\n\n@font-face {\n font-family: Roboto;\n font-style: normal, bold;\n src: local(\"Roboto-Regular\"), url(\"~src/assets/font/Roboto-Regular.woff\");\n}\n\n/* You can add global styles to this file, and also import other style files */\n\nhtml,\nbody {\n height: 100%;\n}\n\nbody {\n margin: 0;\n font-family: Roboto, \"Helvetica Neue\", Arial, sans-serif;\n}\n\n.smallScrollbar {\n /* Works on Firefox */\n scrollbar-width: thin;\n\n /* Works on Chrome, Edge, and Safari */\n *::-webkit-scrollbar {\n width: 12px;\n }\n}\n\n.headline {\n font-size: 1.1rem;\n cursor: pointer;\n}\n\n.headerButton {\n background-color: transparent;\n border: none;\n letter-spacing: 0.05em;\n}\n\n.headerButton:hover {\n color: #0093ac;\n cursor: pointer;\n}\n\n.spacer {\n flex: 1 1 auto;\n}\n\n.mr-1 {\n margin-right: 8px !important;\n}\n\n.mr-10 {\n margin-right: 10px !important;\n}\n\n.materialIconButton {\n font-size: 24px !important;\n padding-left: 5px;\n padding-right: 5px;\n margin-top: 9px;\n}\n\n.dense-8 {\n @include mat.all-component-densities(-8);\n}\n\napp-root {\n display: block;\n height: 100%;\n}\n\na {\n color: map-get($egon-accent, 900);\n}\n\n/* Material Design */\n\nmat-dialog-actions.mdc-dialog__actions {\n padding: 0 24px 20px 24px;\n justify-content: end;\n}\n\n.mat-mdc-snack-bar-container {\n &.snackbar_success {\n --mdc-snackbar-container-color: #a4d7e1;\n --mat-mdc-snack-bar-button-color: black;\n --mdc-snackbar-supporting-text-color: black;\n }\n &.snackbar_error {\n --mdc-snackbar-container-color: #b64435;\n --mat-mdc-snack-bar-button-color: #fff;\n --mdc-snackbar-supporting-text-color: #fff;\n }\n &.snackbar_info {\n --mdc-snackbar-container-color: #f7f7f8;\n --mat-mdc-snack-bar-button-color: black;\n --mat-snack-bar-button-color: black;\n --mdc-snackbar-supporting-text-color: black;\n }\n}\n\n/**\n * from diagram-js\n */\n\n/* context pad */\n\n.djs-overlay-context-pad {\n min-width: 7.5rem;\n height: auto;\n}\n\n.djs-context-pad.open {\n border: solid 1px #b9bcc6;\n}\n\n.djs-context-pad.open > .group {\n border: solid 1px #b9bcc6;\n padding: 1px;\n background-color: #f7f7f8;\n}\n\n/**\n * palette\n */\n\n.djs-palette {\n position: absolute;\n left: 20px;\n top: 20px;\n\n box-sizing: border-box;\n width: 32px;\n}\n\n.djs-palette .separator {\n margin: 0 2px;\n padding-top: 0;\n\n border: none;\n border-bottom: solid 1px #b9bcc6;\n\n clear: both;\n}\n\n.djs-palette .entry:before {\n vertical-align: middle;\n}\n\n.djs-palette .djs-palette-toggle {\n cursor: pointer;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n color: #333;\n font-size: 26px;\n\n text-align: center;\n}\n\n.djs-palette .entry {\n float: left;\n}\n\n.djs-palette .entry img {\n max-width: 100%;\n}\n\n.djs-palette .djs-palette-entries:after {\n content: \"\";\n display: table;\n clear: both;\n}\n\n.djs-palette .djs-palette-toggle:hover {\n background: #666;\n}\n\n.djs-palette .entry:hover {\n fill: #a4d7e1;\n}\n\n.djs-palette .highlighted-entry {\n color: #a4d7e1 !important;\n}\n\n.djs-palette .entry,\n.djs-palette .djs-palette-toggle {\n width: 30px;\n height: 30px;\n line-height: 30px;\n cursor: default;\n}\n\n/**\n * Palette open / two-column layout is controlled via\n * classes on the palette. Events to hook into palette\n * changed life-cycle are available in addition.\n */\n.djs-palette.two-column.open {\n width: 64px;\n}\n\n.djs-palette:not(.open) .djs-palette-entries {\n display: none;\n}\n\n.djs-palette:not(.open) {\n overflow: hidden;\n}\n\n.djs-palette.open .djs-palette-toggle {\n display: none;\n}\n\n/**\n * outline styles\n */\n\n.djs-outline {\n fill: none;\n visibility: hidden;\n}\n\n.djs-element.hover .djs-outline,\n.djs-element.selected .djs-outline {\n visibility: visible;\n shape-rendering: crispEdges;\n stroke-dasharray: 3, 3;\n}\n\n.djs-element.hover .djs-outline {\n stroke: #a4d7e1;\n}\n\n.djs-element.attach-ok .djs-visual > :nth-child(1) {\n stroke: #a4d7e1 !important;\n}\n\n/**\n* Selection box style\n*\n*/\n.djs-lasso-overlay {\n stroke: #a4d7e1;\n}\n\n/**\n * Resize styles\n */\n.djs-resize-overlay {\n stroke: #a4d7e1;\n}\n\n/**\n * drag styles\n */\n.djs-dragger .djs-visual circle,\n.djs-dragger .djs-visual path,\n.djs-dragger .djs-visual polygon,\n.djs-dragger .djs-visual polyline,\n.djs-dragger .djs-visual rect,\n.djs-dragger .djs-visual text {\n fill: none !important;\n stroke: #a4d7e1 !important;\n}\n\n/**\n * snapping\n */\n.djs-snap-line {\n stroke: #e1aea4;\n}\n\n.djs-palette .entry:hover {\n color: #a4d7e1;\n}\n\n.djs-palette .highlighted-entry {\n color: #a4d7e1 !important;\n}\n\n.djs-context-pad .entry:hover {\n background: #a4d7e1;\n}\n\n.djs-popup .djs-popup-header .entry.active {\n color: #a4d7e1;\n border: solid 1px #a4d7e1;\n background-color: #f7f7f8;\n}\n\n.djs-popup-body .entry {\n width: auto !important;\n}\n\n.djs-segment-dragger:hover .djs-visual,\n.djs-segment-dragger.djs-dragging .djs-visual,\n.djs-bendpoint:hover .djs-visual,\n.djs-bendpoint.floating .djs-visual {\n fill: #a4d7e1;\n stroke-opacity: 0.5;\n stroke: black;\n}\n\n.djs-segment-dragger.djs-dragging .djs-visual,\n.djs-bendpoint.djs-dragging .djs-visual {\n fill: #a4d7e1;\n}\n\n.djs-tooltip-error > * {\n color: #a4d7e1;\n border-left: solid 5px #a4d7e1;\n}\n\n.autocomplete-items {\n border: 1px solid #b9bcc6;\n background-color: #f7f7f8;\n}\n\n.autocomplete-active {\n background-color: #a4d7e1 !important;\n}\n","@use 'sass:list';\n@use 'sass:map';\n@use 'sass:string';\n@use 'typography-utils';\n@use '../theming/inspection';\n@use './versioning';\n\n// Definition and versioning functions live in their own files to avoid circular dependencies, but\n// we re-export them here so that historical imports from this file continue to work without needing\n// to be updated.\n@forward './definition';\n@forward './versioning';\n\n@mixin typography-hierarchy($theme, $selector: '.mat-typography', $back-compat: false) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _m3-typography-hierarchy($theme, $selector, $back-compat);\n }\n @else {\n @include _m2-typography-hierarchy($theme, $selector);\n }\n}\n\n@function _get-selector($selectors, $prefix) {\n $result: ();\n @each $selector in $selectors {\n // Don't add \"naked\" tag selectors, and don't nest prefix selector.\n @if string.index($selector, '.') == 1 {\n $result: list.append($result, $selector, $separator: comma);\n }\n // Don't nest the prefix selector in itself.\n @if $selector != $prefix {\n $result: list.append($result, '#{$prefix} #{$selector}', $separator: comma);\n }\n }\n @return $result;\n}\n\n@mixin _m3-typography-level($theme, $selector-prefix, $level, $selectors, $margin: null) {\n #{_get-selector($selectors, $selector-prefix)} {\n // TODO(mmalerba): When we expose system tokens as CSS vars, we should change this to emit token\n // slots.\n font: inspection.get-theme-typography($theme, $level, font);\n letter-spacing: inspection.get-theme-typography($theme, $level, letter-spacing);\n @if $margin != null {\n margin: 0 0 $margin;\n }\n }\n}\n\n@mixin _m3-typography-hierarchy($theme, $selector-prefix, $add-m2-selectors) {\n $levels: (\n display-large: (\n selectors: ('.mat-display-large', 'h1'),\n m2-selectors: ('.mat-h1', '.mat-headline-1'),\n margin: 0.5em\n ),\n display-medium: (\n selectors: ('.mat-display-medium', 'h2'),\n m2-selectors: ('.mat-h2', '.mat-headline-2'),\n margin: 0.5em\n ),\n display-small: (\n selectors: ('.mat-display-small', 'h3'),\n m2-selectors: ('.mat-h3', '.mat-headline-3'),\n margin: 0.5em\n ),\n headline-large: (\n selectors: ('.mat-headline-large', 'h4'),\n m2-selectors: ('.mat-h4', '.mat-headline-4'),\n margin: 0.5em\n ),\n headline-medium: (\n selectors: ('.mat-headline-medium', 'h5'),\n m2-selectors: ('.mat-h5', '.mat-headline-5'),\n margin: 0.5em\n ),\n headline-small: (\n selectors: ('.mat-headline-small', 'h6'),\n m2-selectors: ('.mat-h6', '.mat-headline-6'),\n margin: 0.5em\n ),\n title-large: (\n selectors: ('.mat-title-large'),\n m2-selectors: ('.mat-subtitle-1'),\n ),\n title-medium: (\n selectors: ('.mat-title-medium'),\n m2-selectors: ('.mat-subtitle-2'),\n ),\n title-small: (\n selectors: ('.mat-title-small')\n ),\n body-large: (\n selectors: ('.mat-body-large', $selector-prefix),\n m2-selectors: ('.mat-body', '.mat-body-strong', '.mat-body-2'),\n ),\n body-medium: (\n selectors: ('.mat-body-medium')\n ),\n body-small: (\n selectors: ('.mat-body-small')\n ),\n label-large: (\n selectors: ('.mat-label-large')\n ),\n label-medium: (\n selectors: ('.mat-label-medium')\n ),\n label-small: (\n selectors: ('.mat-label-small'),\n m2-selectors: ('.mat-small', '.mat-caption')\n ),\n );\n\n @each $level, $options in $levels {\n @if $add-m2-selectors {\n $options: map.set($options, selectors,\n list.join(map.get($options, selectors), map.get($options, m2-selectors) or ()));\n }\n $options: map.remove($options, m2-selectors);\n\n // Apply styles for the level.\n @include _m3-typography-level($theme, $selector-prefix, $level, $options...);\n\n // Also style

inside body-large.\n @if $level == body-large {\n #{_get-selector(map.get($options, selectors), $selector-prefix)} {\n p {\n margin: 0 0 0.75em;\n }\n }\n }\n }\n}\n\n/// Emits baseline typographic styles based on a given config.\n/// @param {Map} $config-or-theme A typography config for an entire theme.\n/// @param {String} $selector Ancestor selector under which native elements, such as h1, will\n/// be styled.\n@mixin _m2-typography-hierarchy($theme, $selector) {\n // Note that it seems redundant to prefix the class rules with the `$selector`, however it's\n // necessary if we want to allow people to overwrite the tag selectors. This is due to\n // selectors like `#{$selector} h1` being more specific than ones like `.mat-title`.\n .mat-h1,\n .mat-headline-5,\n #{$selector} .mat-h1,\n #{$selector} .mat-headline-5,\n #{$selector} h1 {\n font: inspection.get-theme-typography($theme, headline-5, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-5, letter-spacing);\n margin: 0 0 16px;\n }\n\n .mat-h2,\n .mat-headline-6,\n #{$selector} .mat-h2,\n #{$selector} .mat-headline-6,\n #{$selector} h2 {\n font: inspection.get-theme-typography($theme, headline-6, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-6, letter-spacing);\n margin: 0 0 16px;\n }\n\n .mat-h3,\n .mat-subtitle-1,\n #{$selector} .mat-h3,\n #{$selector} .mat-subtitle-1,\n #{$selector} h3 {\n font: inspection.get-theme-typography($theme, subtitle-1, font);\n letter-spacing: inspection.get-theme-typography($theme, subtitle-1, letter-spacing);\n margin: 0 0 16px;\n }\n\n .mat-h4,\n .mat-body-1,\n #{$selector} .mat-h4,\n #{$selector} .mat-body-1,\n #{$selector} h4 {\n font: inspection.get-theme-typography($theme, body-1, font);\n letter-spacing: inspection.get-theme-typography($theme, body-1, letter-spacing);\n margin: 0 0 16px;\n }\n\n // Note: the spec doesn't have anything that would correspond to h5 and h6, but we add these for\n // consistency. The font sizes come from the Chrome user agent styles which have h5 at 0.83em\n // and h6 at 0.67em.\n .mat-h5,\n #{$selector} .mat-h5,\n #{$selector} h5 {\n @include typography-utils.font-shorthand(\n // calc is used here to support css variables\n calc(#{inspection.get-theme-typography($theme, body-2, font-size)} * 0.83),\n inspection.get-theme-typography($theme, body-2, font-weight),\n inspection.get-theme-typography($theme, body-2, line-height),\n inspection.get-theme-typography($theme, body-2, font-family)\n );\n\n margin: 0 0 12px;\n }\n\n .mat-h6,\n #{$selector} .mat-h6,\n #{$selector} h6 {\n @include typography-utils.font-shorthand(\n // calc is used here to support css variables\n calc(#{inspection.get-theme-typography($theme, body-2, font-size)} * 0.67),\n inspection.get-theme-typography($theme, body-2, font-weight),\n inspection.get-theme-typography($theme, body-2, line-height),\n inspection.get-theme-typography($theme, body-2, font-family)\n );\n\n margin: 0 0 12px;\n }\n\n .mat-body-strong,\n .mat-subtitle-2,\n #{$selector} .mat-body-strong,\n #{$selector} .mat-subtitle-2 {\n font: inspection.get-theme-typography($theme, subtitle-2, font);\n letter-spacing: inspection.get-theme-typography($theme, subtitle-2, letter-spacing);\n }\n\n .mat-body,\n .mat-body-2,\n #{$selector} .mat-body,\n #{$selector} .mat-body-2,\n #{$selector} {\n font: inspection.get-theme-typography($theme, body-2, font);\n letter-spacing: inspection.get-theme-typography($theme, body-2, letter-spacing);\n\n p {\n margin: 0 0 12px;\n }\n }\n\n .mat-small,\n .mat-caption,\n #{$selector} .mat-small,\n #{$selector} .mat-caption {\n font: inspection.get-theme-typography($theme, caption, font);\n letter-spacing: inspection.get-theme-typography($theme, caption, letter-spacing);\n }\n\n .mat-headline-1,\n #{$selector} .mat-headline-1 {\n font: inspection.get-theme-typography($theme, headline-1, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-1, letter-spacing);\n margin: 0 0 56px;\n }\n\n .mat-headline-2,\n #{$selector} .mat-headline-2 {\n font: inspection.get-theme-typography($theme, headline-2, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-2, letter-spacing);\n margin: 0 0 64px;\n }\n\n .mat-headline-3,\n #{$selector} .mat-headline-3 {\n font: inspection.get-theme-typography($theme, headline-3, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-3, letter-spacing);\n margin: 0 0 64px;\n }\n\n .mat-headline-4,\n #{$selector} .mat-headline-4 {\n font: inspection.get-theme-typography($theme, headline-4, font);\n letter-spacing: inspection.get-theme-typography($theme, headline-4, letter-spacing);\n margin: 0 0 64px;\n }\n}\n","@use 'sass:list';\n@use 'sass:math';\n@use './property-getters';\n\n// Property getters live in their own file to avoid circular dependencies, but we re-export them\n// here so that historical imports from this file continue to work without needing to be updated.\n@forward './property-getters';\n\n/// Outputs the shorthand `font` CSS property, based on a set of typography values. Falls back to\n/// the individual properties if a value that isn't allowed in the shorthand is passed in.\n/// @param {String} $font-size The font-size value.\n/// @param {String | Number} $font-weight The font-weight value.\n/// @param {String | Number} $line-height The line-height value.\n/// @param {String} $font-family The font-family value.\n/// @returns {String} The `font` shorthand value combining the given parts.\n@mixin font-shorthand($font-size, $font-weight, $line-height, $font-family) {\n // If any of the values are set to `inherit`, we can't use the shorthand\n // so we fall back to passing in the individual properties.\n @if ($font-size == inherit or\n $font-weight == inherit or\n $line-height == inherit or\n $font-family == inherit or\n $font-size == null or\n $font-weight == null or\n $line-height == null or\n $font-family == null) {\n\n font-size: $font-size;\n font-weight: $font-weight;\n line-height: $line-height;\n font-family: $font-family;\n }\n @else {\n // Otherwise use the shorthand `font`, because it's the least amount of bytes.\n font: $font-weight list.slash($font-size, $line-height) $font-family;\n }\n}\n\n/// Emits CSS styles for the given typography level.\n/// @param {Map} $config A typography config.\n/// @param {Map} $level A typography level.\n@mixin typography-level($config, $level) {\n // we deliberately do not use the font shorthand here because it overrides\n // certain font properties that can't be configured in the current typography\n // config, e.g. the font-variant-caps or font-feature-settings property\n font-size: property-getters.font-size($config, $level);\n font-weight: property-getters.font-weight($config, $level);\n line-height: property-getters.line-height($config, $level);\n font-family: property-getters.font-family($config, $level);\n letter-spacing: property-getters.letter-spacing($config, $level);\n}\n\n/// Coerce a value to `em` if it is a unitless number, otherwise returns\n/// the value provided.\n@function private-coerce-unitless-to-em($value) {\n @return if(math.is-unitless($value), 1em * $value, $value);\n}\n","@use 'sass:color';\n@use '@material/chips/chip-theme' as mdc-chip-theme;\n@use '../core/tokens/m2/mdc/chip' as tokens-mdc-chip;\n@use '../core/tokens/m2/mat/chip' as tokens-mat-chip;\n@use '../core/tokens/token-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-chips.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n .mat-mdc-standard-chip {\n @include mdc-chip-theme.theme(tokens-mdc-chip.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected chip: primary, secondary, tertiary,\n/// or error (If not specified, default secondary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-standard-chip {\n $default-color-tokens: tokens-mdc-chip.get-color-tokens($theme);\n @include mdc-chip-theme.theme($default-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme));\n\n &.mat-mdc-chip-selected,\n &.mat-mdc-chip-highlighted {\n &.mat-primary {\n $primary-color-tokens: tokens-mdc-chip.get-color-tokens($theme, primary);\n @include mdc-chip-theme.theme($primary-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme, primary));\n }\n\n &.mat-accent {\n $accent-color-tokens: tokens-mdc-chip.get-color-tokens($theme, accent);\n @include mdc-chip-theme.theme($accent-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme, accent));\n }\n\n &.mat-warn {\n $warn-color-tokens: tokens-mdc-chip.get-color-tokens($theme, warn);\n @include mdc-chip-theme.theme($warn-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-color-tokens($theme, warn));\n }\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n $typography-tokens: tokens-mdc-chip.get-typography-tokens($theme);\n\n .mat-mdc-standard-chip {\n @include mdc-chip-theme.theme($typography-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $density-tokens: tokens-mdc-chip.get-density-tokens($theme);\n\n .mat-mdc-chip.mat-mdc-standard-chip {\n @include mdc-chip-theme.theme($density-tokens);\n @include token-utils.create-token-values(\n tokens-mat-chip.$prefix, tokens-mat-chip.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-chips.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected chip: primary, secondary, tertiary,\n/// or error (If not specified, default secondary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-chips') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-chip-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-chip.$prefix, $options...);\n $mat-chip-tokens: token-utils.get-tokens-for($tokens, tokens-mat-chip.$prefix, $options...);\n @include mdc-chip-theme.theme($mdc-chip-tokens);\n @include token-utils.create-token-values(tokens-mat-chip.$prefix, $mat-chip-tokens);\n}\n","@use '@material/switch/switch-theme' as mdc-switch-theme;\n@use '@material/form-field/form-field-theme' as mdc-form-field-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/form-field' as tokens-mdc-form-field;\n@use '../core/tokens/m2/mat/switch' as tokens-mat-switch;\n@use '../core/tokens/m2/mdc/switch' as tokens-mdc-switch;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-switch.get-unthemable-tokens();\n $mdc-tokens: tokens-mdc-switch.get-unthemable-tokens();\n @include mdc-switch-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-tokens);\n }\n }\n}\n\n/// Outputs color theme styles for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slide-toggle: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n $is-dark: inspection.get-theme-type($theme) == dark;\n $mat-tokens: tokens-mat-switch.get-color-tokens($theme);\n $mdc-tokens: tokens-mdc-switch.get-color-tokens($theme);\n\n // Add values for MDC slide toggles tokens\n @include sass-utils.current-selector-or-root() {\n @include mdc-switch-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-tokens);\n\n // TODO(wagnermaciel): Use our token system to define this css variable.\n --mdc-switch-disabled-label-text-color: #{inspection.get-theme-color(\n $theme,\n foreground,\n disabled-text\n )};\n\n .mat-mdc-slide-toggle {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-color-tokens($theme));\n\n // Change the color palette related tokens to accent or warn if applicable\n &.mat-accent {\n @include mdc-switch-theme.theme(\n tokens-mdc-switch.private-get-color-palette-color-tokens($theme, accent));\n }\n\n &.mat-warn {\n @include mdc-switch-theme.theme(\n tokens-mdc-switch.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n $mat-tokens: tokens-mat-switch.get-typography-tokens($theme);\n $mdc-tokens: tokens-mdc-switch.get-typography-tokens($theme);\n\n // Add values for MDC slide toggle tokens\n @include sass-utils.current-selector-or-root() {\n @include mdc-switch-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-tokens);\n\n .mat-mdc-slide-toggle {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-typography-tokens($theme));\n }\n }\n }\n}\n\n/// Outputs density theme styles for the mat-slide-toggle.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-switch.get-density-tokens($theme);\n $mdc-tokens: tokens-mdc-switch.get-density-tokens($theme);\n @include mdc-switch-theme.theme(tokens-mdc-switch.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slide-toggle: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-slide-toggle') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n // Don't pass $options here, since the mdc-form-field doesn't support color options,\n // only the mdc-switch does.\n $mdc-form-field-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-form-field.$prefix);\n $mat-switch-tokens: token-utils.get-tokens-for($tokens, tokens-mat-switch.$prefix);\n $mdc-switch-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-switch.$prefix, $options...);\n\n @include mdc-form-field-theme.theme($mdc-form-field-tokens);\n @include mdc-switch-theme.theme($mdc-switch-tokens);\n @include token-utils.create-token-values(tokens-mat-switch.$prefix, $mat-switch-tokens);\n}\n","@use '@material/radio/radio-theme' as mdc-radio-theme;\n@use '@material/form-field/form-field-theme' as mdc-form-field-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/form-field' as tokens-mdc-form-field;\n@use '../core/tokens/m2/mdc/radio' as tokens-mdc-radio;\n@use '../core/tokens/m2/mat/radio' as tokens-mat-radio;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-radio.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-radio.$prefix, tokens-mat-radio.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the radio button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-radio-button {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-color-tokens($theme));\n\n &.mat-primary {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, primary));\n @include token-utils.create-token-values(tokens-mat-radio.$prefix,\n tokens-mat-radio.get-color-tokens($theme, primary));\n }\n\n &.mat-accent {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-radio.$prefix,\n tokens-mat-radio.get-color-tokens($theme));\n }\n\n &.mat-warn {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, warn));\n @include token-utils.create-token-values(tokens-mat-radio.$prefix,\n tokens-mat-radio.get-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-typography-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-radio.$prefix, tokens-mat-radio.get-typography-tokens($theme));\n }\n\n .mat-mdc-radio-button {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $density-scale: inspection.get-theme-density($theme);\n\n @include sass-utils.current-selector-or-root() {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-density-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-radio.$prefix, tokens-mat-radio.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-radio.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the radio button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-radio') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-radio-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-radio.$prefix, $options...);\n $mat-radio-tokens: token-utils.get-tokens-for($tokens, tokens-mat-radio.$prefix, $options...);\n // Don't pass $options here, since the mdc-form-field doesn't support color options,\n // only the mdc-radio and mat-radio do.\n $mdc-form-field-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-form-field.$prefix);\n @include mdc-radio-theme.theme($mdc-radio-tokens);\n @include mdc-form-field-theme.theme($mdc-form-field-tokens);\n @include token-utils.create-token-values(tokens-mat-radio.$prefix, $mat-radio-tokens);\n}\n","@use 'sass:map';\n@use '@material/list/evolution-mixins';\n@use '@material/checkbox/checkbox-theme' as mdc-checkbox-theme;\n@use '@material/radio/radio-theme' as mdc-radio-theme;\n@use '@material/list/list-theme' as mdc-list-theme;\n\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/m2/mat/list' as tokens-mat-list;\n@use '../core/tokens/m2/mdc/checkbox' as tokens-mdc-checkbox;\n@use '../core/tokens/m2/mdc/radio' as tokens-mdc-radio;\n@use '../core/tokens/m2/mdc/list' as tokens-mdc-list;\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n\n@mixin base($theme) {\n // Add default values for tokens not related to color, typography, or density.\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme(tokens-mdc-list.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-unthemable-tokens());\n }\n }\n}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n $mdc-list-color-tokens: tokens-mdc-list.get-color-tokens($theme);\n\n // Add values for MDC list tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme($mdc-list-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-color-tokens($theme));\n }\n\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, primary));\n }\n\n .mat-accent {\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, accent));\n }\n }\n\n .mat-warn {\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-color-tokens($theme, warn));\n }\n }\n\n .mat-mdc-list-option {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, primary));\n }\n .mat-mdc-list-option.mat-accent {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, accent));\n }\n .mat-mdc-list-option.mat-warn {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, warn));\n }\n\n // There is no token for activated color on nav list.\n // TODO(mmalerba): Add a token to MDC or make a custom one.\n .mat-mdc-list-base.mat-mdc-list-base {\n @include evolution-mixins.list-selected-ink-color(\n inspection.get-theme-color($theme, primary));\n }\n\n // TODO(mmalerba): Leaking styles from the old MDC list mixins used in other components can\n // cause opacity issues, so we need this override for now. We can remove it when all\n // Angular Material components stop using the old MDC mixins.\n .mat-mdc-list-base .mdc-list-item--disabled {\n .mdc-list-item__start,\n .mdc-list-item__content,\n .mdc-list-item__end {\n opacity: 1;\n }\n }\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $density-scale: inspection.get-theme-density($theme);\n $mdc-list-density-tokens: tokens-mdc-list.get-density-tokens($theme);\n\n // Add values for MDC list tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme($mdc-list-density-tokens);\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-density-tokens($theme));\n }\n\n .mdc-list-item__start,\n .mdc-list-item__end {\n @include mdc-radio-theme.theme(tokens-mdc-radio.get-density-tokens($theme));\n }\n\n // TODO(mmalerba): This is added to maintain the same style MDC used prior to the token-based\n // API, to avoid screenshot diffs. We should remove it in favor of following MDC's current\n // style, or add custom tokens for it.\n .mat-mdc-list-item {\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-icon {\n &.mdc-list-item--with-one-line {\n height: map.get((\n 0: 56px,\n -1: 52px,\n -2: 48px,\n -3: 44px,\n -4: 40px,\n -5: 40px,\n ), $density-scale);\n }\n\n &.mdc-list-item--with-two-lines {\n height: map.get((\n 0: 72px,\n -1: 68px,\n -2: 64px,\n -3: 60px,\n -4: 56px,\n -5: 56px,\n ), $density-scale);\n }\n }\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n $mdc-list-typography-tokens: tokens-mdc-list.get-typography-tokens($theme);\n\n // Add values for MDC list tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-list-theme.theme($mdc-list-typography-tokens);\n @include token-utils.create-token-values(\n tokens-mat-list.$prefix, tokens-mat-list.get-typography-tokens($theme));\n }\n\n // MDC does not have tokens for the subheader.\n // TODO(mmalerba): Discuss with MDC about adding them, or create custom tokens.\n .mdc-list-group__subheader {\n font: inspection.get-theme-typography($theme, subtitle-1, font);\n letter-spacing: inspection.get-theme-typography($theme, subtitle-1, letter-spacing);\n }\n }\n}\n\n@mixin theme($theme) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-list') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme));\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @include mdc-list-theme.theme(token-utils.get-tokens-for($tokens, tokens-mdc-list.$prefix));\n\n $mat-list-tokens: token-utils.get-tokens-for($tokens, tokens-mat-list.$prefix);\n @include token-utils.create-token-values(tokens-mat-list.$prefix, $mat-list-tokens);\n}\n","@use '@material/tab-indicator/tab-indicator-theme' as mdc-tab-indicator-theme;\n@use '@material/tab/tab-theme' as mdc-tab-theme;\n@use '../core/style/sass-utils';\n@use '../core/tokens/m2/mdc/tab' as tokens-mdc-tab;\n@use '../core/tokens/m2/mdc/tab-indicator' as tokens-mdc-tab-indicator;\n@use '../core/tokens/m2/mat/tab-header' as tokens-mat-tab-header;\n@use '../core/tokens/m2/mat/tab-header-with-background' as tokens-mat-tab-header-with-background;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/tokens/token-utils';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-tab.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-tab-indicator-theme.theme(tokens-mdc-tab-indicator.get-unthemable-tokens());\n @include mdc-tab-theme.secondary-navigation-tab-theme(tokens-mdc-tab.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-tab-header.$prefix, tokens-mat-tab-header.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-unthemable-tokens()\n );\n }\n }\n}\n\n/// Outputs color theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the tab indicator: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-tab-group, .mat-mdc-tab-nav-bar {\n @include _palette-styles($theme, primary);\n\n &.mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-styles($theme, warn);\n }\n\n &.mat-background-primary {\n @include _background-styles($theme, primary);\n }\n\n &.mat-background-accent {\n @include _background-styles($theme, accent);\n }\n\n &.mat-background-warn {\n @include _background-styles($theme, warn);\n }\n }\n }\n}\n\n@mixin _background-styles($theme, $palette-name) {\n @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-color-tokens($theme, $palette-name));\n}\n\n@mixin _palette-styles($theme, $palette-name) {\n @include mdc-tab-theme.secondary-navigation-tab-theme(\n tokens-mdc-tab.get-color-tokens($theme, $palette-name));\n @include mdc-tab-indicator-theme.theme(\n tokens-mdc-tab-indicator.get-color-tokens($theme, $palette-name));\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,\n tokens-mat-tab-header.get-color-tokens($theme, $palette-name));\n}\n\n/// Outputs typography theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n .mat-mdc-tab-header {\n @include mdc-tab-theme.secondary-navigation-tab-theme(\n tokens-mdc-tab.get-typography-tokens($theme));\n @include mdc-tab-indicator-theme.theme(\n tokens-mdc-tab-indicator.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,\n tokens-mat-tab-header.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n .mat-mdc-tab-header {\n @include mdc-tab-theme.secondary-navigation-tab-theme(\n tokens-mdc-tab.get-density-tokens($theme));\n @include mdc-tab-indicator-theme.theme(\n tokens-mdc-tab-indicator.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix,\n tokens-mat-tab-header.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-tab-header-with-background.$prefix,\n tokens-mat-tab-header-with-background.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-tab.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the tab indicator: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-tabs') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-tab-indicator-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mdc-tab-indicator.$prefix, $options...);\n $mat-tab-header-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mat-tab-header.$prefix, $options...);\n // Don't pass $options here, because the mdc-tab doesn't have color variants,\n // only the mdc-tab-indicator and mat-tab-header do.\n $mdc-tab-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-tab.$prefix);\n @include mdc-tab-theme.secondary-navigation-tab-theme($mdc-tab-tokens);\n @include mdc-tab-indicator-theme.theme($mdc-tab-indicator-tokens);\n @include token-utils.create-token-values(tokens-mat-tab-header.$prefix, $mat-tab-header-tokens);\n}\n","@use '@material/checkbox/checkbox-theme' as mdc-checkbox-theme;\n@use '@material/form-field/form-field-theme' as mdc-form-field-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/checkbox' as tokens-mdc-checkbox;\n@use '../core/tokens/m2/mdc/form-field' as tokens-mdc-form-field;\n@use '../core/tokens/m2/mat/checkbox' as tokens-mat-checkbox;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-checkbox.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the checkbox: primary, secondary, tertiary, or\n/// error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-color-tokens($theme));\n }\n\n .mat-mdc-checkbox {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-color-tokens($theme));\n\n &.mat-primary {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, primary));\n }\n\n &.mat-warn {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-typography-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-typography-tokens($theme));\n }\n\n .mat-mdc-checkbox {\n @include mdc-form-field-theme.theme(tokens-mdc-form-field.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n $density-scale: inspection.get-theme-density($theme);\n\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-checkbox-theme.theme(tokens-mdc-checkbox.get-density-tokens($theme));\n @include token-utils.create-token-values(\n tokens-mat-checkbox.$prefix, tokens-mat-checkbox.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the checkbox: primary, secondary, tertiary, or\n/// error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-checkbox') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-checkbox-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mdc-checkbox.$prefix, $options...);\n // Don't pass $options here, since the mdc-form-field doesn't support color options,\n // only the mdc-checkbox does.\n $mdc-form-field-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-form-field.$prefix);\n $mat-checkbox-tokens: token-utils.get-tokens-for($tokens, tokens-mat-checkbox.$prefix);\n @include mdc-checkbox-theme.theme($mdc-checkbox-tokens);\n @include mdc-form-field-theme.theme($mdc-form-field-tokens);\n @include token-utils.create-token-values(tokens-mat-checkbox.$prefix, $mat-checkbox-tokens);\n}\n","@use '@angular/cdk';\n@use '../tokens/m2/mat/ripple' as tokens-mat-ripple;\n@use '../tokens/token-utils';\n\n@mixin ripple() {\n // The host element of an mat-ripple directive should always have a position of \"absolute\" or\n // \"relative\" so that the ripples inside are correctly positioned relatively to the container.\n .mat-ripple {\n overflow: hidden;\n\n // By default, every ripple container should have position: relative in favor of creating an\n // easy API for developers using the MatRipple directive.\n position: relative;\n\n // Promote containers that have ripples to a new layer. We want to target `:not(:empty)`,\n // because we don't want all ripple containers to have their own layer since they're used in a\n // lot of places and the layer is only relevant while animating. Note that ideally we'd use\n // the `contain` property here (see #13175), because `:empty` can be broken by having extra\n // text inside the element, but it isn't very well supported yet.\n &:not(:empty) {\n transform: translateZ(0);\n }\n }\n\n .mat-ripple.mat-ripple-unbounded {\n overflow: visible;\n }\n\n .mat-ripple-element {\n position: absolute;\n border-radius: 50%;\n pointer-events: none;\n\n transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);\n\n // We use a 3d transform here in order to avoid an issue in Safari where\n // the ripples aren't clipped when inside the shadow DOM (see #24028).\n transform: scale3d(0, 0, 0);\n\n @include token-utils.use-tokens(\n tokens-mat-ripple.$prefix, tokens-mat-ripple.get-token-slots()) {\n // We have to emit a fallback value here, because some internal builds depend on it.\n background-color: var(#{token-utils.get-token-variable(color)}, rgba(#000, 0.1));\n }\n\n // In high contrast mode the ripple is opaque, causing it to obstruct the content.\n @include cdk.high-contrast(active, off) {\n display: none;\n }\n }\n}\n","/// Emits a CSS class, `.cdk-visually-hidden`. This class can be applied to an element\n/// to make that element visually hidden while remaining available to assistive technology.\n@mixin a11y-visually-hidden() {\n .cdk-visually-hidden {\n border: 0;\n clip: rect(0 0 0 0);\n height: 1px;\n margin: -1px;\n overflow: hidden;\n padding: 0;\n position: absolute;\n width: 1px;\n\n // This works around a Chrome bug that can cause the tab to crash when large amounts of\n // non-English text get wrapped: https://bugs.chromium.org/p/chromium/issues/detail?id=1201444\n white-space: nowrap;\n\n // Avoid browsers rendering the focus ring in some cases.\n outline: 0;\n\n // Avoid some cases where the browser will still render the native controls (see #9049).\n -webkit-appearance: none;\n -moz-appearance: none;\n\n // We need at least one of top/bottom/left/right in order to prevent cases where the\n // absolute-positioned element is pushed down and can affect scrolling (see #24597).\n // `left` was chosen here, because it's the least likely to break overrides where the\n // element might have been positioned (e.g. `mat-checkbox`).\n left: 0;\n\n [dir='rtl'] & {\n left: auto;\n right: 0;\n }\n }\n}\n\n/// @deprecated Use `a11y-visually-hidden`.\n@mixin a11y() {\n @include a11y-visually-hidden;\n}\n\n/// Emits the mixin's content nested under `$selector-context` if `$selector-context`\n/// is non-empty.\n/// @param {String} selector-context The selector under which to nest the mixin's content.\n@mixin _optionally-nest-content($selector-context) {\n @if ($selector-context == '') {\n @content;\n }\n @else {\n #{$selector-context} {\n @content;\n }\n }\n}\n\n/// Applies styles for users in high contrast mode. Note that this only applies\n/// to Microsoft browsers. Chrome can be included by checking for the `html[hc]`\n/// attribute, however Chrome handles high contrast differently.\n///\n/// @param {String} target Type of high contrast setting to target. Defaults to `active`, can be\n/// `white-on-black` or `black-on-white`.\n/// @param {String} encapsulation Whether to emit styles for view encapsulation. Values are:\n/// * `on` - works for `Emulated`, `Native`, and `ShadowDom`\n/// * `off` - works for `None`\n/// * `any` - works for all encapsulation modes by emitting the CSS twice (default).\n@mixin high-contrast($target: active, $encapsulation: 'any') {\n @if ($target != 'active' and $target != 'black-on-white' and $target != 'white-on-black') {\n @error 'Unknown cdk-high-contrast value \"#{$target}\" provided. ' +\n 'Allowed values are \"active\", \"black-on-white\", and \"white-on-black\"';\n }\n\n @if ($encapsulation != 'on' and $encapsulation != 'off' and $encapsulation != 'any') {\n @error 'Unknown cdk-high-contrast encapsulation \"#{$encapsulation}\" provided. ' +\n 'Allowed values are \"on\", \"off\", and \"any\"';\n }\n\n // If the selector context has multiple parts, such as `.section, .region`, just doing\n // `.cdk-high-contrast-xxx #{&}` will only apply the parent selector to the first part of the\n // context. We address this by nesting the selector context under .cdk-high-contrast.\n @at-root {\n $selector-context: #{&};\n\n @if ($encapsulation != 'on') {\n // Note that if this selector is updated, the same change has to be made inside\n // `_overlay.scss` which can't depend on this mixin due to some infrastructure limitations.\n .cdk-high-contrast-#{$target} {\n @include _optionally-nest-content($selector-context) {\n @content;\n }\n }\n }\n\n @if ($encapsulation != 'off') {\n .cdk-high-contrast-#{$target} :host {\n @include _optionally-nest-content($selector-context) {\n @content;\n }\n }\n }\n }\n}\n","// We want overlays to always appear over user content, so set a baseline\n// very high z-index for the overlay container, which is where we create the new\n// stacking context for all overlays.\n$overlay-container-z-index: 1000 !default;\n$overlay-z-index: 1000 !default;\n$overlay-backdrop-z-index: 1000 !default;\n\n// Background color for all of the backdrops\n$overlay-backdrop-color: rgba(0, 0, 0, 0.32) !default;\n\n// Default backdrop animation is based on the Material Design swift-ease-out.\n$backdrop-animation-duration: 400ms !default;\n$backdrop-animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\n\n/// Emits structural styles required for cdk/overlay to function.\n@mixin overlay() {\n .cdk-overlay-container, .cdk-global-overlay-wrapper {\n // Disable events from being captured on the overlay container.\n pointer-events: none;\n\n // The container should be the size of the viewport.\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n }\n\n // The overlay-container is an invisible element which contains all individual overlays.\n .cdk-overlay-container {\n position: fixed;\n z-index: $overlay-container-z-index;\n\n &:empty {\n // Hide the element when it doesn't have any child nodes. This doesn't\n // include overlays that have been detached, rather than disposed.\n display: none;\n }\n }\n\n // We use an extra wrapper element in order to use make the overlay itself a flex item.\n // This makes centering the overlay easy without running into the subpixel rendering\n // problems tied to using `transform` and without interfering with the other position\n // strategies.\n .cdk-global-overlay-wrapper {\n display: flex;\n position: absolute;\n z-index: $overlay-z-index;\n }\n\n // A single overlay pane.\n .cdk-overlay-pane {\n // Note: it's important for this one to start off `absolute`,\n // in order for us to be able to measure it correctly.\n position: absolute;\n pointer-events: auto;\n box-sizing: border-box;\n z-index: $overlay-z-index;\n\n // For connected-position overlays, we set `display: flex` in\n // order to force `max-width` and `max-height` to take effect.\n display: flex;\n max-width: 100%;\n max-height: 100%;\n }\n\n .cdk-overlay-backdrop {\n // TODO(jelbourn): reuse sidenav fullscreen mixin.\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n\n z-index: $overlay-backdrop-z-index;\n pointer-events: auto;\n -webkit-tap-highlight-color: transparent;\n transition: opacity $backdrop-animation-duration $backdrop-animation-timing-function;\n opacity: 0;\n\n &.cdk-overlay-backdrop-showing {\n opacity: 1;\n\n // Note that we can't import and use the `high-contrast` mixin from `_a11y.scss`, because\n // this file will be copied to the top-level `cdk` package when putting together the files\n // for npm. Any relative import paths we use here will become invalid once the file is copied.\n .cdk-high-contrast-active & {\n // In high contrast mode the rgba background will become solid\n // so we need to fall back to making it opaque using `opacity`.\n opacity: 0.6;\n }\n }\n }\n\n .cdk-overlay-dark-backdrop {\n background: $overlay-backdrop-color;\n }\n\n .cdk-overlay-transparent-backdrop {\n // Define a transition on the visibility so that the `transitionend` event can fire immediately.\n transition: visibility 1ms linear, opacity 1ms linear;\n visibility: hidden;\n opacity: 1;\n\n // Note: as of Firefox 57, having the backdrop be `background: none` will prevent it from\n // capturing the user's mouse scroll events. Since we also can't use something like\n // `rgba(0, 0, 0, 0)`, we work around the inconsistency by not setting the background at\n // all and using `opacity` to make the element transparent.\n &.cdk-overlay-backdrop-showing {\n opacity: 0;\n visibility: visible;\n }\n }\n\n .cdk-overlay-backdrop-noop-animation {\n transition: none;\n }\n\n // Overlay parent element used with the connected position strategy. Used to constrain the\n // overlay element's size to fit within the viewport.\n .cdk-overlay-connected-position-bounding-box {\n position: absolute;\n z-index: $overlay-z-index;\n\n // We use `display: flex` on this element exclusively for centering connected overlays.\n // When *not* centering, a top/left/bottom/right will be set which overrides the normal\n // flex layout.\n display: flex;\n\n // We use the `column` direction here to avoid some flexbox issues in Edge\n // when using the \"grow after open\" options.\n flex-direction: column;\n\n // Add some dimensions so the element has an `innerText` which some people depend on in tests.\n min-width: 1px;\n min-height: 1px;\n }\n\n // Used when disabling global scrolling.\n .cdk-global-scrollblock {\n position: fixed;\n\n // Necessary for the content not to lose its width. Note that we're using 100%, instead of\n // 100vw, because 100vw includes the width plus the scrollbar, whereas 100% is the width\n // that the element had before we made it `fixed`.\n width: 100%;\n\n // Note: this will always add a scrollbar to whatever element it is on, which can\n // potentially result in double scrollbars. It shouldn't be an issue, because we won't\n // block scrolling on a page that doesn't have a scrollbar in the first place.\n overflow-y: scroll;\n }\n}\n","// Structural styles for the autosize text fields.\n@mixin text-field-autosize() {\n // Remove the resize handle on autosizing textareas, because whatever height\n // the user resized to will be overwritten once they start typing again.\n textarea.cdk-textarea-autosize {\n resize: none;\n }\n\n // This class is temporarily applied to the textarea when it is being measured. It is immediately\n // removed when measuring is complete. We use `!important` rules here to make sure user-specified\n // rules do not interfere with the measurement.\n textarea.cdk-textarea-autosize-measuring {\n @include _autosize-measuring-base;\n height: auto !important;\n overflow: hidden !important;\n }\n\n // Similar to the `cdk-textarea-autosize-measuring` class, but only applied on Firefox. We need\n // to use this class, because Firefox has a bug where changing the `overflow` breaks the user's\n // ability to undo/redo what they were typing (see #16629). This class is only scoped to Firefox,\n // because the measurements there don't seem to be affected by the `height: 0`, whereas on other\n // browsers they are, e.g. Chrome detects longer text and IE does't resize back to normal.\n // Identical issue report: https://bugzilla.mozilla.org/show_bug.cgi?id=448784\n textarea.cdk-textarea-autosize-measuring-firefox {\n @include _autosize-measuring-base;\n height: 0 !important;\n }\n}\n\n// Core styles that enable monitoring autofill state of text fields.\n@mixin text-field-autofill() {\n // Keyframes that apply no styles, but allow us to monitor when an text field becomes autofilled\n // by watching for the animation events that are fired when they start. Note: the /*!*/ comment is\n // needed to prevent LibSass from stripping the keyframes out.\n // Based on: https://medium.com/@brunn/detecting-autofilled-fields-in-javascript-aed598d25da7\n @keyframes cdk-text-field-autofill-start {/*!*/}\n @keyframes cdk-text-field-autofill-end {/*!*/}\n\n .cdk-text-field-autofill-monitored:-webkit-autofill {\n // Since Chrome 80 we need a 1ms delay, or the animationstart event won't fire.\n animation: cdk-text-field-autofill-start 0s 1ms;\n }\n\n .cdk-text-field-autofill-monitored:not(:-webkit-autofill) {\n // Since Chrome 80 we need a 1ms delay, or the animationstart event won't fire.\n animation: cdk-text-field-autofill-end 0s 1ms;\n }\n}\n\n@mixin _autosize-measuring-base {\n // Having 2px top and bottom padding seems to fix a bug where Chrome gets an incorrect\n // measurement. We just have to account for it later and subtract it off the final result.\n padding: 2px 0 !important;\n box-sizing: content-box !important;\n}\n\n// Used to generate UIDs for keyframes used to change the text field autofill styles.\n$autofill-color-frame-count: 0;\n\n// Mixin used to apply custom background and foreground colors to an autofilled text field.\n// Based on: https://stackoverflow.com/questions/2781549/\n// removing-input-background-colour-for-chrome-autocomplete#answer-37432260\n@mixin text-field-autofill-color($background, $foreground:'') {\n @keyframes cdk-text-field-autofill-color-#{$autofill-color-frame-count} {\n to {\n background: $background;\n @if $foreground != '' { color: $foreground; }\n }\n }\n\n &:-webkit-autofill {\n animation: cdk-text-field-autofill-color-#{$autofill-color-frame-count} both;\n }\n\n &.cdk-text-field-autofill-monitored:-webkit-autofill {\n // Since Chrome 80 we need a 1ms delay for cdk-text-field-autofill-start, or the animationstart\n // event won't fire.\n animation: cdk-text-field-autofill-start 0s 1ms,\n cdk-text-field-autofill-color-#{$autofill-color-frame-count} both;\n }\n\n $autofill-color-frame-count: $autofill-color-frame-count + 1 !global;\n}\n\n// @deprecated Use `autosize` and `autofill` instead.\n@mixin text-field {\n @include text-field-autosize();\n @include text-field-autofill();\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use '@angular/cdk';\n@use '../style/layout-common';\n@use '../theming/theming';\n@use '../theming/inspection';\n\n// Private sass variables that will be used as reference throughout component stylesheets.\n$default-border-width: 3px;\n$default-border-style: solid;\n$default-border-color: transparent;\n$default-border-radius: 4px;\n\n// Mixin that renders the focus indicator structural styles.\n@mixin structural-styling($prefix) {\n .#{$prefix}-focus-indicator {\n position: relative;\n\n &::before {\n @include layout-common.fill();\n box-sizing: border-box;\n pointer-events: none;\n display: var(--#{$prefix}-focus-indicator-display, none); // Hide the indicator by default.\n border: var(\n --#{$prefix}-focus-indicator-border-width,\n #{$default-border-width}\n )\n var(\n --#{$prefix}-focus-indicator-border-style,\n #{$default-border-style}\n )\n var(\n --#{$prefix}-focus-indicator-border-color,\n #{$default-border-color}\n );\n border-radius: var(\n --#{$prefix}-focus-indicator-border-radius,\n #{$default-border-radius}\n );\n }\n\n // By default, render the focus indicator when the focus indicator host element takes focus.\n // Defining a pseudo element's content will cause it to render.\n &:focus::before {\n content: '';\n }\n }\n\n // Enable the indicator in high contrast mode.\n @include cdk.high-contrast(active, off) {\n @include customize-focus-indicators((display: block), $prefix);\n }\n}\n\n// Generates CSS variable declarations from a map.\n@mixin _output-variables($map) {\n @each $key, $value in $map {\n @if ($value) {\n --#{$key}: #{$value};\n }\n }\n}\n\n// Mixin that dedups CSS variables for the strong-focus-indicators mixin.\n@mixin customize-focus-indicators($config, $prefix) {\n $border-style: map.get($config, border-style);\n $border-width: map.get($config, border-width);\n $border-radius: map.get($config, border-radius);\n $border-color: map.get($config, border-color);\n $display: map.get($config, display);\n $map: (\n '#{$prefix}-focus-indicator-border-style': $border-style,\n '#{$prefix}-focus-indicator-border-width': $border-width,\n '#{$prefix}-focus-indicator-border-radius': $border-radius,\n '#{$prefix}-focus-indicator-border-color': $border-color,\n '#{$prefix}-focus-indicator-display': $display,\n );\n\n @if (&) {\n @include _output-variables($map);\n }\n @else {\n // We use `html` here instead of `:root`, because the\n // latter causes some issues with internal tooling.\n html {\n @include _output-variables($map);\n }\n }\n}\n\n@mixin strong-focus-indicators($config: ()) {\n // Default focus indicator config.\n $default-config: (\n border-color: black,\n display: block,\n );\n\n // Merge default config with user config.\n $config: map.merge($default-config, $config);\n\n @include customize-focus-indicators($config, 'mat');\n}\n\n@mixin mdc-strong-focus-indicators($config: ()) {\n // Default focus indicator config.\n $default-config: (\n border-color: black,\n display: block,\n );\n\n // Merge default config with user config.\n $config: map.merge($default-config, $config);\n\n @include customize-focus-indicators($config, 'mat-mdc');\n}\n\n@mixin strong-focus-indicators-color($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat');\n }\n @else {\n $border-color: inspection.get-theme-color($theme-or-color, primary);\n @include customize-focus-indicators((\n border-color: $border-color\n ), 'mat');\n }\n}\n\n@mixin strong-focus-indicators-theme($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat');\n }\n @else {\n @include theming.private-check-duplicate-theme-styles($theme-or-color, 'mat-focus-indicators') {\n @if inspection.theme-has($theme-or-color, color) {\n @include strong-focus-indicators-color($theme-or-color);\n }\n }\n }\n}\n\n@mixin mdc-strong-focus-indicators-color($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat-mdc');\n }\n @else {\n $border-color: inspection.get-theme-color($theme-or-color, primary);\n @include customize-focus-indicators((\n border-color: $border-color\n ), 'mat-mdc');\n }\n}\n\n@mixin mdc-strong-focus-indicators-theme($theme-or-color) {\n @if meta.type-of($theme-or-color) == 'color' {\n @include customize-focus-indicators((\n border-color: $theme-or-color\n ), 'mat-mdc');\n }\n @else {\n @include theming.private-check-duplicate-theme-styles(\n $theme-or-color, 'mat-mdc-focus-indicators') {\n @if inspection.theme-has($theme-or-color, color) {\n @include mdc-strong-focus-indicators-color($theme-or-color);\n }\n }\n }\n}\n","// This mixin ensures an element spans to fill the nearest ancestor with defined positioning.\n@mixin fill {\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n position: absolute;\n}\n","@use '@angular/cdk';\n@use './tokens/m2/mat/app' as tokens-mat-app;\n@use './tokens/token-utils';\n@use './ripple/ripple';\n@use './focus-indicators/private';\n@use './mdc-helpers/mdc-helpers';\n\n// Mixin that renders all of the core styles that are not theme-dependent.\n@mixin core() {\n @include ripple.ripple();\n @include cdk.a11y-visually-hidden();\n @include cdk.overlay();\n @include cdk.text-field-autosize();\n @include cdk.text-field-autofill();\n @include private.structural-styling('mat');\n @include private.structural-styling('mat-mdc');\n\n // Wrapper element that provides the theme background when the\n // user's content isn't inside of a `mat-sidenav-container`.\n @at-root {\n .mat-app-background {\n @include mdc-helpers.disable-mdc-fallback-declarations {\n @include token-utils.use-tokens(tokens-mat-app.$prefix, tokens-mat-app.get-token-slots()) {\n // Note: we need to emit fallback values here to avoid errors in internal builds.\n @include token-utils.create-token-slot(background-color, background-color, transparent);\n @include token-utils.create-token-slot(color, text-color, inherit);\n }\n }\n }\n }\n}\n","@use '../tokens/m2/mat/option' as tokens-mat-option;\n@use '../tokens/token-utils';\n@use '../style/sass-utils';\n@use '../theming/theming';\n@use '../theming/inspection';\n@use '../theming/validation';\n@use '../typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-option.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {}\n}\n\n/// Outputs color theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected option: primary, secondary,\n/// tertiary, or error (If not specified, default secondary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-color-tokens($theme));\n }\n\n .mat-accent {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-color-tokens($theme, accent));\n }\n\n .mat-warn {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-color-tokens($theme, warn));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-option.$prefix,\n tokens-mat-option.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {}\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the selected option: primary, secondary,\n/// tertiary, or error (If not specified, default secondary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-option') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-option-tokens: token-utils.get-tokens-for($tokens, tokens-mat-option.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-option.$prefix, $mat-option-tokens);\n}\n","@use '../../theming/theming';\n@use '../../theming/inspection';\n@use '../../theming/validation';\n@use '../../style/sass-utils';\n@use '../../tokens/token-utils';\n@use '../../tokens/m2/mat/full-pseudo-checkbox' as tokens-mat-full-pseudo-checkbox;\n@use '../../tokens/m2/mat/minimal-pseudo-checkbox' as tokens-mat-minimal-pseudo-checkbox;\n\n@mixin _palette-styles($theme, $palette-name) {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-full-pseudo-checkbox.$prefix,\n tokens-mat-full-pseudo-checkbox.get-color-tokens($theme, $palette-name));\n @include token-utils.create-token-values(tokens-mat-minimal-pseudo-checkbox.$prefix,\n tokens-mat-minimal-pseudo-checkbox.get-color-tokens($theme, $palette-name));\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-full-pseudo-checkbox-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-full-pseudo-checkbox.$prefix, $options...);\n $mat-minimal-pseudo-checkbox-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-minimal-pseudo-checkbox.$prefix, $options...);\n @include token-utils.create-token-values(\n tokens-mat-full-pseudo-checkbox.$prefix, $mat-full-pseudo-checkbox-tokens);\n @include token-utils.create-token-values(\n tokens-mat-minimal-pseudo-checkbox.$prefix, $mat-minimal-pseudo-checkbox-tokens);\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {}\n\n/// Outputs color theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the pseudo-checkbox: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-primary {\n @include _palette-styles($theme, primary);\n }\n\n // Default to the accent color. Note that the pseudo checkboxes are meant to inherit the\n // theme from their parent, rather than implementing their own theming, which is why we\n // don't attach to the `mat-*` classes. Also note that this needs to be below `.mat-primary`\n // in order to allow for the color to be overwritten if the checkbox is inside a parent that\n // has `mat-accent` and is placed inside another parent that has `mat-primary`.\n @include _palette-styles($theme, accent);\n .mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n .mat-warn {\n @include _palette-styles($theme, warn);\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n}\n\n/// Outputs density theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-pseudo-checkbox.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the pseudo-checkbox: primary, secondary,\n/// tertiary, or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-pseudo-checkbox') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n","@use './theming/theming';\n@use './theming/inspection';\n@use './theming/validation';\n@use './style/private';\n@use './ripple/ripple-theme';\n@use './option/option-theme';\n@use './option/optgroup-theme';\n@use './selection/pseudo-checkbox/pseudo-checkbox-theme';\n@use './style/elevation';\n@use './style/sass-utils';\n@use './typography/typography';\n@use './tokens/token-utils';\n@use './tokens/m2/mat/app' as tokens-mat-app;\n@use './tokens/m2/mat/ripple' as tokens-mat-ripple;\n@use './tokens/m2/mat/option' as tokens-mat-option;\n@use './tokens/m2/mat/full-pseudo-checkbox' as tokens-mat-full-pseudo-checkbox;\n@use './tokens/m2/mat/minimal-pseudo-checkbox' as tokens-mat-minimal-pseudo-checkbox;\n\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include ripple-theme.base($theme);\n @include option-theme.base($theme);\n @include optgroup-theme.base($theme);\n @include pseudo-checkbox-theme.base($theme);\n }\n}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n @include ripple-theme.color($theme);\n @include option-theme.color($theme);\n @include optgroup-theme.color($theme);\n @include pseudo-checkbox-theme.color($theme);\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-app.$prefix,\n tokens-mat-app.get-color-tokens($theme));\n }\n\n // Provides external CSS classes for each elevation value. Each CSS class is formatted as\n // `mat-elevation-z$zValue` where `$zValue` corresponds to the z-space to which the element is\n // elevated.\n @for $zValue from 0 through 24 {\n $selector: elevation.$prefix + $zValue;\n // We need the `mat-mdc-elevation-specific`, because some MDC mixins\n // come with elevation baked in and we don't have a way of removing it.\n .#{$selector}, .mat-mdc-elevation-specific.#{$selector} {\n @include private.private-theme-elevation($zValue, $theme);\n }\n }\n }\n\n // TODO(crisbeto): move this into the base.\n // Marker that is used to determine whether the user has added a theme to their page.\n @at-root {\n .mat-theme-loaded-marker {\n display: none;\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include option-theme.typography($theme);\n @include optgroup-theme.typography($theme);\n @include pseudo-checkbox-theme.typography($theme);\n @include ripple-theme.typography($theme);\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include option-theme.density($theme);\n @include optgroup-theme.density($theme);\n @include pseudo-checkbox-theme.density($theme);\n @include ripple-theme.density($theme);\n }\n}\n\n// Mixin that renders all of the core styles that depend on the theme.\n@mixin theme($theme, $options...) {\n // Wrap the sub-theme includes in the duplicate theme styles mixin. This ensures that\n // there won't be multiple warnings. e.g. if `mat-core-theme` reports a warning, then\n // the imported themes (such as `mat-ripple-theme`) should not report again.\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-core') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-app-tokens: token-utils.get-tokens-for($tokens, tokens-mat-app.$prefix, $options...);\n $mat-ripple-tokens: token-utils.get-tokens-for($tokens, tokens-mat-ripple.$prefix, $options...);\n $mat-option-tokens: token-utils.get-tokens-for($tokens, tokens-mat-option.$prefix, $options...);\n $mat-full-pseudo-checkbox-tokens: token-utils.get-tokens-for($tokens,\n tokens-mat-full-pseudo-checkbox.$prefix, $options...);\n $mat-minimal-pseudo-checkbox-tokens: token-utils.get-tokens-for($tokens,\n tokens-mat-minimal-pseudo-checkbox.$prefix, $options...);\n\n @include token-utils.create-token-values(tokens-mat-app.$prefix, $mat-app-tokens);\n @include token-utils.create-token-values(tokens-mat-ripple.$prefix, $mat-ripple-tokens);\n @include token-utils.create-token-values(tokens-mat-option.$prefix, $mat-option-tokens);\n @include token-utils.create-token-values(tokens-mat-full-pseudo-checkbox.$prefix,\n $mat-full-pseudo-checkbox-tokens);\n @include token-utils.create-token-values(tokens-mat-minimal-pseudo-checkbox.$prefix,\n $mat-minimal-pseudo-checkbox-tokens);\n}\n","@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mdc/linear-progress' as tokens-mdc-linear-progress;\n@use '@material/linear-progress/linear-progress-theme' as mdc-linear-progress-theme;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-linear-progress-theme.theme(tokens-mdc-linear-progress.get-unthemable-tokens());\n }\n }\n}\n\n@mixin _palette-styles($theme, $palette-name) {\n @include mdc-linear-progress-theme.theme(\n tokens-mdc-linear-progress.get-color-tokens($theme, $palette-name));\n}\n\n/// Outputs color theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the progress bar: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n .mat-mdc-progress-bar {\n @include _palette-styles($theme, primary);\n\n &.mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-styles($theme, warn);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {}\n\n\n/// Outputs density theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-progress-bar.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the progress bar: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-progress-bar') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-linear-progress-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-linear-progress.$prefix, $options...);\n @include mdc-linear-progress-theme.theme($mdc-linear-progress-tokens);\n}\n","@use '@material/textfield/filled-text-field-theme' as mdc-filled-text-field-theme;\n@use '@material/textfield/outlined-text-field-theme' as mdc-outlined-text-field-theme;\n@use '../core/tokens/m2/mdc/filled-text-field' as tokens-mdc-filled-text-field;\n@use '../core/tokens/m2/mdc/outlined-text-field' as tokens-mdc-outlined-text-field;\n@use '../core/tokens/m2/mat/form-field' as tokens-mat-form-field;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-form-field.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(\n tokens-mdc-filled-text-field.$prefix,\n tokens-mdc-filled-text-field.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mdc-outlined-text-field.$prefix,\n tokens-mdc-outlined-text-field.get-unthemable-tokens());\n @include token-utils.create-token-values(\n tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the form field: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.get-color-tokens($theme));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.get-color-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-color-tokens($theme));\n }\n\n .mat-mdc-form-field.mat-accent {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.private-get-color-palette-color-tokens($theme, accent));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.private-get-color-palette-color-tokens($theme, accent));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-mdc-form-field.mat-warn {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.private-get-color-palette-color-tokens($theme, warn));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.private-get-color-palette-color-tokens($theme, warn));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-filled-text-field-theme.theme(\n tokens-mdc-filled-text-field.get-typography-tokens($theme));\n @include mdc-outlined-text-field-theme.theme(\n tokens-mdc-outlined-text-field.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix,\n tokens-mat-form-field.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-form-field.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the form field: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-filled-text-field-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-filled-text-field.$prefix, $options...);\n $mdc-outlined-text-field-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-outlined-text-field.$prefix, $options...);\n $mat-form-field-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-form-field.$prefix, $options...);\n @include mdc-filled-text-field-theme.theme($mdc-filled-text-field-tokens);\n @include mdc-outlined-text-field-theme.theme($mdc-outlined-text-field-tokens);\n @include token-utils.create-token-values(tokens-mat-form-field.$prefix, $mat-form-field-tokens);\n}\n","@use '../core/tokens/m2/mat/select' as tokens-mat-select;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-select.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-select.get-unthemable-tokens();\n @include token-utils.create-token-values(tokens-mat-select.$prefix, $mat-tokens);\n }\n }\n}\n\n/// Outputs color theme styles for the mat-select.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the select arrow: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-color-tokens($theme));\n\n .mat-mdc-form-field.mat-accent {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-color-tokens($theme, accent));\n }\n\n .mat-mdc-form-field.mat-warn {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-select.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-select.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-select.$prefix,\n tokens-mat-select.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the select arrow: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-select') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-select-tokens: token-utils.get-tokens-for($tokens, tokens-mat-select.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-select.$prefix, $mat-select-tokens);\n}\n","@use '@material/slider/slider-theme' as mdc-slider-theme;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mat/slider' as tokens-mat-slider;\n@use '../core/tokens/m2/mdc/slider' as tokens-mdc-slider;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-slider.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n $mat-tokens: tokens-mat-slider.get-unthemable-tokens();\n @include token-utils.create-token-values(tokens-mat-slider.$prefix, $mat-tokens);\n @include mdc-slider-theme.theme(tokens-mdc-slider.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-slider.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slider: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n $is-dark: inspection.get-theme-type($theme) == dark;\n\n $mdc-color-tokens: token-utils.resolve-elevation(\n tokens-mdc-slider.get-color-tokens($theme),\n handle-elevation,\n handle-shadow-color\n );\n\n $mat-slider-color-tokens: tokens-mat-slider.get-color-tokens($theme);\n\n // Add values for MDC slider tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-slider-theme.theme($mdc-color-tokens);\n @include token-utils.create-token-values(\n tokens-mat-slider.$prefix,\n $mat-slider-color-tokens\n );\n\n .mat-accent {\n @include token-utils.create-token-values(\n tokens-mat-slider.$prefix,\n tokens-mat-slider.private-get-color-palette-color-tokens($theme, accent),\n );\n @include mdc-slider-theme.theme(\n tokens-mdc-slider.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-warn {\n @include token-utils.create-token-values(\n tokens-mat-slider.$prefix,\n tokens-mat-slider.private-get-color-palette-color-tokens($theme, warn),\n );\n @include mdc-slider-theme.theme(\n tokens-mdc-slider.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n }\n}\n\n\n/// Outputs typography theme styles for the mat-slider.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n // Add values for MDC slider tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-slider-theme.theme(tokens-mdc-slider.get-typography-tokens($theme));\n }\n }\n}\n\n\n/// Outputs density theme styles for the mat-slider.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n // Add values for MDC slider tokens.\n @include sass-utils.current-selector-or-root() {\n @include mdc-slider-theme.theme(tokens-mdc-slider.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-option.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the slider: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-slider') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-slider-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-slider.$prefix, $options...);\n $mat-slider-tokens: token-utils.get-tokens-for($tokens, tokens-mat-slider.$prefix, $options...);\n @include mdc-slider-theme.theme($mdc-slider-tokens);\n @include token-utils.create-token-values(tokens-mat-slider.$prefix, $mat-slider-tokens);\n}\n","//\n// Copyright 2022 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n// stylelint-disable selector-class-pattern --\n// Internal stylesheet for material list component. Selector '.mdc-*' should\n// only be used in this project.\n\n@use '@material/density/functions' as density-functions;\n@use '@material/dom/mixins' as dom-mixins;\n@use '@material/feature-targeting/feature-targeting';\n@use '@material/ripple/ripple-theme';\n@use '@material/ripple/ripple';\n@use '@material/rtl/rtl';\n@use '@material/shape/mixins' as shape-mixins;\n@use '@material/theme/theme-color';\n@use '@material/theme/theme';\n@use '@material/typography/typography';\n@use './evolution-variables' as variables;\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:math';\n\n$ripple-target: variables.$ripple-target;\n\n@mixin static-styles($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include _high-contrast-mode($query: $query);\n .mdc-list {\n @include _static-list-base($query: $query);\n }\n\n .mdc-list-item__wrapper {\n @include feature-targeting.targets($feat-structure) {\n display: block;\n }\n }\n\n .mdc-list-item {\n @include item-base($query: $query);\n @include _list-item-baseline-height($query: $query);\n @include one-line-item-start-alignment(center, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n @include three-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n\n @include one-line-item-end-alignment(center, $query: $query);\n @include two-line-item-end-alignment(center, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n\n @include feature-targeting.targets($feat-structure) {\n align-items: stretch;\n cursor: pointer;\n }\n\n // Reset mouse cursor for disabled and non-interactive items.\n &.mdc-list-item--disabled,\n &.mdc-list-item--non-interactive {\n @include feature-targeting.targets($feat-structure) {\n cursor: auto;\n }\n }\n\n // TODO(b/254711887): Likely need to update this to adhere to a HCM focus\n // ring spec.\n // For components using aria-activedescendant, the focus pseudoclass is\n // never applied and use `.mdc-ripple-upgraded--background-focused` instead.\n &:not(.mdc-list-item--selected):focus::before,\n &.mdc-ripple-upgraded--background-focused::before {\n @include dom-mixins.transparent-border($query: $query);\n }\n\n &.mdc-list-item--selected::before {\n @include dom-mixins.transparent-border(\n $border-width: 3px,\n $border-style: double,\n $query: $query\n );\n }\n\n &.mdc-list-item--selected:focus::before {\n @include dom-mixins.transparent-border(\n $border-width: 3px,\n $query: $query\n );\n }\n }\n\n // stylelint-disable selector-max-type --\n // Override anchor tag styles for the use-case of a list being used for navigation\n a.mdc-list-item {\n @include feature-targeting.targets($feat-structure) {\n color: inherit;\n text-decoration: none;\n }\n }\n // stylelint-enable selector-max-type\n\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n fill: currentColor;\n flex-shrink: 0;\n pointer-events: none;\n }\n }\n\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n flex-shrink: 0;\n pointer-events: none;\n }\n }\n\n .mdc-list-item__content {\n @include typography.overflow-ellipsis($query);\n @include feature-targeting.targets($feat-structure) {\n align-self: center;\n flex: 1;\n pointer-events: none;\n }\n\n .mdc-list-item--with-two-lines &,\n .mdc-list-item--with-three-lines & {\n @include feature-targeting.targets($feat-structure) {\n align-self: stretch;\n }\n }\n\n // Disable interaction on label elements that may automatically\n // toggle corresponding checkbox / radio input.\n &[for] {\n @include feature-targeting.targets($feat-structure) {\n pointer-events: none;\n }\n }\n }\n\n .mdc-list-item__primary-text {\n @include typography.overflow-ellipsis($query);\n\n .mdc-list-item--with-two-lines &,\n .mdc-list-item--with-three-lines & {\n @include typography.text-baseline(\n $top: 28px,\n $bottom: 20px,\n $query: $query\n );\n }\n }\n\n .mdc-list-item__secondary-text {\n @include typography.overflow-ellipsis($query);\n @include typography.text-baseline(\n $top: 20px,\n $display: block,\n $query: $query\n );\n\n .mdc-list-item--with-three-lines & {\n @include feature-targeting.targets($feat-structure) {\n white-space: normal;\n line-height: 20px;\n }\n }\n\n .mdc-list-item--with-overline & {\n @include feature-targeting.targets($feat-structure) {\n white-space: nowrap;\n line-height: auto;\n }\n }\n }\n\n .mdc-list-item__overline-text {\n @include typography.overflow-ellipsis($query);\n\n .mdc-list-item--with-two-lines & {\n @include typography.text-baseline(\n $top: 24px,\n $bottom: 20px,\n $query: $query\n );\n }\n\n .mdc-list-item--with-three-lines & {\n @include typography.text-baseline(\n $top: 28px,\n $bottom: 20px,\n $query: $query\n );\n }\n }\n\n .mdc-list-item--with-leading-avatar {\n @include item-start-spacing(16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n border-radius: 50%;\n }\n }\n }\n\n .mdc-list-item--with-leading-icon {\n @include item-start-spacing(\n $leading: 16px,\n $trailing: 32px,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-thumbnail {\n @include item-start-spacing(16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-image {\n @include item-start-spacing(16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _one-line-item-taller-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n @include _two-line-item-tall-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n }\n\n .mdc-list-item--with-leading-video {\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 8px,\n $query: $query\n );\n @include item-start-spacing($leading: 0, $trailing: 16px, $query: $query);\n @include _two-line-item-text-baseline($query: $query);\n @include _one-line-item-taller-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n @include _two-line-item-tall-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n }\n\n .mdc-list-item--with-leading-checkbox {\n $leading: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-start-spacing($leading, $trailing, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-radio {\n $leading: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-start-spacing($leading, $trailing, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-leading-switch {\n @include item-start-spacing(16px, $query: $query);\n @include two-line-item-start-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n @include _two-line-item-text-baseline($query: $query);\n @include _tall-list-item-baseline-height($query: $query);\n }\n\n .mdc-list-item--with-trailing-icon {\n @include item-end-spacing(16px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-meta {\n @include two-line-item-end-alignment(flex-start, $query: $query);\n @include three-line-item-end-alignment(flex-start, $query: $query);\n @include item-end-spacing($leading: 28px, $trailing: 16px, $query: $query);\n @include _multi-line-item-end-text-baseline($query: $query);\n\n .mdc-list-item__end {\n @include typography.typography(caption, $query);\n }\n }\n\n .mdc-list-item--with-trailing-checkbox {\n $leading: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-end-spacing($leading, $trailing, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n }\n\n .mdc-list-item--with-trailing-radio {\n $leading: absorb-overflow(32px, $actual: 40px, $available: 24px);\n $trailing: absorb-overflow(16px, $actual: 40px, $available: 24px);\n $top: absorb-overflow(16px, $actual: 40px, $available: 24px);\n\n @include item-end-spacing($leading, $trailing, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: $top,\n $query: $query\n );\n }\n\n .mdc-list-item--with-trailing-switch {\n @include item-end-spacing(16px, $query: $query);\n @include three-line-item-end-alignment(\n $alignment: flex-start,\n $offset: 16px,\n $query: $query\n );\n }\n\n .mdc-list-item--with-overline {\n @include _two-line-item-primary-text-baseline(20px, 0px, $query: $query);\n @include _three-line-item-primary-baseline(20px, 0px, $query: $query);\n }\n\n // This must be specified last to ensure that RTL padding takes priority over\n // LTR padding in the cascade.\n .mdc-list-item {\n @include item-spacing(16px, $query: $query);\n }\n\n //\n // Grouping\n //\n .mdc-list-group {\n @include feature-targeting.targets($feat-structure) {\n // Cancel top/bottom padding on individual lists within group\n .mdc-deprecated-list {\n padding: 0;\n }\n }\n }\n .mdc-list-group__subheader {\n @include _list-group-subheader-margin($query: $query);\n }\n\n //\n // Dividers\n //\n\n .mdc-list-divider {\n @include feature-targeting.targets($feat-structure) {\n padding: 0;\n\n // Allows the use of padding to specify leading and trailing insets\n // independently.\n background-clip: content-box;\n }\n }\n\n // The base inset variant corresponds to the item's padding.\n .mdc-list-divider,\n .mdc-list-divider--with-leading-text,\n .mdc-list-divider--with-leading-icon,\n .mdc-list-divider--with-leading-image,\n .mdc-list-divider--with-leading-thumbnail,\n .mdc-list-divider--with-leading-avatar,\n .mdc-list-divider--with-leading-checkbox,\n .mdc-list-divider--with-leading-switch,\n .mdc-list-divider--with-leading-radio {\n @include divider-leading-inset(16px, $query: $query);\n @include divider-trailing-inset(16px, $query: $query);\n }\n\n .mdc-list-divider--with-leading-video {\n @include divider-leading-inset(0px, $query: $query);\n }\n\n // This is needed to ensure that default padding isn't applied in RTL locales.\n .mdc-list-divider {\n @include feature-targeting.targets($feat-structure) {\n @include rtl.rtl {\n padding: 0;\n }\n }\n }\n}\n\n@mixin core-styles($query: feature-targeting.all()) {\n @include without-ripple($query);\n @include with-ripple($query);\n}\n\n@mixin without-ripple($query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n $feat-structure: feature-targeting.create-target($query, structure);\n $feat-typography: feature-targeting.create-target($query, typography);\n\n //\n // Items\n //\n\n @include list-primary-text-ink-color(text-primary-on-background, $query);\n @include list-secondary-text-ink-color(text-secondary-on-background, $query);\n @include list-overline-text-ink-color(text-hint-on-background, $query);\n @include list-icon-fill-color(transparent, $query);\n @include list-icon-ink-color(text-icon-on-background, $query);\n @include list-meta-text-ink-color(text-hint-on-background, $query);\n @include list-disabled-opacity(variables.$content-disabled-opacity, $query);\n @include list-disabled-ink-color(variables.$content-disabled-color, $query);\n @include list-selected-ink-color(variables.$content-selected-color, $query);\n\n @include group-subheader-ink-color(text-primary-on-background, $query);\n\n @include _high-contrast-mode-border-color($query);\n\n .mdc-list {\n @include _typography-list-base($query: $query);\n }\n\n .mdc-list-item__primary-text {\n @include typography.typography(subtitle1, $query);\n }\n\n .mdc-list-item__secondary-text {\n @include typography.typography(body2, $query);\n }\n\n .mdc-list-item__overline-text {\n @include typography.typography(overline, $query);\n }\n\n .mdc-list-item--with-leading-avatar {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-icon {\n @include item-start-size(24px, $query: $query);\n }\n\n .mdc-list-item--with-leading-thumbnail {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-image {\n @include item-start-size(56px, $query: $query);\n }\n\n .mdc-list-item--with-leading-video {\n @include item-start-size($width: 100px, $height: 56px, $query: $query);\n }\n\n .mdc-list-item--with-leading-checkbox {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-radio {\n @include item-start-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-leading-switch {\n @include item-start-size($width: 36px, $height: 20px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-icon {\n @include item-end-size(24px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-meta {\n .mdc-list-item__end {\n @include typography.typography(caption, $query);\n }\n }\n\n .mdc-list-item--with-trailing-checkbox {\n @include item-end-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-radio {\n @include item-end-size(40px, $query: $query);\n }\n\n .mdc-list-item--with-trailing-switch {\n @include item-end-size($width: 36px, $height: 20px, $query: $query);\n }\n\n .mdc-list-group__subheader {\n @include typography.typography(subtitle1, $query);\n }\n\n //\n // Dividers\n //\n\n $divider-color: if(\n theme-color.tone(theme-color.$background) == 'dark',\n variables.$divider-color-on-dark-bg,\n variables.$divider-color-on-light-bg\n );\n\n @include divider-color($divider-color, $query: $query);\n @include divider-height(1px, $query: $query);\n @include static-styles($query: $query);\n} // end of without-ripple\n\n@mixin with-ripple($query: feature-targeting.all()) {\n @include ripple.common($query); // COPYBARA_COMMENT_THIS_LINE\n\n :not(.mdc-list-item--disabled).mdc-list-item {\n @include _item-interactive-ripple($query);\n }\n}\n\n///\n/// Adjusts an offset (i.e., margin) to accomodate contents that are larger than\n/// the space allocated by the specification.\n///\n/// For instance, the specification provides 24x24dp for a checkbox with a 16dp\n/// margin. However, checkboxes are actually 40x40dp. To ensure that the\n/// checkbox is positioned correctly, the margin is reduced by 8dp to reflect\n/// that the margin is already \"baked into\" the checkbox.\n///\n/// Concretely, 40dp - 24dp = 16dp. Assuming that the control is symmetrical,\n/// half of the overflow (8dp) is on the leading side and half on the trailing\n/// side. Therefore, the leading and trailing margins are reduced by 8dp.\n///\n/// Note: this might be more useful if it's added into the leading/trailing\n/// margin mixins as a parameter.\n///\n@function absorb-overflow($offset, $actual, $available, $symmetric: true) {\n @if $actual <= $available {\n @return $offset;\n }\n $overflow: $actual - $available;\n @return $offset - math.div($overflow, if($symmetric, 2, 1));\n}\n\n@mixin one-line-item-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-one-line {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n }\n}\n\n@mixin two-line-item-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-two-lines {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n }\n}\n@mixin three-line-item-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-three-lines {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n }\n}\n\n@mixin list-item-height($height) {\n &.mdc-list-item--with-one-line,\n &.mdc-list-item--with-two-lines,\n &.mdc-list-item--with-three-lines {\n @include theme.property(height, $height);\n }\n}\n\n@mixin item-spacing(\n $leading,\n $trailing: $leading,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n @include rtl.reflexive-property(padding, $leading, $trailing);\n }\n}\n\n@mixin one-line-item-start-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-one-line {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin two-line-item-start-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin three-line-item-start-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin one-line-item-end-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-one-line {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin two-line-item-end-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin three-line-item-end-alignment(\n $alignment,\n $offset: 0,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-structure) {\n align-self: $alignment;\n margin-top: $offset;\n }\n }\n }\n}\n\n@mixin item-start-spacing(\n $leading,\n $trailing: $leading,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n // Extra specificity needed to override default customizations.\n &.mdc-list-item {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, 0, auto);\n }\n\n .mdc-list-item__start {\n @include rtl.reflexive-property(margin, $leading, $trailing);\n }\n }\n}\n\n@mixin item-end-spacing(\n $leading,\n $trailing: $leading,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n // Extra specificity needed to override default customizations.\n &.mdc-list-item {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, auto, 0);\n }\n\n .mdc-list-item__end {\n @include rtl.reflexive-property(margin, $leading, $trailing);\n }\n }\n}\n\n@mixin item-start-size(\n $width,\n $height: $width,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n .mdc-list-item__start {\n @include theme.property(width, $width);\n @include theme.property(height, $height);\n }\n }\n}\n\n@mixin item-end-size($width, $height: $width, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n .mdc-list-item__end {\n @include theme.property(width, $width);\n @include theme.property(height, $height);\n }\n }\n}\n\n@mixin list-item-selected-container-color($color) {\n &.mdc-list-item.mdc-list-item--selected {\n @include theme.property(background-color, $color);\n }\n}\n\n@mixin list-primary-text-typography($typography-theme) {\n .mdc-list-item__primary-text {\n @include typography.theme-styles($typography-theme);\n }\n}\n\n@mixin list-primary-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__primary-text {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-secondary-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__secondary-text {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-secondary-text-typography($typography-theme) {\n .mdc-list-item__secondary-text {\n @include typography.theme-styles($typography-theme);\n }\n}\n\n@mixin list-overline-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__overline-text {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-meta-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-icon-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--with-leading-icon .mdc-list-item__start,\n .mdc-list-item--with-trailing-icon .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n@mixin list-icon-fill-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--with-leading-icon .mdc-list-item__start,\n .mdc-list-item--with-trailing-icon .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(background-color, $color);\n }\n }\n}\n\n@mixin list-selected-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--selected,\n .mdc-list-item--activated {\n @include list-primary-text-ink-color($color, $query);\n @include _item-icon-ink-color($color, $leading-only: true, $query: $query);\n }\n}\n\n@mixin list-selected-meta-text-ink-color(\n $color,\n $query: feature-targeting.all()\n) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--selected,\n .mdc-list-item--activated {\n @include list-meta-text-ink-color($color, $query);\n }\n}\n\n@mixin list-disabled-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--disabled {\n @include list-primary-text-ink-color($color, $query);\n @include list-secondary-text-ink-color($color, $query);\n @include list-overline-text-ink-color($color, $query);\n @include _item-icon-ink-color($color, $query: $query);\n @include item-meta-text-ink-color($color, $query);\n }\n}\n\n@mixin list-disabled-opacity($opacity, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-item--disabled {\n .mdc-list-item__start,\n .mdc-list-item__content,\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(opacity, $opacity);\n }\n }\n }\n}\n\n@mixin group-subheader-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-deprecated-list-group__subheader {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n}\n\n///\n/// Sets shape radius (rounded) to single line list variant.\n///\n/// @param {Number | List} $radius Radius size in `px` or percentage. It can be 4 value corner or single radius.\n/// Set to `50%` for rounded shape.\n/// @param {Boolean} $rtl-reflexive Set to true to flip border radius in RTL context. Defaults to `false`.\n/// @param {Number} $density-scale Density scale of single line list. Set this only when custom density is applied.\n/// Defaults to `$mdc-deprecated-list-single-line-density-scale`.\n///\n/// @access public\n///\n@mixin one-line-list-radius(\n $radius,\n $rtl-reflexive: false,\n $density-scale: variables.$one-line-item-density-scale,\n $query: feature-targeting.all()\n) {\n .mdc-list-item--with-one-line {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$one-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$one-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$one-line-item-taller-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n }\n}\n\n@mixin two-line-list-radius(\n $radius,\n $rtl-reflexive: false,\n $density-scale: variables.$two-line-item-density-scale,\n $query: feature-targeting.all()\n) {\n .mdc-list-item--with-two-lines {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$two-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch,\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$two-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n }\n}\n\n@mixin three-line-list-radius(\n $radius,\n $rtl-reflexive: false,\n $density-scale: variables.$three-line-item-density-scale,\n $query: feature-targeting.all()\n) {\n .mdc-list-item--with-three-lines {\n @include shape-mixins.radius(\n $radius,\n $rtl-reflexive,\n $component-height:\n density-functions.prop-value(\n $density-config: variables.$three-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height\n ),\n $query: $query\n );\n }\n}\n\n@mixin divider-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-list-divider {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(background-color, $color);\n }\n }\n}\n\n@mixin divider-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n .mdc-list-divider {\n @include feature-targeting.targets($feat-structure) {\n @include theme.property(height, $height);\n }\n }\n}\n\n@mixin divider-leading-inset($inset, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-divider--with-leading-inset {\n @include feature-targeting.targets($feat-structure) {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, $inset, auto);\n }\n }\n}\n\n@mixin divider-trailing-inset($inset, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n &.mdc-list-divider--with-trailing-inset {\n @include feature-targeting.targets($feat-structure) {\n // We rely on auto to avoid clobbering the opposite padding.\n @include rtl.reflexive-property(padding, auto, $inset);\n }\n }\n}\n\n// The public density mixins apply the appropriate density styles regardless of\n// the item's start contents.\n@mixin one-line-item-density(\n $density-scale,\n $exclude-variants: false,\n $query: feature-targeting.all()\n) {\n @include _one-line-item-density($density-scale, $query: $query);\n\n @if not $exclude-variants {\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch {\n @include _one-line-item-tall-density($density-scale, $query: $query);\n }\n\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include _one-line-item-taller-density($density-scale, $query: $query);\n }\n }\n}\n\n@mixin two-line-item-density($density-scale, $query: feature-targeting.all()) {\n @include _two-line-item-density($density-scale, $query: $query);\n\n &.mdc-list-item--with-leading-avatar,\n &.mdc-list-item--with-leading-icon,\n &.mdc-list-item--with-leading-thumbnail,\n &.mdc-list-item--with-leading-checkbox,\n &.mdc-list-item--with-leading-radio,\n &.mdc-list-item--with-leading-switch,\n &.mdc-list-item--with-leading-image,\n &.mdc-list-item--with-leading-video {\n @include _two-line-item-tall-density($density-scale, $query: $query);\n }\n}\n\n@mixin three-line-item-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n @include _three-line-item-density($density-scale, $query: $query);\n}\n\n//\n// Private\n//\n\n// Mixins that apply baseline height for one-, two-, and three- line item\n// container heights. This mixin calls the density mixins so that the styles\n// can be overwritten by future density mixin calls.\n@mixin _list-item-baseline-height($query: feature-targeting.all()) {\n @include _one-line-item-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n\n @include _two-line-item-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n\n @include _three-line-item-density(\n variables.$three-line-item-density-scale,\n $query: $query\n );\n}\n\n@mixin _tall-list-item-baseline-height($query: feature-targeting.all()) {\n @include _one-line-item-tall-density(\n variables.$one-line-item-density-scale,\n $query: $query\n );\n @include _two-line-item-tall-density(\n variables.$two-line-item-density-scale,\n $query: $query\n );\n}\n\n// The private density mixins allow density properties to be overridden\n// individually to avoid increasing specificity.\n\n@mixin _one-line-item-density($density-scale, $query: feature-targeting.all()) {\n $height: density-functions.prop-value(\n $density-config: variables.$one-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include one-line-item-height($height, $query: $query);\n}\n\n@mixin _one-line-item-tall-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$one-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include one-line-item-height($height, $query: $query);\n}\n\n@mixin _one-line-item-taller-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$one-line-item-taller-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include one-line-item-height($height, $query: $query);\n}\n\n@mixin _two-line-item-density($density-scale, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n $height: density-functions.prop-value(\n $density-config: variables.$two-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include two-line-item-height($height, $query: $query);\n\n @if ($density-scale and $density-scale != 0) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__content {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n .mdc-list-item__primary-text,\n .mdc-list-item__secondary-text {\n margin-top: 0px;\n margin-bottom: 0px;\n line-height: 1.4;\n &::before,\n &::after {\n display: none;\n }\n }\n }\n }\n}\n\n@mixin _two-line-item-tall-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$two-line-item-tall-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include two-line-item-height($height, $query: $query);\n}\n\n@mixin _three-line-item-density(\n $density-scale,\n $query: feature-targeting.all()\n) {\n $height: density-functions.prop-value(\n $density-config: variables.$three-line-item-density-config,\n $density-scale: $density-scale,\n $property-name: height,\n );\n\n @include three-line-item-height($height, $query: $query);\n}\n\n// Split the list-base mixin into two sub-mixins, one holding the\n// structural/static styles (static-list-base) and the other holding styles\n// that are themable (typography-list-base). However, the existing list-base\n// mixin need to be preserved as Angular calls this mixin for autocomplete\n// base styling.\n@mixin _typography-list-base($query: feature-targeting.all()) {\n $feat-typography: feature-targeting.create-target($query, typography);\n @include typography.typography(subtitle1, $query);\n @include feature-targeting.targets($feat-typography) {\n // According to the mocks and stickersheet, the line-height is\n // adjusted to 24px for text content, same as for body1.\n /* @alternate */\n line-height: map.get(map.get(typography.$styles, body1), line-height);\n }\n}\n\n@mixin _static-list-base($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include feature-targeting.targets($feat-structure) {\n margin: 0;\n padding: 8px 0;\n list-style-type: none;\n\n &:focus // lint-disable-focus-psuedo-selector\n {\n outline: none;\n }\n }\n}\n\n@mixin list-base($query: feature-targeting.all()) {\n @include _typography-list-base($query: $query);\n @include _static-list-base($query: $query);\n}\n\n@mixin item-base($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n @include feature-targeting.targets($feat-structure) {\n display: flex;\n position: relative;\n align-items: center;\n justify-content: flex-start;\n overflow: hidden;\n padding: 0;\n\n &:focus // lint-disable-focus-psuedo-selector\n {\n outline: none;\n }\n }\n}\n\n@mixin _item-interactive-ripple($query: feature-targeting.all()) {\n @include ripple.surface(\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple.radius-bounded(\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple-theme.states(\n theme-color.prop-value(on-surface),\n false,\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple-theme.states-activated(\n primary,\n false,\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n @include ripple-theme.states-selected(\n primary,\n false,\n $ripple-target: variables.$ripple-target,\n $query: $query\n );\n\n #{variables.$ripple-target} {\n @include ripple.surface-styles($query: $query);\n @include ripple.target-common($query: $query);\n }\n}\n\n@mixin _two-line-item-text-baseline($query: feature-targeting.all()) {\n @include _two-line-item-primary-text-baseline(32px, 20px, $query: $query);\n @include _two-line-item-overline-text-baseline(28px, 20px, $query: $query);\n @include _two-line-item-meta-text-baseline($top: 32px, $query: $query);\n}\n\n@mixin _two-line-item-primary-text-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__primary-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _three-line-item-primary-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__primary-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _two-line-item-overline-text-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__overline-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _three-line-item-overline-baseline(\n $top,\n $bottom,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__overline-text {\n @include typography.text-baseline(\n $top: $top,\n $bottom: $bottom,\n $query: $query\n );\n }\n }\n}\n\n@mixin _multi-line-item-end-text-baseline($query: feature-targeting.all()) {\n &.mdc-list-item--with-two-lines {\n .mdc-list-item__end {\n @include typography.text-baseline(\n $display: block,\n $top: 28px,\n $query: $query\n );\n }\n }\n\n &.mdc-list-item--with-three-lines {\n .mdc-list-item__end {\n @include typography.text-baseline(\n $display: block,\n $top: 28px,\n $query: $query\n );\n }\n }\n}\n\n@mixin _two-line-item-meta-text-baseline(\n $top,\n $query: feature-targeting.all()\n) {\n &.mdc-list-item--with-two-lines {\n &.mdc-list-item--with-trailing-meta {\n .mdc-list-item__end {\n @include typography.text-baseline(\n $display: block,\n $top: $top,\n $query: $query\n );\n }\n }\n }\n}\n\n@mixin item-meta-text-ink-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n &.mdc-list-item--with-trailing-meta {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n }\n}\n\n@mixin _item-icon-ink-color(\n $color,\n $leading-only: false,\n $query: feature-targeting.all()\n) {\n $feat-color: feature-targeting.create-target($query, color);\n\n &.mdc-list-item--with-leading-icon {\n .mdc-list-item__start {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n }\n\n @if (not $leading-only) {\n &.mdc-list-item--with-trailing-icon {\n .mdc-list-item__end {\n @include feature-targeting.targets($feat-color) {\n @include theme.property(color, $color);\n }\n }\n }\n }\n}\n\n@mixin _high-contrast-mode-border-color($query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n .mdc-list-divider::after {\n @include feature-targeting.targets($feat-color) {\n // Color ensures border is shown, but will be overridden by the browser.\n @include theme.property(border-bottom-color, white);\n }\n }\n}\n\n@mixin _high-contrast-mode($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include dom-mixins.forced-colors-mode {\n .mdc-list-divider::after {\n @include feature-targeting.targets($feat-structure) {\n content: '';\n display: block;\n border-bottom-width: 1px;\n border-bottom-style: solid;\n }\n }\n }\n}\n\n@mixin _list-group-subheader-margin($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n $mdc-list-subheader-virtual-height: 3rem;\n $mdc-list-subheader-leading: map.get(\n map.get(typography.$styles, body1),\n line-height\n );\n $mdc-list-subheader-margin: calc(\n (#{$mdc-list-subheader-virtual-height} - #{$mdc-list-subheader-leading}) / 2\n );\n\n @include feature-targeting.targets($feat-structure) {\n margin: $mdc-list-subheader-margin variables.$side-padding;\n }\n}\n","@use '@material/button/button-text-theme' as mdc-button-text-theme;\n@use '@material/button/button-filled-theme' as mdc-button-filled-theme;\n@use '@material/button/button-protected-theme' as mdc-button-protected-theme;\n@use '@material/button/button-outlined-theme' as mdc-button-outlined-theme;\n\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mdc/filled-button' as tokens-mdc-filled-button;\n@use '../core/tokens/m2/mat/filled-button' as tokens-mat-filled-button;\n@use '../core/tokens/m2/mdc/outlined-button' as tokens-mdc-outlined-button;\n@use '../core/tokens/m2/mat/outlined-button' as tokens-mat-outlined-button;\n@use '../core/tokens/m2/mdc/protected-button' as tokens-mdc-protected-button;\n@use '../core/tokens/m2/mat/protected-button' as tokens-mat-protected-button;\n@use '../core/tokens/m2/mdc/text-button' as tokens-mdc-text-button;\n@use '../core/tokens/m2/mat/text-button' as tokens-mat-text-button;\n@use '../core/style/sass-utils';\n\n@mixin _text-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-text-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-text-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-text-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-text-button.get-color-tokens($theme)\n );\n\n @include mdc-button-text-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix, $mat-tokens);\n}\n\n@mixin _filled-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-filled-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-filled-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-filled-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-filled-button.get-color-tokens($theme)\n );\n\n @include mdc-button-filled-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix, $mat-tokens);\n}\n\n@mixin _protected-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-protected-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-protected-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-protected-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-protected-button.get-color-tokens($theme)\n );\n\n @include mdc-button-protected-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix, $mat-tokens);\n}\n\n@mixin _outlined-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-outlined-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-outlined-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-outlined-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-outlined-button.get-color-tokens($theme)\n );\n\n @include mdc-button-outlined-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix, $mat-tokens);\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-text-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-text-button.$prefix, $options...);\n $mdc-protected-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-protected-button.$prefix, $options...);\n $mdc-filled-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-filled-button.$prefix, $options...);\n $mdc-outlined-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-outlined-button.$prefix, $options...);\n $mat-text-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-text-button.$prefix, $options...);\n $mat-protected-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-protected-button.$prefix, $options...);\n $mat-filled-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-filled-button.$prefix, $options...);\n $mat-outlined-button-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-outlined-button.$prefix, $options...);\n @include mdc-button-text-theme.theme($mdc-text-button-tokens);\n @include mdc-button-protected-theme.theme($mdc-protected-button-tokens);\n @include mdc-button-filled-theme.theme($mdc-filled-button-tokens);\n @include mdc-button-outlined-theme.theme($mdc-outlined-button-tokens);\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix, $mat-text-button-tokens);\n @include token-utils.create-token-values(\n tokens-mat-protected-button.$prefix, $mat-protected-button-tokens);\n @include token-utils.create-token-values(\n tokens-mat-filled-button.$prefix, $mat-filled-button-tokens);\n @include token-utils.create-token-values(\n tokens-mat-outlined-button.$prefix, $mat-outlined-button-tokens);\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-button.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-button-text-theme.theme(\n tokens-mdc-text-button.get-unthemable-tokens());\n @include mdc-button-filled-theme.theme(\n tokens-mdc-filled-button.get-unthemable-tokens());\n @include mdc-button-protected-theme.theme(\n tokens-mdc-protected-button.get-unthemable-tokens());\n @include mdc-button-outlined-theme.theme(\n tokens-mdc-outlined-button.get-unthemable-tokens());\n\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix,\n tokens-mat-text-button.get-unthemable-tokens());\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix,\n tokens-mat-filled-button.get-unthemable-tokens());\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix,\n tokens-mat-protected-button.get-unthemable-tokens());\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix,\n tokens-mat-outlined-button.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include _text-button-variant($theme, null);\n @include _filled-button-variant($theme, null);\n @include _protected-button-variant($theme, null);\n @include _outlined-button-variant($theme, null);\n }\n\n .mat-mdc-button {\n &.mat-primary {\n @include _text-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _text-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _text-button-variant($theme, warn);\n }\n }\n\n .mat-mdc-unelevated-button {\n &.mat-primary {\n @include _filled-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _filled-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _filled-button-variant($theme, warn);\n }\n }\n\n .mat-mdc-raised-button {\n &.mat-primary {\n @include _protected-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _protected-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _protected-button-variant($theme, warn);\n }\n }\n\n .mat-mdc-outlined-button {\n &.mat-primary {\n @include _outlined-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _outlined-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _outlined-button-variant($theme, warn);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-button-text-theme.theme(\n tokens-mdc-text-button.get-typography-tokens($theme));\n @include mdc-button-filled-theme.theme(\n tokens-mdc-filled-button.get-typography-tokens($theme));\n @include mdc-button-outlined-theme.theme(\n tokens-mdc-outlined-button.get-typography-tokens($theme));\n @include mdc-button-protected-theme.theme(\n tokens-mdc-protected-button.get-typography-tokens($theme));\n\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix,\n tokens-mat-text-button.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix,\n tokens-mat-filled-button.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix,\n tokens-mat-protected-button.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix,\n tokens-mat-outlined-button.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-button-text-theme.theme(\n tokens-mdc-text-button.get-density-tokens($theme));\n @include mdc-button-filled-theme.theme(\n tokens-mdc-filled-button.get-density-tokens($theme));\n @include mdc-button-outlined-theme.theme(\n tokens-mdc-outlined-button.get-density-tokens($theme));\n @include mdc-button-protected-theme.theme(\n tokens-mdc-protected-button.get-density-tokens($theme));\n\n @include token-utils.create-token-values(tokens-mat-text-button.$prefix,\n tokens-mat-text-button.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-filled-button.$prefix,\n tokens-mat-filled-button.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-protected-button.$prefix,\n tokens-mat-protected-button.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-outlined-button.$prefix,\n tokens-mat-outlined-button.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-button.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the button: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-button') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n","@use 'sass:map';\n@use 'sass:math';\n@use '@material/density/functions' as mdc-density-functions;\n@use '@material/icon-button/icon-button-theme' as mdc-icon-button-theme;\n@use '../core/tokens/m2/mdc/icon-button' as tokens-mdc-icon-button;\n@use '../core/tokens/m2/mat/icon-button' as tokens-mat-icon-button;\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n\n\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-icon-button-theme.theme(tokens-mdc-icon-button.get-unthemable-tokens());\n }\n }\n}\n\n@mixin _icon-button-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-icon-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-icon-button.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-icon-button.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-icon-button.get-color-tokens($theme)\n );\n\n @include mdc-icon-button-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-icon-button.$prefix, $mat-tokens);\n}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include _icon-button-variant($theme, null);\n\n .mat-mdc-icon-button {\n &.mat-primary {\n @include _icon-button-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _icon-button-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _icon-button-variant($theme, warn);\n }\n }\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-icon-button.$prefix,\n tokens-mat-icon-button.get-typography-tokens($theme));\n }\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n $icon-size: 24px;\n $density-scale: inspection.get-theme-density($theme);\n // Manually apply the expected density theming, and include the padding\n // as it was applied before\n $calculated-size: mdc-density-functions.prop-value(\n $density-config: (\n size: (\n default: 48px,\n maximum: 48px,\n minimum: 28px,\n ),\n ),\n $density-scale: $density-scale,\n $property-name: size,\n );\n\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-icon-button.$prefix,\n tokens-mat-icon-button.get-density-tokens($theme));\n }\n\n // Use `mat-mdc-button-base` to increase the specificity over the button's structural styles.\n .mat-mdc-icon-button.mat-mdc-button-base {\n // Match the styles that used to be present. This is necessary for backwards\n // compat to match the previous implementations selector count (two classes).\n @include mdc-icon-button-theme.theme((\n state-layer-size: $calculated-size,\n ));\n\n // TODO: Switch calculated-size to \"var(--mdc-icon-button-state-layer-size)\"\n // Currently fails validation because the variable is \"undefined\"\n // in the sass stack.\n // TODO: Switch icon-size to \"var(--mdc-icon-button-icon-size)\". Currently\n // fails validation because the variable is \"undefined\" in the sass stack.\n width: var(--mdc-icon-button-state-layer-size);\n height: var(--mdc-icon-button-state-layer-size);\n padding: math.div($calculated-size - $icon-size, 2);\n }\n }\n}\n\n@mixin theme($theme) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-icon-button') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme));\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @if ($tokens != ()) {\n @include mdc-icon-button-theme.theme(map.get($tokens, tokens-mdc-icon-button.$prefix));\n @include token-utils.create-token-values(\n tokens-mat-icon-button.$prefix, map.get($tokens, tokens-mat-icon-button.$prefix));\n }\n}\n","@use '@material/fab/fab-theme' as mdc-fab-theme;\n@use '@material/fab/fab-small-theme' as mdc-fab-small-theme;\n@use '@material/fab/extended-fab-theme' as mdc-extended-fab-theme;\n@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/m2/mdc/fab' as tokens-mdc-fab;\n@use '../core/tokens/m2/mdc/fab-small' as tokens-mdc-fab-small;\n@use '../core/tokens/m2/mdc/extended-fab' as tokens-mdc-extended-fab;\n@use '../core/tokens/m2/mat/fab' as tokens-mat-fab;\n@use '../core/tokens/m2/mat/fab-small' as tokens-mat-fab-small;\n@use '../core/tokens/token-utils';\n@use '../core/typography/typography';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-fab.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-fab-theme.theme(tokens-mdc-fab.get-unthemable-tokens());\n @include mdc-fab-small-theme.theme(tokens-mdc-fab-small.get-unthemable-tokens());\n @include mdc-extended-fab-theme.theme(\n tokens-mdc-extended-fab.get-unthemable-tokens()\n );\n }\n }\n}\n\n@mixin _fab-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-fab.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-fab.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-fab.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-fab.get-color-tokens($theme)\n );\n\n @include mdc-fab-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-fab.$prefix, $mat-tokens);\n}\n\n@mixin _fab-small-variant($theme, $palette) {\n $mdc-tokens: if($palette,\n tokens-mdc-fab-small.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mdc-fab-small.get-color-tokens($theme)\n );\n\n $mat-tokens: if($palette,\n tokens-mat-fab-small.private-get-color-palette-color-tokens($theme, $palette),\n tokens-mat-fab-small.get-color-tokens($theme)\n );\n\n @include mdc-fab-small-theme.theme($mdc-tokens);\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix, $mat-tokens);\n}\n\n/// Outputs color theme styles for the mat-fab.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the fab: primary, secondary, or tertiary\n/// (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include _fab-variant($theme, null);\n @include _fab-small-variant($theme, null);\n @include mdc-extended-fab-theme.theme(tokens-mdc-extended-fab.get-color-tokens($theme));\n\n .mat-mdc-fab {\n &.mat-primary {\n @include _fab-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _fab-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _fab-variant($theme, warn);\n }\n }\n\n .mat-mdc-mini-fab {\n &.mat-primary {\n @include _fab-small-variant($theme, primary);\n }\n\n &.mat-accent {\n @include _fab-small-variant($theme, accent);\n }\n\n &.mat-warn {\n @include _fab-small-variant($theme, warn);\n }\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-fab.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include mdc-extended-fab-theme.theme(tokens-mdc-extended-fab.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-fab.$prefix,\n tokens-mat-fab.get-typography-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix,\n tokens-mat-fab-small.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-fab.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-fab.$prefix,\n tokens-mat-fab.get-density-tokens($theme));\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix,\n tokens-mat-fab-small.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the fab: primary, secondary, or tertiary\n/// (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-fab') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-extended-fab-tokens: token-utils.get-tokens-for(\n $tokens, tokens-mdc-extended-fab.$prefix, $options...);\n $mdc-fab-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-fab.$prefix, $options...);\n $mdc-fab-small-tokens: token-utils.get-tokens-for($tokens, tokens-mdc-fab-small.$prefix,\n $options...);\n $mat-fab-tokens: token-utils.get-tokens-for($tokens, tokens-mat-fab.$prefix, $options...);\n $mat-fab-small-tokens: token-utils.get-tokens-for($tokens, tokens-mat-fab-small.$prefix,\n $options...);\n @include mdc-extended-fab-theme.theme($mdc-extended-fab-tokens);\n @include mdc-fab-theme.theme($mdc-fab-tokens);\n @include mdc-fab-small-theme.theme($mdc-fab-small-tokens);\n @include token-utils.create-token-values(tokens-mat-fab.$prefix, $mat-fab-tokens);\n @include token-utils.create-token-values(tokens-mat-fab-small.$prefix, $mat-fab-small-tokens);\n}\n","@use '../core/style/sass-utils';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mdc/circular-progress' as tokens-mdc-circular-progress;\n@use '@material/circular-progress/circular-progress-theme' as mdc-circular-progress-theme;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n // Add default values for tokens not related to color, typography, or density.\n @include sass-utils.current-selector-or-root() {\n @include mdc-circular-progress-theme.theme(\n tokens-mdc-circular-progress.get-unthemable-tokens()\n );\n }\n }\n}\n\n/// Outputs color theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the spinner: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n $mdc-circular-progress-color-tokens: tokens-mdc-circular-progress.get-color-tokens($theme);\n\n @include sass-utils.current-selector-or-root() {\n @include mdc-circular-progress-theme.theme($mdc-circular-progress-color-tokens);\n\n .mat-accent {\n $color: inspection.get-theme-color($theme, accent);\n @include mdc-circular-progress-theme.theme((active-indicator-color: $color));\n }\n\n .mat-warn {\n $color: inspection.get-theme-color($theme, warn);\n @include mdc-circular-progress-theme.theme((active-indicator-color: $color));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n}\n\n/// Outputs density theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-progress-spinner.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the spinner: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-progress-spinner') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mdc-circular-progress-tokens:\n token-utils.get-tokens-for($tokens, tokens-mdc-circular-progress.$prefix, $options...);\n @include mdc-circular-progress-theme.theme($mdc-circular-progress-tokens);\n}\n","@use 'sass:color';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mat/badge' as tokens-mat-badge;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-badge.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the badge: primary, secondary, tertiary,\n/// or error (If not specified, default error color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.get-color-tokens($theme));\n }\n\n .mat-badge-accent {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-badge-warn {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-badge.$prefix,\n tokens-mat-badge.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {}\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-badge.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the badge: primary, secondary, tertiary,\n/// or error (If not specified, default error color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-badge') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-badge-tokens: token-utils.get-tokens-for($tokens, tokens-mat-badge.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-badge.$prefix, $mat-badge-tokens);\n}\n","@use 'sass:color';\n@use 'sass:map';\n@use '../core/tokens/m2/mat/datepicker' as tokens-mat-datepicker;\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n@use '../core/typography/typography';\n@use '../button/icon-button-theme';\n\n// TODO(crisbeto): these variables aren't used anymore and should be removed.\n$selected-today-box-shadow-width: 1px;\n$selected-fade-amount: 0.6;\n$range-fade-amount: 0.2;\n$today-fade-amount: 0.2;\n$calendar-body-font-size: 13px !default;\n$calendar-weekday-table-font-size: 11px !default;\n\n@mixin _calendar-color($theme, $palette-name) {\n $palette-color: inspection.get-theme-color($theme, $palette-name);\n $range-color: tokens-mat-datepicker.private-get-range-background-color($palette-color);\n $range-tokens: tokens-mat-datepicker.get-range-color-tokens($range-color);\n $calendar-tokens:\n tokens-mat-datepicker.private-get-calendar-color-palette-color-tokens($theme, $palette-name);\n\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n map.merge($calendar-tokens, $range-tokens));\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-datepicker.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n tokens-mat-datepicker.get-unthemable-tokens());\n }\n }\n}\n\n/// Outputs color theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the main selection: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n tokens-mat-datepicker.get-color-tokens($theme));\n }\n\n .mat-datepicker-content {\n &.mat-accent {\n @include _calendar-color($theme, accent);\n }\n\n &.mat-warn {\n @include _calendar-color($theme, warn);\n }\n }\n\n .mat-datepicker-toggle-active {\n &.mat-accent {\n $accent-tokens:\n tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, accent);\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $accent-tokens);\n }\n\n &.mat-warn {\n $warn-tokens:\n tokens-mat-datepicker.private-get-toggle-color-palette-color-tokens($theme, warn);\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $warn-tokens);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix,\n tokens-mat-datepicker.get-typography-tokens($theme));\n }\n }\n}\n\n@mixin date-range-colors(\n $range-color,\n $comparison-color: tokens-mat-datepicker.$private-default-comparison-color,\n $overlap-color: tokens-mat-datepicker.$private-default-overlap-color,\n $overlap-selected-color:\n tokens-mat-datepicker.private-get-default-overlap-selected-color($overlap-color)) {\n $tokens: tokens-mat-datepicker.get-range-color-tokens(\n $range-color: $range-color,\n $comparison-color: $comparison-color,\n $overlap-color: $overlap-color,\n $overlap-selected-color: $overlap-selected-color,\n );\n\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $tokens);\n }\n}\n\n/// Outputs density theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n // TODO(crisbeto): move this into the structural styles\n // once the icon button density is switched to tokens.\n\n // Regardless of the user-passed density, we want the calendar\n // previous/next buttons to remain at density -2\n .mat-calendar-controls {\n @include icon-button-theme.density(-2);\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-datepicker.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the main selection: primary, secondary, tertiary,\n/// or error (If not specified, default primary color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-datepicker') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-datepicker-tokens:\n token-utils.get-tokens-for($tokens, tokens-mat-datepicker.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-datepicker.$prefix, $mat-datepicker-tokens);\n}\n","@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/tokens/m2/mat/icon' as tokens-mat-icon;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n@mixin _palette-colors($theme, $palette-name) {\n $color: inspection.get-theme-color($theme, $palette-name, text);\n $tokens: tokens-mat-icon.private-get-icon-color-tokens($color);\n @include token-utils.create-token-values(tokens-mat-icon.$prefix, $tokens);\n}\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for the mat-icon.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {}\n}\n\n/// Outputs color theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the icon: primary, secondary, tertiary, or error\n/// (If not specified, default neutral color will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-icon.$prefix,\n tokens-mat-icon.get-color-tokens($theme));\n }\n\n .mat-icon {\n &.mat-primary {\n @include _palette-colors($theme, primary);\n }\n\n &.mat-accent {\n @include _palette-colors($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-colors($theme, warn);\n }\n }\n }\n}\n\n/// Outputs typography theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {}\n}\n\n/// Outputs density theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {}\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for the mat-icon.\n/// @param {Map} $theme The theme to generate styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the icon: surface, primary, secondary, tertiary,\n/// or error (If not specified, default surface color will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-icon') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n $mat-icon-tokens: token-utils.get-tokens-for($tokens, tokens-mat-icon.$prefix, $options...);\n @include token-utils.create-token-values(tokens-mat-icon.$prefix, $mat-icon-tokens);\n}\n","@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/style/sass-utils';\n@use '../core/tokens/token-utils';\n@use '../core/tokens/m2/mat/stepper' as tokens-mat-stepper;\n\n/// Outputs base theme styles (styles not dependent on the color, typography, or density settings)\n/// for mat-stepper.\n/// @param {Map} $theme The theme to generate base styles for.\n@mixin base($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, base));\n }\n @else {}\n}\n\n/// Outputs color theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the stepper: primary, secondary,\n/// tertiary, or error (If not specified, primary color values will be used).\n@mixin color($theme, $options...) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color), $options...);\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.get-color-tokens($theme));\n\n .mat-step-header.mat-accent {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.private-get-color-palette-color-tokens($theme, accent));\n }\n\n .mat-step-header.mat-warn {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.private-get-color-palette-color-tokens($theme, warn));\n }\n }\n }\n}\n\n/// Outputs typography theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate typography styles for.\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.get-typography-tokens($theme));\n }\n }\n}\n\n/// Outputs density theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate density styles for.\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-stepper.$prefix,\n tokens-mat-stepper.get-density-tokens($theme));\n }\n }\n}\n\n/// Outputs all (base, color, typography, and density) theme styles for mat-stepper.\n/// @param {Map} $theme The theme to generate color styles for.\n/// @param {ArgList} Additional optional arguments (only supported for M3 themes):\n/// $color-variant: The color variant to use for the stepper: primary, secondary,\n/// tertiary, or error (If not specified, primary color values will be used).\n@mixin theme($theme, $options...) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-stepper') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme), $options...);\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens, $options...) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @if ($tokens != ()) {\n $mat-stepper-tokens: token-utils.get-tokens-for(\n $tokens,\n tokens-mat-stepper.$prefix,\n $options...\n );\n @include token-utils.create-token-values(\n tokens-mat-stepper.$prefix, $mat-stepper-tokens);\n }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/theming/inspection';\n@use '../core/theming/validation';\n@use '../core/typography/typography';\n@use '../core/tokens/m2/mat/toolbar' as tokens-mat-toolbar;\n@use '../core/tokens/token-utils';\n@use '../core/style/sass-utils';\n\n@mixin _palette-styles($theme, $palette-name) {\n @include token-utils.create-token-values(\n tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.private-get-color-palette-color-tokens(\n $background-color: inspection.get-theme-color($theme, $palette-name),\n $text-color: inspection.get-theme-color($theme, $palette-name, default-contrast)\n )\n );\n}\n\n@mixin base($theme) {}\n\n@mixin color($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, color));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.get-color-tokens($theme));\n }\n\n .mat-toolbar {\n &.mat-primary {\n @include _palette-styles($theme, primary);\n }\n\n &.mat-accent {\n @include _palette-styles($theme, accent);\n }\n\n &.mat-warn {\n @include _palette-styles($theme, warn);\n }\n }\n }\n}\n\n@mixin typography($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, typography));\n }\n @else {\n // TODO(mmalerba): Stop calling this and resolve resulting screen diffs.\n $theme: inspection.private-get-typography-back-compat-theme($theme);\n\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.get-typography-tokens($theme));\n }\n }\n}\n\n@mixin density($theme) {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme, density));\n }\n @else {\n @include sass-utils.current-selector-or-root() {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n tokens-mat-toolbar.get-density-tokens($theme));\n }\n }\n}\n\n@mixin theme($theme) {\n @include theming.private-check-duplicate-theme-styles($theme, 'mat-toolbar') {\n @if inspection.get-theme-version($theme) == 1 {\n @include _theme-from-tokens(inspection.get-theme-tokens($theme));\n }\n @else {\n @include base($theme);\n @if inspection.theme-has($theme, color) {\n @include color($theme);\n }\n @if inspection.theme-has($theme, density) {\n @include density($theme);\n }\n @if inspection.theme-has($theme, typography) {\n @include typography($theme);\n }\n }\n }\n}\n\n@mixin _theme-from-tokens($tokens) {\n @include validation.selector-defined(\n 'Calls to Angular Material theme mixins with an M3 theme must be wrapped in a selector');\n @if ($tokens != ()) {\n @include token-utils.create-token-values(tokens-mat-toolbar.$prefix,\n map.get($tokens, tokens-mat-toolbar.$prefix));\n }\n}\n"],"names":[],"sourceRoot":"webpack:///","x_google_ignoreList":[0,1,2,3,4,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37]} \ No newline at end of file