Sindbad~EG File Manager
| Current Path : /proc/self/cwd/public/client/ |
|
|
| Current File : //proc/self/cwd/public/client/styles.7c61fed2cfeb85cbaff9.css.map |
{"version":3,"sources":["webpack:///./node_modules/@angular/material/_theming.scss","webpack:///$stdin","webpack:///./src/scss/styles.scss","webpack:///./src/common/scss/global.scss","webpack:///./src/common/scss/utils.scss","webpack:///./src/common/scss/no-results-message.scss","webpack:///./src/common/scss/buttons.scss","webpack:///./src/common/scss/input.scss","webpack:///./src/common/scss/modal.scss","webpack:///./src/common/scss/social-icons.scss","webpack:///./src/common/scss/auth-page.scss","webpack:///./src/common/scss/perfect-scrollbar-theme.scss","webpack:///./src/common/scss/context-menu.scss","webpack:///./src/common/scss/appearance-editor-select-box.scss","webpack:///./src/scss/files-select-box.scss","webpack:///./src/scss/file-colors.scss","webpack:///./src/scss/toggle-expansion-icon.scss"],"names":[],"mappings":"AA+7II,kBA3gIF,iCCza8C,CDya9C,uBCzamF,CDyanF,wBA2gIE,kBA3gIF,wCCva+C,CDua/C,2BCvaoF,CDuapF,4BA2gIE,kBA3gIF,wCCra+C,CDqa/C,2BCraoF,CDqapF,4BA2gIE,kBA3gIF,wCCna+C,CDma/C,2BCnaoF,CDmapF,4BA2gIE,kBA3gIF,wCCja+C,CDia/C,2BCjaoF,CDiapF,6BA2gIE,kBA3gIF,wCC/Z+C,CD+Z/C,2BC/ZoF,CD+ZpF,6BA2gIE,kBA3gIF,wCC7Z+C,CD6Z/C,4BC7ZqF,CD6ZrF,6BA2gIE,kBA3gIF,wCC3Z+C,CD2Z/C,8BC3ZqF,CD2ZrF,+BA2gIE,kBA3gIF,wCCzZ+C,CDyZ/C,8BCzZqF,CDyZrF,+BA2gIE,kBA3gIF,wCCvZ+C,CDuZ/C,8BCvZqF,CDuZrF,+BA2gIE,mBA3gIF,wCCrZ+C,CDqZ/C,+BCrZsF,CDqZtF,+BA2gIE,mBA3gIF,wCCnZ+C,CDmZ/C,+BCnZsF,CDmZtF,+BA2gIE,mBA3gIF,wCCjZ+C,CDiZ/C,+BCjZsF,CDiZtF,+BA2gIE,mBA3gIF,wCC/Y+C,CD+Y/C,+BC/YsF,CD+YtF,+BA2gIE,mBA3gIF,wCC7Y+C,CD6Y/C,+BC7YsF,CD6YtF,+BA2gIE,mBA3gIF,wCC3Y+C,CD2Y/C,+BC3YsF,CD2YtF,+BA2gIE,mBA3gIF,yCCzYgD,CDyYhD,+BCzYuF,CDyYvF,+BA2gIE,mBA3gIF,yCCvYgD,CDuYhD,+BCvYuF,CDuYvF,+BA2gIE,mBA3gIF,yCCrYgD,CDqYhD,+BCrYuF,CDqYvF,+BA2gIE,mBA3gIF,yCCnYgD,CDmYhD,+BCnYuF,CDmYvF,+BA2gIE,mBA3gIF,0CCjYiD,CDiYjD,+BCjYwF,CDiYxF,+BA2gIE,mBA3gIF,0CC/XiD,CD+XjD,+BC/XwF,CD+XxF,+BA2gIE,mBA3gIF,0CC7XiD,CD6XjD,+BC7XwF,CD6XxF,+BA2gIE,mBA3gIF,0CC3XiD,CD2XjD,+BC3XwF,CD2XxF,+BA2gIE,mBA3gIF,0CCzXiD,CDyXjD,+BCzXwF,CDyXxF,+BAm7CA,mBACE,gBACA,eACA,kBC3yDiB,CD2yDjB,gBC3yDmC,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,YACA,iBACA,yBACA,sBACA,cAtER,+CA0EQ,kBACA,MACA,UACA,SACA,eACA,mBACA,yBACA,WACA,iBACA,gBACA,gBACA,uBAEA,yCAvFR,+CAwFU,gBACA,UACA,yBACA,cACA,oBACA,eACA,gBA9FV,yDAmGQ,eACA,kBACA,WACA,SAtGR,+DAyGU,cCxGV,IACE,kBADF,gBAII,WCLJ,cACE,YACA,sBZgbA,wCCw2C+C,CDx2C/C,2BCw2CoF,CDx2CpF,6BY9aA,WACA,cACA,qFANF,iCASI,WACA,yBACA,sBACA,YACA,eACA,YACA,eACA,aACA,mBACA,eACA,UAnBJ,0DAuBQ,sBAvBR,sDA2BQ,iCA3BR,0CAgCM,sBACA,eAjCN,2CAqCM,kBArCN,2CAyCM,iBACA,sBACA,eA3CN,yCA+CM,iBA/CN,yBAoDI,iCACA,aACA,WACA,eACA,eACA,WC3DJ,iBACE,0BACA,kBACA,oBACA,YACA,UACA,YCJF,kBACE,kBACA,YACA,iCACA,gCACA,QACA,SCSA,YACE,cADF,YACE,cADF,YACE,cADF,WACE,cADF,cACE,cADF,+CACE,cADF,UACE,cClBJ,uBACE,eACA,0DACA,mGACA,cAJF,gCAOI","file":"styles.7c61fed2cfeb85cbaff9.css","sourcesContent":["// Import all the theming functionality.\n// We can use relative imports for imports from the cdk because we bundle everything\n// up into a single flat scss file for material.\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$cdk-z-index-overlay-container: 1000;\n$cdk-z-index-overlay: 1000;\n$cdk-z-index-overlay-backdrop: 1000;\n\n// Background color for all of the backdrops\n$cdk-overlay-dark-backdrop-background: rgba(0, 0, 0, 0.288);\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\n@mixin cdk-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: $cdk-z-index-overlay-container;\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: $cdk-z-index-overlay;\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: $cdk-z-index-overlay;\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: $cdk-z-index-overlay-backdrop;\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 // In high contrast mode the rgba background will become solid so we need to fall back\n // to making it opaque using `opacity`. Note that we can't use the `cdk-high-contrast`\n // mixin, because we can't normalize the import path to the _a11y.scss both for the\n // source and when this file is distributed. See #10908.\n @media screen and (-ms-high-contrast: active) {\n opacity: 0.6;\n }\n }\n }\n\n .cdk-overlay-dark-backdrop {\n background: $cdk-overlay-dark-backdrop-background;\n }\n\n .cdk-overlay-transparent-backdrop {\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 }\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: $cdk-z-index-overlay;\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\n@mixin cdk-a11y {\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 // 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}\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n@mixin cdk-high-contrast($target: active) {\n @media screen and (-ms-high-contrast: $target) {\n @content;\n }\n}\n\n// Core styles that enable monitoring autofill state of text fields.\n@mixin cdk-text-field {\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 animation-name: cdk-text-field-autofill-start;\n }\n\n .cdk-text-field-autofill-monitored:not(:-webkit-autofill) {\n animation-name: cdk-text-field-autofill-end;\n }\n\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 height: auto !important;\n overflow: hidden !important;\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\n// Used to generate UIDs for keyframes used to change the text field autofill styles.\n$cdk-text-field-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 cdk-text-field-autofill-color($background, $foreground:'') {\n @keyframes cdk-text-field-autofill-color-#{$cdk-text-field-autofill-color-frame-count} {\n to {\n background: $background;\n @if $foreground != '' { color: $foreground; }\n }\n }\n\n &:-webkit-autofill {\n animation-name: cdk-text-field-autofill-color-#{$cdk-text-field-autofill-color-frame-count};\n animation-fill-mode: both;\n }\n\n &.cdk-text-field-autofill-monitored:-webkit-autofill {\n animation-name: cdk-text-field-autofill-start,\n cdk-text-field-autofill-color-#{$cdk-text-field-autofill-color-frame-count};\n }\n\n $cdk-text-field-autofill-color-frame-count:\n $cdk-text-field-autofill-color-frame-count + 1 !global;\n}\n\n\n// Core styles that can be used to apply material design treatments to any element.\n// Media queries\n// TODO(josephperrott): Change $mat-xsmall and $mat-small usages to rely on BreakpointObserver,\n$mat-xsmall: 'max-width: 599px';\n$mat-small: 'max-width: 959px';\n\n// TODO: Revisit all z-indices before beta\n// z-index master list\n\n$z-index-fab: 20 !default;\n$z-index-drawer: 100 !default;\n\n// Global constants\n$pi: 3.14159265;\n\n// Padding between input toggles and their labels\n$mat-toggle-padding: 8px !default;\n// Width and height of input toggles\n$mat-toggle-size: 20px !default;\n\n// Easing Curves\n// TODO(jelbourn): all of these need to be revisited\n\n// The default animation curves used by material design.\n$mat-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;\n$mat-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;\n$mat-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;\n\n$ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;\n\n$swift-ease-out-duration: 400ms !default;\n$swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\n$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;\n\n$swift-ease-in-duration: 300ms !default;\n$swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;\n$swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;\n\n$swift-ease-in-out-duration: 500ms !default;\n$swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;\n$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;\n\n$swift-linear-duration: 80ms !default;\n$swift-linear-timing-function: linear !default;\n$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;\n\n\n\n// A collection of mixins and CSS classes that can be used to apply elevation to a material\n// element.\n// See: https://material.io/design/environment/elevation.html\n// Examples:\n//\n//\n// .mat-foo {\n// @include $mat-elevation(2);\n//\n// &:active {\n// @include $mat-elevation(8);\n// }\n// }\n//\n// <div id=\"external-card\" class=\"mat-elevation-z2\"><p>Some content</p></div>\n//\n// For an explanation of the design behind how elevation is implemented, see the design doc at\n// https://goo.gl/Kq0k9Z.\n\n// Colors for umbra, penumbra, and ambient shadows. As described in the design doc, each elevation\n// level is created using a set of 3 shadow values, one for umbra (the shadow representing the\n// space completely obscured by an object relative to its light source), one for penumbra (the\n// space partially obscured by an object), and one for ambient (the space which contains the object\n// itself). For a further explanation of these terms and their meanings, see\n// https://en.wikipedia.org/wiki/Umbra,_penumbra_and_antumbra.\n\n// Maps for the different shadow sets and their values within each z-space. These values were\n// created by taking a few reference shadow sets created by Google's Designers and interpolating\n// all of the values between them.\n\n@function _get-umbra-map($color, $opacity) {\n @return (\n 0: '0px 0px 0px 0px #{rgba($color, $opacity * 0.2)}',\n 1: '0px 2px 1px -1px #{rgba($color, $opacity * 0.2)}',\n 2: '0px 3px 1px -2px #{rgba($color, $opacity * 0.2)}',\n 3: '0px 3px 3px -2px #{rgba($color, $opacity * 0.2)}',\n 4: '0px 2px 4px -1px #{rgba($color, $opacity * 0.2)}',\n 5: '0px 3px 5px -1px #{rgba($color, $opacity * 0.2)}',\n 6: '0px 3px 5px -1px #{rgba($color, $opacity * 0.2)}',\n 7: '0px 4px 5px -2px #{rgba($color, $opacity * 0.2)}',\n 8: '0px 5px 5px -3px #{rgba($color, $opacity * 0.2)}',\n 9: '0px 5px 6px -3px #{rgba($color, $opacity * 0.2)}',\n 10: '0px 6px 6px -3px #{rgba($color, $opacity * 0.2)}',\n 11: '0px 6px 7px -4px #{rgba($color, $opacity * 0.2)}',\n 12: '0px 7px 8px -4px #{rgba($color, $opacity * 0.2)}',\n 13: '0px 7px 8px -4px #{rgba($color, $opacity * 0.2)}',\n 14: '0px 7px 9px -4px #{rgba($color, $opacity * 0.2)}',\n 15: '0px 8px 9px -5px #{rgba($color, $opacity * 0.2)}',\n 16: '0px 8px 10px -5px #{rgba($color, $opacity * 0.2)}',\n 17: '0px 8px 11px -5px #{rgba($color, $opacity * 0.2)}',\n 18: '0px 9px 11px -5px #{rgba($color, $opacity * 0.2)}',\n 19: '0px 9px 12px -6px #{rgba($color, $opacity * 0.2)}',\n 20: '0px 10px 13px -6px #{rgba($color, $opacity * 0.2)}',\n 21: '0px 10px 13px -6px #{rgba($color, $opacity * 0.2)}',\n 22: '0px 10px 14px -6px #{rgba($color, $opacity * 0.2)}',\n 23: '0px 11px 14px -7px #{rgba($color, $opacity * 0.2)}',\n 24: '0px 11px 15px -7px #{rgba($color, $opacity * 0.2)}'\n );\n}\n\n@function _get-penumbra-map($color, $opacity) {\n @return (\n 0: '0px 0px 0px 0px #{rgba($color, $opacity * 0.14)}',\n 1: '0px 1px 1px 0px #{rgba($color, $opacity * 0.14)}',\n 2: '0px 2px 2px 0px #{rgba($color, $opacity * 0.14)}',\n 3: '0px 3px 4px 0px #{rgba($color, $opacity * 0.14)}',\n 4: '0px 4px 5px 0px #{rgba($color, $opacity * 0.14)}',\n 5: '0px 5px 8px 0px #{rgba($color, $opacity * 0.14)}',\n 6: '0px 6px 10px 0px #{rgba($color, $opacity * 0.14)}',\n 7: '0px 7px 10px 1px #{rgba($color, $opacity * 0.14)}',\n 8: '0px 8px 10px 1px #{rgba($color, $opacity * 0.14)}',\n 9: '0px 9px 12px 1px #{rgba($color, $opacity * 0.14)}',\n 10: '0px 10px 14px 1px #{rgba($color, $opacity * 0.14)}',\n 11: '0px 11px 15px 1px #{rgba($color, $opacity * 0.14)}',\n 12: '0px 12px 17px 2px #{rgba($color, $opacity * 0.14)}',\n 13: '0px 13px 19px 2px #{rgba($color, $opacity * 0.14)}',\n 14: '0px 14px 21px 2px #{rgba($color, $opacity * 0.14)}',\n 15: '0px 15px 22px 2px #{rgba($color, $opacity * 0.14)}',\n 16: '0px 16px 24px 2px #{rgba($color, $opacity * 0.14)}',\n 17: '0px 17px 26px 2px #{rgba($color, $opacity * 0.14)}',\n 18: '0px 18px 28px 2px #{rgba($color, $opacity * 0.14)}',\n 19: '0px 19px 29px 2px #{rgba($color, $opacity * 0.14)}',\n 20: '0px 20px 31px 3px #{rgba($color, $opacity * 0.14)}',\n 21: '0px 21px 33px 3px #{rgba($color, $opacity * 0.14)}',\n 22: '0px 22px 35px 3px #{rgba($color, $opacity * 0.14)}',\n 23: '0px 23px 36px 3px #{rgba($color, $opacity * 0.14)}',\n 24: '0px 24px 38px 3px #{rgba($color, $opacity * 0.14)}'\n );\n}\n\n@function _get-ambient-map($color, $opacity) {\n @return (\n 0: '0px 0px 0px 0px #{rgba($color, $opacity * 0.12)}',\n 1: '0px 1px 3px 0px #{rgba($color, $opacity * 0.12)}',\n 2: '0px 1px 5px 0px #{rgba($color, $opacity * 0.12)}',\n 3: '0px 1px 8px 0px #{rgba($color, $opacity * 0.12)}',\n 4: '0px 1px 10px 0px #{rgba($color, $opacity * 0.12)}',\n 5: '0px 1px 14px 0px #{rgba($color, $opacity * 0.12)}',\n 6: '0px 1px 18px 0px #{rgba($color, $opacity * 0.12)}',\n 7: '0px 2px 16px 1px #{rgba($color, $opacity * 0.12)}',\n 8: '0px 3px 14px 2px #{rgba($color, $opacity * 0.12)}',\n 9: '0px 3px 16px 2px #{rgba($color, $opacity * 0.12)}',\n 10: '0px 4px 18px 3px #{rgba($color, $opacity * 0.12)}',\n 11: '0px 4px 20px 3px #{rgba($color, $opacity * 0.12)}',\n 12: '0px 5px 22px 4px #{rgba($color, $opacity * 0.12)}',\n 13: '0px 5px 24px 4px #{rgba($color, $opacity * 0.12)}',\n 14: '0px 5px 26px 4px #{rgba($color, $opacity * 0.12)}',\n 15: '0px 6px 28px 5px #{rgba($color, $opacity * 0.12)}',\n 16: '0px 6px 30px 5px #{rgba($color, $opacity * 0.12)}',\n 17: '0px 6px 32px 5px #{rgba($color, $opacity * 0.12)}',\n 18: '0px 7px 34px 6px #{rgba($color, $opacity * 0.12)}',\n 19: '0px 7px 36px 6px #{rgba($color, $opacity * 0.12)}',\n 20: '0px 8px 38px 7px #{rgba($color, $opacity * 0.12)}',\n 21: '0px 8px 40px 7px #{rgba($color, $opacity * 0.12)}',\n 22: '0px 8px 42px 7px #{rgba($color, $opacity * 0.12)}',\n 23: '0px 9px 44px 8px #{rgba($color, $opacity * 0.12)}',\n 24: '0px 9px 46px 8px #{rgba($color, $opacity * 0.12)}'\n );\n}\n\n// The default duration value for elevation transitions.\n$mat-elevation-transition-duration: 280ms !default;\n\n// The default easing value for elevation transitions.\n$mat-elevation-transition-timing-function: $mat-fast-out-slow-in-timing-function;\n\n// The default color for elevation shadows.\n$mat-elevation-color: black !default;\n\n// The default opacity scaling value for elevation shadows.\n$mat-elevation-opacity: 1 !default;\n\n// Prefix for elevation-related selectors.\n$_mat-elevation-prefix: 'mat-elevation-z';\n\n// Applies the correct css rules to an element to give it the elevation specified by $zValue.\n// The $zValue must be between 0 and 24.\n@mixin mat-elevation($zValue, $color: $mat-elevation-color, $opacity: $mat-elevation-opacity) {\n @if type-of($zValue) != number or not unitless($zValue) {\n @error '$zValue must be a unitless number';\n }\n @if $zValue < 0 or $zValue > 24 {\n @error '$zValue must be between 0 and 24';\n }\n\n box-shadow: #{map-get(_get-umbra-map($color, $opacity), $zValue)},\n #{map-get(_get-penumbra-map($color, $opacity), $zValue)},\n #{map-get(_get-ambient-map($color, $opacity), $zValue)};\n}\n\n// Applies the elevation to an element in a manner that allows\n// consumers to override it via the Material elevation classes.\n@mixin mat-overridable-elevation(\n $zValue,\n $color: $mat-elevation-color,\n $opacity: $mat-elevation-opacity) {\n &:not([class*='#{$_mat-elevation-prefix}']) {\n @include mat-elevation($zValue, $color, $opacity);\n }\n}\n\n// Returns a string that can be used as the value for a transition property for elevation.\n// Calling this function directly is useful in situations where a component needs to transition\n// more than one property.\n//\n// .foo {\n// transition: mat-elevation-transition-property-value(), opacity 100ms ease;\n// }\n@function mat-elevation-transition-property-value(\n $duration: $mat-elevation-transition-duration,\n $easing: $mat-elevation-transition-timing-function) {\n @return box-shadow #{$duration} #{$easing};\n}\n\n// Applies the correct css rules needed to have an element transition between elevations.\n// This mixin should be applied to elements whose elevation values will change depending on their\n// context (e.g. when active or disabled).\n//\n// NOTE(traviskaufman): Both this mixin and the above function use default parameters so they can\n// be used in the same way by clients.\n@mixin mat-elevation-transition(\n $duration: $mat-elevation-transition-duration,\n $easing: $mat-elevation-transition-timing-function) {\n transition: mat-elevation-transition-property-value($duration, $easing);\n}\n\n// Color palettes from the Material Design spec.\n// See https://material.io/design/color/\n//\n// Contrast colors are hard-coded because it is too difficult (probably impossible) to\n// calculate them. These contrast colors are pulled from the public Material Design spec swatches.\n// While the contrast colors in the spec are not prescriptive, we use them for convenience.\n\n\n// @deprecated renamed to $dark-primary-text.\n// @breaking-change 7.0.0\n$black-87-opacity: rgba(black, 0.87);\n// @deprecated renamed to $light-primary-text.\n// @breaking-change 7.0.0\n$white-87-opacity: rgba(white, 0.87);\n// @deprecated use $dark-[secondary-text,disabled-text,dividers,focused] instead.\n// @breaking-change 7.0.0\n$black-12-opacity: rgba(black, 0.12);\n// @deprecated use $light-[secondary-text,disabled-text,dividers,focused] instead.\n// @breaking-change 7.0.0\n$white-12-opacity: rgba(white, 0.12);\n// @deprecated use $dark-[secondary-text,disabled-text,dividers,focused] instead.\n// @breaking-change 7.0.0\n$black-6-opacity: rgba(black, 0.06);\n// @deprecated use $light-[secondary-text,disabled-text,dividers,focused] instead.\n// @breaking-change 7.0.0\n$white-6-opacity: rgba(white, 0.06);\n\n$dark-primary-text: rgba(black, 0.87);\n$dark-secondary-text: rgba(black, 0.54);\n$dark-disabled-text: rgba(black, 0.38);\n$dark-dividers: rgba(black, 0.12);\n$dark-focused: rgba(black, 0.12);\n$light-primary-text: white;\n$light-secondary-text: rgba(white, 0.7);\n$light-disabled-text: rgba(white, 0.5);\n$light-dividers: rgba(white, 0.12);\n$light-focused: rgba(white, 0.12);\n\n$mat-red: (\n 50: #ffebee,\n 100: #ffcdd2,\n 200: #ef9a9a,\n 300: #e57373,\n 400: #ef5350,\n 500: #f44336,\n 600: #e53935,\n 700: #d32f2f,\n 800: #c62828,\n 900: #b71c1c,\n A100: #ff8a80,\n A200: #ff5252,\n A400: #ff1744,\n A700: #d50000,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $light-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-pink: (\n 50: #fce4ec,\n 100: #f8bbd0,\n 200: #f48fb1,\n 300: #f06292,\n 400: #ec407a,\n 500: #e91e63,\n 600: #d81b60,\n 700: #c2185b,\n 800: #ad1457,\n 900: #880e4f,\n A100: #ff80ab,\n A200: #ff4081,\n A400: #f50057,\n A700: #c51162,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $light-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-purple: (\n 50: #f3e5f5,\n 100: #e1bee7,\n 200: #ce93d8,\n 300: #ba68c8,\n 400: #ab47bc,\n 500: #9c27b0,\n 600: #8e24aa,\n 700: #7b1fa2,\n 800: #6a1b9a,\n 900: #4a148c,\n A100: #ea80fc,\n A200: #e040fb,\n A400: #d500f9,\n A700: #aa00ff,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $light-primary-text,\n 400: $light-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $light-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-deep-purple: (\n 50: #ede7f6,\n 100: #d1c4e9,\n 200: #b39ddb,\n 300: #9575cd,\n 400: #7e57c2,\n 500: #673ab7,\n 600: #5e35b1,\n 700: #512da8,\n 800: #4527a0,\n 900: #311b92,\n A100: #b388ff,\n A200: #7c4dff,\n A400: #651fff,\n A700: #6200ea,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $light-primary-text,\n 400: $light-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $light-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-indigo: (\n 50: #e8eaf6,\n 100: #c5cae9,\n 200: #9fa8da,\n 300: #7986cb,\n 400: #5c6bc0,\n 500: #3f51b5,\n 600: #3949ab,\n 700: #303f9f,\n 800: #283593,\n 900: #1a237e,\n A100: #8c9eff,\n A200: #536dfe,\n A400: #3d5afe,\n A700: #304ffe,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $light-primary-text,\n 400: $light-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $light-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-blue: (\n 50: #e3f2fd,\n 100: #bbdefb,\n 200: #90caf9,\n 300: #64b5f6,\n 400: #42a5f5,\n 500: #2196f3,\n 600: #1e88e5,\n 700: #1976d2,\n 800: #1565c0,\n 900: #0d47a1,\n A100: #82b1ff,\n A200: #448aff,\n A400: #2979ff,\n A700: #2962ff,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $light-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-light-blue: (\n 50: #e1f5fe,\n 100: #b3e5fc,\n 200: #81d4fa,\n 300: #4fc3f7,\n 400: #29b6f6,\n 500: #03a9f4,\n 600: #039be5,\n 700: #0288d1,\n 800: #0277bd,\n 900: #01579b,\n A100: #80d8ff,\n A200: #40c4ff,\n A400: #00b0ff,\n A700: #0091ea,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-cyan: (\n 50: #e0f7fa,\n 100: #b2ebf2,\n 200: #80deea,\n 300: #4dd0e1,\n 400: #26c6da,\n 500: #00bcd4,\n 600: #00acc1,\n 700: #0097a7,\n 800: #00838f,\n 900: #006064,\n A100: #84ffff,\n A200: #18ffff,\n A400: #00e5ff,\n A700: #00b8d4,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-teal: (\n 50: #e0f2f1,\n 100: #b2dfdb,\n 200: #80cbc4,\n 300: #4db6ac,\n 400: #26a69a,\n 500: #009688,\n 600: #00897b,\n 700: #00796b,\n 800: #00695c,\n 900: #004d40,\n A100: #a7ffeb,\n A200: #64ffda,\n A400: #1de9b6,\n A700: #00bfa5,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-green: (\n 50: #e8f5e9,\n 100: #c8e6c9,\n 200: #a5d6a7,\n 300: #81c784,\n 400: #66bb6a,\n 500: #4caf50,\n 600: #43a047,\n 700: #388e3c,\n 800: #2e7d32,\n 900: #1b5e20,\n A100: #b9f6ca,\n A200: #69f0ae,\n A400: #00e676,\n A700: #00c853,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-light-green: (\n 50: #f1f8e9,\n 100: #dcedc8,\n 200: #c5e1a5,\n 300: #aed581,\n 400: #9ccc65,\n 500: #8bc34a,\n 600: #7cb342,\n 700: #689f38,\n 800: #558b2f,\n 900: #33691e,\n A100: #ccff90,\n A200: #b2ff59,\n A400: #76ff03,\n A700: #64dd17,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $dark-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-lime: (\n 50: #f9fbe7,\n 100: #f0f4c3,\n 200: #e6ee9c,\n 300: #dce775,\n 400: #d4e157,\n 500: #cddc39,\n 600: #c0ca33,\n 700: #afb42b,\n 800: #9e9d24,\n 900: #827717,\n A100: #f4ff81,\n A200: #eeff41,\n A400: #c6ff00,\n A700: #aeea00,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $dark-primary-text,\n 700: $dark-primary-text,\n 800: $dark-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-yellow: (\n 50: #fffde7,\n 100: #fff9c4,\n 200: #fff59d,\n 300: #fff176,\n 400: #ffee58,\n 500: #ffeb3b,\n 600: #fdd835,\n 700: #fbc02d,\n 800: #f9a825,\n 900: #f57f17,\n A100: #ffff8d,\n A200: #ffff00,\n A400: #ffea00,\n A700: #ffd600,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $dark-primary-text,\n 700: $dark-primary-text,\n 800: $dark-primary-text,\n 900: $dark-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-amber: (\n 50: #fff8e1,\n 100: #ffecb3,\n 200: #ffe082,\n 300: #ffd54f,\n 400: #ffca28,\n 500: #ffc107,\n 600: #ffb300,\n 700: #ffa000,\n 800: #ff8f00,\n 900: #ff6f00,\n A100: #ffe57f,\n A200: #ffd740,\n A400: #ffc400,\n A700: #ffab00,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $dark-primary-text,\n 700: $dark-primary-text,\n 800: $dark-primary-text,\n 900: $dark-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $dark-primary-text,\n )\n);\n\n$mat-orange: (\n 50: #fff3e0,\n 100: #ffe0b2,\n 200: #ffcc80,\n 300: #ffb74d,\n 400: #ffa726,\n 500: #ff9800,\n 600: #fb8c00,\n 700: #f57c00,\n 800: #ef6c00,\n 900: #e65100,\n A100: #ffd180,\n A200: #ffab40,\n A400: #ff9100,\n A700: #ff6d00,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $dark-primary-text,\n 700: $dark-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: black,\n )\n);\n\n$mat-deep-orange: (\n 50: #fbe9e7,\n 100: #ffccbc,\n 200: #ffab91,\n 300: #ff8a65,\n 400: #ff7043,\n 500: #ff5722,\n 600: #f4511e,\n 700: #e64a19,\n 800: #d84315,\n 900: #bf360c,\n A100: #ff9e80,\n A200: #ff6e40,\n A400: #ff3d00,\n A700: #dd2c00,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-brown: (\n 50: #efebe9,\n 100: #d7ccc8,\n 200: #bcaaa4,\n 300: #a1887f,\n 400: #8d6e63,\n 500: #795548,\n 600: #6d4c41,\n 700: #5d4037,\n 800: #4e342e,\n 900: #3e2723,\n A100: #d7ccc8,\n A200: #bcaaa4,\n A400: #8d6e63,\n A700: #5d4037,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $light-primary-text,\n 400: $light-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n$mat-grey: (\n 50: #fafafa,\n 100: #f5f5f5,\n 200: #eeeeee,\n 300: #e0e0e0,\n 400: #bdbdbd,\n 500: #9e9e9e,\n 600: #757575,\n 700: #616161,\n 800: #424242,\n 900: #212121,\n A100: #ffffff,\n A200: #eeeeee,\n A400: #bdbdbd,\n A700: #616161,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $dark-primary-text,\n 500: $dark-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $dark-primary-text,\n A700: $light-primary-text,\n )\n);\n\n// Alias for alternate spelling.\n$mat-gray: $mat-grey;\n\n$mat-blue-grey: (\n 50: #eceff1,\n 100: #cfd8dc,\n 200: #b0bec5,\n 300: #90a4ae,\n 400: #78909c,\n 500: #607d8b,\n 600: #546e7a,\n 700: #455a64,\n 800: #37474f,\n 900: #263238,\n A100: #cfd8dc,\n A200: #b0bec5,\n A400: #78909c,\n A700: #455a64,\n contrast: (\n 50: $dark-primary-text,\n 100: $dark-primary-text,\n 200: $dark-primary-text,\n 300: $dark-primary-text,\n 400: $light-primary-text,\n 500: $light-primary-text,\n 600: $light-primary-text,\n 700: $light-primary-text,\n 800: $light-primary-text,\n 900: $light-primary-text,\n A100: $dark-primary-text,\n A200: $dark-primary-text,\n A400: $light-primary-text,\n A700: $light-primary-text,\n )\n);\n\n// Alias for alternate spelling.\n$mat-blue-gray: $mat-blue-grey;\n\n\n// Background palette for light themes.\n$mat-light-theme-background: (\n status-bar: map_get($mat-grey, 300),\n app-bar: map_get($mat-grey, 100),\n background: map_get($mat-grey, 50),\n hover: rgba(black, 0.04), // TODO(kara): check style with Material Design UX\n card: white,\n dialog: white,\n disabled-button: rgba(black, 0.12),\n raised-button: white,\n focused-button: $dark-focused,\n selected-button: map_get($mat-grey, 300),\n selected-disabled-button: map_get($mat-grey, 400),\n disabled-button-toggle: map_get($mat-grey, 200),\n unselected-chip: map_get($mat-grey, 300),\n disabled-list-option: map_get($mat-grey, 200),\n);\n\n// Background palette for dark themes.\n$mat-dark-theme-background: (\n status-bar: black,\n app-bar: map_get($mat-grey, 900),\n background: #303030,\n hover: rgba(white, 0.04), // TODO(kara): check style with Material Design UX\n card: map_get($mat-grey, 800),\n dialog: map_get($mat-grey, 800),\n disabled-button: rgba(white, 0.12),\n raised-button: map-get($mat-grey, 800),\n focused-button: $light-focused,\n selected-button: map_get($mat-grey, 900),\n selected-disabled-button: map_get($mat-grey, 800),\n disabled-button-toggle: black,\n unselected-chip: map_get($mat-grey, 700),\n disabled-list-option: black,\n);\n\n// Foreground palette for light themes.\n$mat-light-theme-foreground: (\n base: black,\n divider: $dark-dividers,\n dividers: $dark-dividers,\n disabled: $dark-disabled-text,\n disabled-button: rgba(black, 0.26),\n disabled-text: $dark-disabled-text,\n hint-text: $dark-disabled-text,\n secondary-text: $dark-secondary-text,\n icon: rgba(black, 0.54),\n icons: rgba(black, 0.54),\n text: rgba(black, 0.87),\n slider-min: rgba(black, 0.87),\n slider-off: rgba(black, 0.26),\n slider-off-active: rgba(black, 0.38),\n);\n\n// Foreground palette for dark themes.\n$mat-dark-theme-foreground: (\n base: white,\n divider: $light-dividers,\n dividers: $light-dividers,\n disabled: $light-disabled-text,\n disabled-button: rgba(white, 0.3),\n disabled-text: $light-disabled-text,\n hint-text: $light-disabled-text,\n secondary-text: $light-secondary-text,\n icon: white,\n icons: white,\n text: white,\n slider-min: white,\n slider-off: rgba(white, 0.3),\n slider-off-active: rgba(white, 0.3),\n);\n\n\n\n// For a given hue in a palette, return the contrast color from the map of contrast palettes.\n// @param $color-map\n// @param $hue\n@function mat-contrast($palette, $hue) {\n @return map-get(map-get($palette, contrast), $hue);\n}\n\n\n// Creates a map of hues to colors for a theme. This is used to define a theme palette in terms\n// of the Material Design hues.\n// @param $color-map\n// @param $primary\n// @param $lighter\n@function mat-palette($base-palette, $default: 500, $lighter: 100, $darker: 700) {\n $result: map_merge($base-palette, (\n default: map-get($base-palette, $default),\n lighter: map-get($base-palette, $lighter),\n darker: map-get($base-palette, $darker),\n\n default-contrast: mat-contrast($base-palette, $default),\n lighter-contrast: mat-contrast($base-palette, $lighter),\n darker-contrast: mat-contrast($base-palette, $darker)\n ));\n\n // For each hue in the palette, add a \"-contrast\" color to the map.\n @each $hue, $color in $base-palette {\n $result: map_merge($result, (\n '#{$hue}-contrast': mat-contrast($base-palette, $hue)\n ));\n }\n\n @return $result;\n}\n\n\n// Gets a color from a theme palette (the output of mat-palette).\n// The hue can be one of the standard values (500, A400, etc.), one of the three preconfigured\n// hues (default, lighter, darker), or any of the aforementioned prefixed with \"-contrast\".\n//\n// @param $color-map The theme palette (output of mat-palette).\n// @param $hue The hue from the palette to use. If this is a value between 0 and 1, it will\n// be treated as opacity.\n// @param $opacity The alpha channel value for the color.\n@function mat-color($palette, $hue: default, $opacity: null) {\n // If hueKey is a number between zero and one, then it actually contains an\n // opacity value, so recall this function with the default hue and that given opacity.\n @if type-of($hue) == number and $hue >= 0 and $hue <= 1 {\n @return mat-color($palette, default, $hue);\n }\n\n $color: map-get($palette, $hue);\n $opacity: if($opacity == null, opacity($color), $opacity);\n\n @return rgba($color, $opacity);\n}\n\n\n// Creates a container object for a light theme to be given to individual component theme mixins.\n@function mat-light-theme($primary, $accent, $warn: mat-palette($mat-red)) {\n @return (\n primary: $primary,\n accent: $accent,\n warn: $warn,\n is-dark: false,\n foreground: $mat-light-theme-foreground,\n background: $mat-light-theme-background,\n );\n}\n\n\n// Creates a container object for a dark theme to be given to individual component theme mixins.\n@function mat-dark-theme($primary, $accent, $warn: mat-palette($mat-red)) {\n @return (\n primary: $primary,\n accent: $accent,\n warn: $warn,\n is-dark: true,\n foreground: $mat-dark-theme-foreground,\n background: $mat-dark-theme-background,\n );\n}\n\n\n\n$mat-ripple-color-opacity: 0.1;\n\n@mixin mat-ripple() {\n // The host element of an mat-ripple directive should always have a position of \"absolute\" or\n // \"relative\" so that the ripple divs it creates inside itself are correctly positioned.\n .mat-ripple {\n overflow: hidden;\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 transform: scale(0);\n\n // In high contrast mode the ripple is opaque, causing it to obstruct the content.\n @include cdk-high-contrast {\n display: none;\n }\n }\n}\n\n/* Theme for the ripple elements.*/\n@mixin mat-ripple-theme($theme) {\n $foreground: map_get($theme, foreground);\n $foreground-base: map_get($foreground, base);\n\n .mat-ripple-element {\n background-color: rgba($foreground-base, $mat-ripple-color-opacity);\n }\n}\n\n\n\n// Utility for fetching a nested value from a typography config.\n@function _mat-get-type-value($config, $level, $name) {\n @return map-get(map-get($config, $level), $name);\n}\n\n// Gets the font size for a level inside a typography config.\n@function mat-font-size($config, $level) {\n @return _mat-get-type-value($config, $level, font-size);\n}\n\n// Gets the line height for a level inside a typography config.\n@function mat-line-height($config, $level) {\n @return _mat-get-type-value($config, $level, line-height);\n}\n\n// Gets the font weight for a level inside a typography config.\n@function mat-font-weight($config, $level) {\n @return _mat-get-type-value($config, $level, font-weight);\n}\n\n// Gets the letter spacing for a level inside a typography config.\n@function mat-letter-spacing($config, $level) {\n @return _mat-get-type-value($config, $level, letter-spacing);\n}\n\n// Gets the font-family from a typography config and removes the quotes around it.\n@function mat-font-family($config, $level: null) {\n $font-family: map-get($config, font-family);\n\n @if $level != null {\n $font-family: _mat-get-type-value($config, $level, font-family);\n }\n\n @return if($font-family == null, $font-family, unquote($font-family));\n}\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@mixin mat-typography-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. Note\n // that we need to use interpolation for `font-size/line-height` in order to prevent\n // Sass from dividing the two values.\n font: $font-weight #{$font-size}/#{$line-height} $font-family;\n }\n}\n\n// Converts a typography level into CSS styles.\n@mixin mat-typography-level-to-styles($config, $level) {\n $font-size: mat-font-size($config, $level);\n $font-weight: mat-font-weight($config, $level);\n $line-height: mat-line-height($config, $level);\n $font-family: mat-font-family($config, $level);\n\n @include mat-typography-font-shorthand($font-size, $font-weight, $line-height, $font-family);\n letter-spacing: mat-letter-spacing($config, $level);\n}\n\n\n@mixin mat-option-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n\n .mat-option {\n color: mat-color($foreground, text);\n\n &:hover:not(.mat-option-disabled),\n &:focus:not(.mat-option-disabled) {\n background: mat-color($background, hover);\n }\n\n // In multiple mode there is a checkbox to show that the option is selected.\n &.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {\n background: mat-color($background, hover);\n }\n\n &.mat-active {\n background: mat-color($background, hover);\n color: mat-color($foreground, text);\n }\n\n &.mat-option-disabled {\n color: mat-color($foreground, hint-text);\n }\n }\n\n .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {\n color: mat-color($primary);\n }\n\n .mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {\n color: mat-color($accent);\n }\n\n .mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {\n color: mat-color($warn);\n }\n}\n\n@mixin mat-option-typography($config) {\n .mat-option {\n font: {\n family: mat-font-family($config, subheading-2);\n size: mat-font-size($config, subheading-2);\n }\n }\n}\n\n\n\n\n\n@mixin mat-optgroup-theme($theme) {\n $foreground: map-get($theme, foreground);\n\n .mat-optgroup-label {\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-optgroup-disabled .mat-optgroup-label {\n color: mat-color($foreground, hint-text);\n }\n}\n\n@mixin mat-optgroup-typography($config) {\n .mat-optgroup-label {\n @include mat-typography-level-to-styles($config, body-2);\n }\n}\n\n\n\n@mixin mat-pseudo-checkbox-theme($theme) {\n $is-dark-theme: map-get($theme, is-dark);\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n\n // NOTE(traviskaufman): While the spec calls for translucent blacks/whites for disabled colors,\n // this does not work well with elements layered on top of one another. To get around this we\n // blend the colors together based on the base color and the theme background.\n $white-30pct-opacity-on-dark: #686868;\n $black-26pct-opacity-on-light: #b0b0b0;\n $disabled-color: if($is-dark-theme, $white-30pct-opacity-on-dark, $black-26pct-opacity-on-light);\n $colored-box-selector: '.mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate';\n\n .mat-pseudo-checkbox {\n color: mat-color(map-get($theme, foreground), secondary-text);\n\n &::after {\n color: mat-color($background, background);\n }\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.\n .mat-pseudo-checkbox-checked,\n .mat-pseudo-checkbox-indeterminate,\n .mat-accent .mat-pseudo-checkbox-checked,\n .mat-accent .mat-pseudo-checkbox-indeterminate {\n background: mat-color(map-get($theme, accent));\n }\n\n .mat-primary .mat-pseudo-checkbox-checked,\n .mat-primary .mat-pseudo-checkbox-indeterminate {\n background: mat-color(map-get($theme, primary));\n }\n\n .mat-warn .mat-pseudo-checkbox-checked,\n .mat-warn .mat-pseudo-checkbox-indeterminate {\n background: mat-color(map-get($theme, warn));\n }\n\n .mat-pseudo-checkbox-checked,\n .mat-pseudo-checkbox-indeterminate {\n &.mat-pseudo-checkbox-disabled {\n background: $disabled-color;\n }\n }\n}\n\n\n\n// Represents a typography level from the Material design spec.\n@function mat-typography-level(\n $font-size,\n $line-height: $font-size,\n $font-weight: 400,\n $font-family: null,\n $letter-spacing: null) {\n\n @return (\n font-size: $font-size,\n line-height: $line-height,\n font-weight: $font-weight,\n font-family: $font-family,\n letter-spacing: $letter-spacing\n );\n}\n\n// Represents a collection of typography levels.\n// Defaults come from https://material.io/guidelines/style/typography.html\n@function mat-typography-config(\n $font-family: 'Roboto, \"Helvetica Neue\", sans-serif',\n $display-4: mat-typography-level(112px, 112px, 300),\n $display-3: mat-typography-level(56px, 56px, 400),\n $display-2: mat-typography-level(45px, 48px, 400),\n $display-1: mat-typography-level(34px, 40px, 400),\n $headline: mat-typography-level(24px, 32px, 400),\n $title: mat-typography-level(20px, 32px, 500),\n $subheading-2: mat-typography-level(16px, 28px, 400),\n $subheading-1: mat-typography-level(15px, 24px, 400),\n $body-2: mat-typography-level(14px, 24px, 500),\n $body-1: mat-typography-level(14px, 20px, 400),\n $caption: mat-typography-level(12px, 20px, 400),\n $button: mat-typography-level(14px, 14px, 500),\n // Line-height must be unit-less fraction of the font-size.\n $input: mat-typography-level(inherit, 1.125, 400)\n) {\n\n // Declare an initial map with all of the levels.\n $config: (\n display-4: $display-4,\n display-3: $display-3,\n display-2: $display-2,\n display-1: $display-1,\n headline: $headline,\n title: $title,\n subheading-2: $subheading-2,\n subheading-1: $subheading-1,\n body-2: $body-2,\n body-1: $body-1,\n caption: $caption,\n button: $button,\n input: $input,\n );\n\n // Loop through the levels and set the `font-family` of the ones that don't have one to the base.\n // Note that Sass can't modify maps in place, which means that we need to merge and re-assign.\n @each $key, $level in $config {\n @if map-get($level, font-family) == null {\n $new-level: map-merge($level, (font-family: $font-family));\n $config: map-merge($config, ($key: $new-level));\n }\n }\n\n // Add the base font family to the config.\n @return map-merge($config, (font-family: $font-family));\n}\n\n// Adds the base typography styles, based on a config.\n@mixin mat-base-typography($config, $selector: '.mat-typography') {\n .mat-h1, .mat-headline, #{$selector} h1 {\n @include mat-typography-level-to-styles($config, headline);\n margin: 0 0 16px;\n }\n\n .mat-h2, .mat-title, #{$selector} h2 {\n @include mat-typography-level-to-styles($config, title);\n margin: 0 0 16px;\n }\n\n .mat-h3, .mat-subheading-2, #{$selector} h3 {\n @include mat-typography-level-to-styles($config, subheading-2);\n margin: 0 0 16px;\n }\n\n .mat-h4, .mat-subheading-1, #{$selector} h4 {\n @include mat-typography-level-to-styles($config, subheading-1);\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, #{$selector} h5 {\n @include mat-typography-font-shorthand(\n mat-font-size($config, body-1) * 0.83,\n mat-font-weight($config, body-1),\n mat-line-height($config, body-1),\n mat-font-family($config, body-1)\n );\n\n margin: 0 0 12px;\n }\n\n .mat-h6, #{$selector} h6 {\n @include mat-typography-font-shorthand(\n mat-font-size($config, body-1) * 0.67,\n mat-font-weight($config, body-1),\n mat-line-height($config, body-1),\n mat-font-family($config, body-1)\n );\n\n margin: 0 0 12px;\n }\n\n .mat-body-strong, .mat-body-2 {\n @include mat-typography-level-to-styles($config, body-2);\n }\n\n .mat-body, .mat-body-1, #{$selector} {\n @include mat-typography-level-to-styles($config, body-1);\n\n p {\n margin: 0 0 12px;\n }\n }\n\n .mat-small, .mat-caption {\n @include mat-typography-level-to-styles($config, caption);\n }\n\n // Note: The spec doesn't mention letter spacing. The value comes from\n // eyeballing it until it looked exactly like the spec examples.\n .mat-display-4, #{$selector} .mat-display-4 {\n @include mat-typography-level-to-styles($config, display-4);\n margin: 0 0 56px;\n letter-spacing: -0.05em;\n }\n\n .mat-display-3, #{$selector} .mat-display-3 {\n @include mat-typography-level-to-styles($config, display-3);\n margin: 0 0 64px;\n letter-spacing: -0.02em;\n }\n\n .mat-display-2, #{$selector} .mat-display-2 {\n @include mat-typography-level-to-styles($config, display-2);\n margin: 0 0 64px;\n letter-spacing: -0.005em;\n }\n\n .mat-display-1, #{$selector} .mat-display-1 {\n @include mat-typography-level-to-styles($config, display-1);\n margin: 0 0 64px;\n }\n}\n\n\n\n@mixin mat-autocomplete-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n\n .mat-autocomplete-panel {\n background: mat-color($background, card);\n color: mat-color($foreground, text);\n\n // Selected options in autocompletes should not be gray, but we\n // only want to override the background for selected options if\n // they are *not* in hover or focus state. This change has to be\n // made here because base option styles are shared between the\n // autocomplete and the select.\n .mat-option.mat-selected:not(.mat-active):not(:hover) {\n background: mat-color($background, card);\n\n &:not(.mat-option-disabled) {\n color: mat-color($foreground, text);\n }\n }\n }\n\n}\n\n@mixin mat-autocomplete-typography($config) { }\n\n// This contains all of the styles for the badge\n// rather than just the color/theme because of\n// no style sheet support for directives.\n\n\n\n\n\n$mat-badge-font-size: 12px;\n$mat-badge-font-weight: 600;\n$mat-badge-default-size: 22px !default;\n$mat-badge-small-size: $mat-badge-default-size - 6;\n$mat-badge-large-size: $mat-badge-default-size + 6;\n\n// Mixin for building offset given different sizes\n@mixin _mat-badge-size($size) {\n .mat-badge-content {\n width: $size;\n height: $size;\n line-height: $size;\n\n @include cdk-high-contrast {\n outline: solid 1px;\n border-radius: 0;\n }\n }\n\n &.mat-badge-above {\n .mat-badge-content {\n top: -$size / 2;\n }\n }\n\n &.mat-badge-below {\n .mat-badge-content {\n bottom: -$size / 2;\n }\n }\n\n &.mat-badge-before {\n .mat-badge-content {\n left: -$size;\n }\n }\n\n [dir='rtl'] &.mat-badge-before {\n .mat-badge-content {\n left: auto;\n right: -$size;\n }\n }\n\n &.mat-badge-after {\n .mat-badge-content {\n right: -$size;\n }\n }\n\n [dir='rtl'] &.mat-badge-after {\n .mat-badge-content {\n right: auto;\n left: -$size;\n }\n }\n\n &.mat-badge-overlap {\n &.mat-badge-before {\n .mat-badge-content {\n left: -$size / 2;\n }\n }\n\n [dir='rtl'] &.mat-badge-before {\n .mat-badge-content {\n left: auto;\n right: -$size / 2;\n }\n }\n\n &.mat-badge-after {\n .mat-badge-content {\n right: -$size / 2;\n }\n }\n\n [dir='rtl'] &.mat-badge-after {\n .mat-badge-content {\n right: auto;\n left: -$size / 2;\n }\n }\n }\n}\n\n@mixin mat-badge-theme($theme) {\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $primary: map-get($theme, primary);\n\n .mat-badge-content {\n color: mat-color($primary, default-contrast);\n background: mat-color($primary);\n }\n\n .mat-badge-accent {\n .mat-badge-content {\n background: mat-color($accent);\n color: mat-color($accent, default-contrast);\n }\n }\n\n .mat-badge-warn {\n .mat-badge-content {\n color: mat-color($warn, default-contrast);\n background: mat-color($warn);\n }\n }\n\n .mat-badge {\n position: relative;\n }\n\n .mat-badge-hidden {\n .mat-badge-content {\n display: none;\n }\n }\n\n .mat-badge-content {\n position: absolute;\n text-align: center;\n display: inline-block;\n border-radius: 50%;\n transition: transform 200ms ease-in-out;\n transform: scale(0.6);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n pointer-events: none;\n }\n\n // The active class is added after the element is added\n // so it can animate scale to default\n .mat-badge-content.mat-badge-active {\n // Scale to `none` instead of `1` to avoid blurry text in some browsers.\n transform: none;\n }\n\n .mat-badge-small {\n @include _mat-badge-size($mat-badge-small-size);\n }\n .mat-badge-medium {\n @include _mat-badge-size($mat-badge-default-size);\n }\n .mat-badge-large {\n @include _mat-badge-size($mat-badge-large-size);\n }\n}\n\n@mixin mat-badge-typography($config) {\n .mat-badge-content {\n font-weight: $mat-badge-font-weight;\n font-size: $mat-badge-font-size;\n font-family: mat-font-family($config);\n }\n\n .mat-badge-small .mat-badge-content {\n font-size: $mat-badge-font-size / 2;\n }\n\n .mat-badge-large .mat-badge-content {\n font-size: $mat-badge-font-size * 2;\n }\n}\n\n\n\n\n@mixin mat-bottom-sheet-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-bottom-sheet-container {\n background: mat-color($background, dialog);\n color: mat-color($foreground, text);\n }\n}\n\n@mixin mat-bottom-sheet-typography($config) {\n .mat-bottom-sheet-container {\n // Note: we don't use the line-height, because it's way too big.\n font-family: mat-font-family($config);\n font-size: mat-font-size($config, subheading-2);\n font-weight: mat-font-weight($config, subheading-2);\n }\n}\n\n\n\n\n// Applies a focus style to an mat-button element for each of the supported palettes.\n@mixin _mat-button-focus-overlay-color($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n\n &.mat-primary .mat-button-focus-overlay {\n background-color: mat-color($primary, 0.12);\n }\n\n &.mat-accent .mat-button-focus-overlay {\n background-color: mat-color($accent, 0.12);\n }\n\n &.mat-warn .mat-button-focus-overlay {\n background-color: mat-color($warn, 0.12);\n }\n\n &[disabled] .mat-button-focus-overlay {\n background-color: transparent;\n }\n}\n\n@mixin _mat-button-ripple-color($theme, $hue, $opacity: 0.1) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n\n &.mat-primary .mat-ripple-element {\n background-color: mat-color($primary, $hue, $opacity);\n }\n\n &.mat-accent .mat-ripple-element {\n background-color: mat-color($accent, $hue, $opacity);\n }\n\n &.mat-warn .mat-ripple-element {\n background-color: mat-color($warn, $hue, $opacity);\n }\n}\n\n// Applies a property to an mat-button element for each of the supported palettes.\n@mixin _mat-button-theme-property($theme, $property, $hue) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n &.mat-primary {\n #{$property}: mat-color($primary, $hue);\n }\n &.mat-accent {\n #{$property}: mat-color($accent, $hue);\n }\n &.mat-warn {\n #{$property}: mat-color($warn, $hue);\n }\n\n &.mat-primary, &.mat-accent, &.mat-warn, &[disabled] {\n &[disabled] {\n $palette: if($property == 'color', $foreground, $background);\n #{$property}: mat-color($palette, disabled-button);\n }\n }\n}\n\n@mixin mat-button-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-button, .mat-icon-button, .mat-stroked-button {\n // Buttons without a background color should inherit the font color. This is necessary to\n // ensure that the button is readable on custom background colors. It's wrong to always assume\n // that those buttons are always placed inside of containers with the default background\n // color of the theme (e.g. themed toolbars).\n color: inherit;\n background: transparent;\n\n @include _mat-button-theme-property($theme, 'color', default);\n @include _mat-button-focus-overlay-color($theme);\n\n // Setup the ripple color to be based on the color palette. The opacity can be a bit weaker\n // than for icon-buttons, because normal and stroked buttons have a focus overlay.\n @include _mat-button-ripple-color($theme, default);\n }\n\n .mat-flat-button, .mat-raised-button, .mat-fab, .mat-mini-fab {\n // Default font and background color when not using any color palette.\n color: mat-color($foreground, text);\n background-color: mat-color($background, raised-button);\n\n @include _mat-button-theme-property($theme, 'color', default-contrast);\n @include _mat-button-theme-property($theme, 'background-color', default);\n @include _mat-button-ripple-color($theme, default-contrast);\n }\n\n // Since icon buttons don't have a focus overlay, the ripple opacity should be the higher\n // than the default value.\n .mat-icon-button {\n @include _mat-button-ripple-color($theme, default, 0.2);\n }\n}\n\n@mixin mat-button-typography($config) {\n .mat-button, .mat-raised-button, .mat-icon-button, .mat-stroked-button,\n .mat-flat-button, .mat-fab, .mat-mini-fab {\n font: {\n family: mat-font-family($config, button);\n size: mat-font-size($config, button);\n weight: mat-font-weight($config, button);\n }\n }\n}\n\n\n\n\n\n@mixin mat-button-toggle-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n\n .mat-button-toggle {\n color: mat-color($foreground, hint-text);\n\n .mat-button-toggle-focus-overlay {\n background-color: mat-color($background, focused-button);\n }\n }\n\n .mat-button-toggle-checked {\n background-color: mat-color($background, selected-button);\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-button-toggle-disabled {\n background-color: mat-color($background, disabled-button-toggle);\n color: mat-color($foreground, disabled-button);\n\n &.mat-button-toggle-checked {\n background-color: mat-color($background, selected-disabled-button);\n }\n }\n}\n\n@mixin mat-button-toggle-typography($config) {\n .mat-button-toggle {\n font-family: mat-font-family($config);\n }\n}\n\n\n\n\n\n\n@mixin mat-card-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-card {\n background: mat-color($background, card);\n color: mat-color($foreground, text);\n }\n\n .mat-card-subtitle {\n color: mat-color($foreground, secondary-text);\n }\n}\n\n@mixin mat-card-typography($config) {\n .mat-card {\n font-family: mat-font-family($config);\n }\n\n .mat-card-title {\n font: {\n size: mat-font-size($config, headline);\n weight: mat-font-weight($config, headline);\n }\n }\n\n .mat-card-subtitle,\n .mat-card-content,\n .mat-card-header .mat-card-title {\n font-size: mat-font-size($config, body-1);\n }\n}\n\n\n\n\n\n\n@mixin mat-checkbox-theme($theme) {\n $is-dark-theme: map-get($theme, is-dark);\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n\n\n // The color of the checkbox's checkmark / mixedmark.\n $checkbox-mark-color: mat-color($background, background);\n\n // NOTE(traviskaufman): While the spec calls for translucent blacks/whites for disabled colors,\n // this does not work well with elements layered on top of one another. To get around this we\n // blend the colors together based on the base color and the theme background.\n $white-30pct-opacity-on-dark: #686868;\n $black-26pct-opacity-on-light: #b0b0b0;\n $disabled-color: if($is-dark-theme, $white-30pct-opacity-on-dark, $black-26pct-opacity-on-light);\n\n .mat-checkbox-frame {\n border-color: mat-color(map-get($theme, foreground), secondary-text);\n }\n\n .mat-checkbox-checkmark {\n fill: $checkbox-mark-color;\n }\n\n .mat-checkbox-checkmark-path {\n // !important is needed here because a stroke must be set as an\n // attribute on the SVG in order for line animation to work properly.\n stroke: $checkbox-mark-color !important;\n\n @include cdk-high-contrast(black-on-white) {\n // Having the one above be !important ends up overriding the browser's automatic\n // color inversion so we need to re-invert it ourselves for black-on-white.\n stroke: #000 !important;\n }\n }\n\n .mat-checkbox-mixedmark {\n background-color: $checkbox-mark-color;\n }\n\n .mat-checkbox-indeterminate, .mat-checkbox-checked {\n &.mat-primary .mat-checkbox-background {\n background-color: mat-color($primary);\n }\n\n &.mat-accent .mat-checkbox-background {\n background-color: mat-color($accent);\n }\n\n &.mat-warn .mat-checkbox-background {\n background-color: mat-color($warn);\n }\n }\n\n .mat-checkbox-disabled {\n &.mat-checkbox-checked, &.mat-checkbox-indeterminate {\n .mat-checkbox-background {\n background-color: $disabled-color;\n }\n }\n\n &:not(.mat-checkbox-checked) {\n .mat-checkbox-frame {\n border-color: $disabled-color;\n }\n }\n\n .mat-checkbox-label {\n color: $disabled-color;\n }\n\n @include cdk-high-contrast {\n opacity: 0.5;\n }\n }\n\n // This one is moved down here so it can target both\n // the theme colors and the disabled state.\n @include cdk-high-contrast {\n .mat-checkbox-background {\n // Needs to be removed because it hides the checkbox outline.\n background: none;\n }\n }\n\n .mat-checkbox:not(.mat-checkbox-disabled) {\n &.mat-primary .mat-checkbox-ripple .mat-ripple-element {\n background-color: mat-color($primary, 0.26);\n }\n\n &.mat-accent .mat-checkbox-ripple .mat-ripple-element {\n background-color: mat-color($accent, 0.26);\n }\n\n &.mat-warn .mat-checkbox-ripple .mat-ripple-element {\n background-color: mat-color($warn, 0.26);\n }\n }\n}\n\n@mixin mat-checkbox-typography($config) {\n .mat-checkbox {\n font-family: mat-font-family($config);\n }\n\n // TODO(kara): Remove this style when fixing vertical baseline\n .mat-checkbox-layout .mat-checkbox-label {\n line-height: mat-line-height($config, body-2);\n }\n}\n\n\n\n\n\n// TODO(crisbeto): these values don't correspond to any of the typography breakpoints.\n$mat-chip-font-size: 13px;\n$mat-chip-line-height: 18px;\n$mat-chip-remove-font-size: 18px;\n\n@mixin mat-chips-theme-color($color) {\n @include mat-chips-color(mat-color($color, default-contrast), mat-color($color));\n}\n\n@mixin mat-chips-color($foreground, $background) {\n background-color: $background;\n color: $foreground;\n\n .mat-chip-remove {\n color: $foreground;\n opacity: 0.4;\n }\n\n .mat-chip-remove:hover {\n opacity: 0.54;\n }\n}\n\n@mixin mat-chips-theme($theme) {\n $is-dark-theme: map-get($theme, is-dark);\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n $unselected-background: mat-color($background, unselected-chip);\n $unselected-foreground: mat-color($foreground, text);\n\n\n .mat-chip.mat-standard-chip {\n @include mat-chips-color($unselected-foreground, $unselected-background);\n }\n\n .mat-chip.mat-standard-chip.mat-chip-selected {\n\n &.mat-primary {\n @include mat-chips-theme-color($primary);\n }\n\n &.mat-warn {\n @include mat-chips-theme-color($warn);\n }\n\n &.mat-accent {\n @include mat-chips-theme-color($accent);\n }\n }\n}\n\n@mixin mat-chips-typography($config) {\n .mat-chip {\n font-size: $mat-chip-font-size;\n line-height: $mat-chip-line-height;\n\n .mat-chip-trailing-icon.mat-icon,\n .mat-chip-remove.mat-icon {\n font-size: $mat-chip-remove-font-size;\n }\n }\n}\n\n\n\n\n\n@mixin mat-table-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-table {\n background: mat-color($background, 'card');\n }\n\n .mat-table thead, .mat-table tbody, .mat-table tfoot,\n mat-header-row, mat-row, mat-footer-row,\n [mat-header-row], [mat-row], [mat-footer-row],\n .mat-table-sticky {\n background: inherit;\n }\n\n mat-row, mat-header-row, mat-footer-row,\n th.mat-header-cell, td.mat-cell, td.mat-footer-cell {\n border-bottom-color: mat-color($foreground, divider);\n }\n\n .mat-header-cell {\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-cell, .mat-footer-cell {\n color: mat-color($foreground, text);\n }\n}\n\n@mixin mat-table-typography($config) {\n .mat-table {\n font-family: mat-font-family($config);\n }\n\n .mat-header-cell {\n font-size: mat-font-size($config, caption);\n font-weight: mat-font-weight($config, body-2);\n }\n\n .mat-cell, .mat-footer-cell {\n font-size: mat-font-size($config, body-1);\n }\n}\n\n\n\n\n\n\n$mat-datepicker-selected-today-box-shadow-width: 1px;\n$mat-datepicker-selected-fade-amount: 0.6;\n$mat-datepicker-today-fade-amount: 0.2;\n$mat-calendar-body-font-size: 13px !default;\n$mat-calendar-weekday-table-font-size: 11px !default;\n\n@mixin _mat-datepicker-color($palette) {\n .mat-calendar-body-selected {\n background-color: mat-color($palette);\n color: mat-color($palette, default-contrast);\n }\n\n .mat-calendar-body-disabled > .mat-calendar-body-selected {\n background-color: fade-out(mat-color($palette), $mat-datepicker-selected-fade-amount);\n }\n\n .mat-calendar-body-today.mat-calendar-body-selected {\n box-shadow: inset 0 0 0 $mat-datepicker-selected-today-box-shadow-width\n mat-color($palette, default-contrast);\n }\n}\n\n@mixin mat-datepicker-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n\n .mat-calendar-arrow {\n border-top-color: mat-color($foreground, icon);\n }\n\n // The prev/next buttons need a bit more specificity to\n // avoid being overwritten by the .mat-icon-button.\n .mat-datepicker-toggle,\n .mat-datepicker-content .mat-calendar-next-button,\n .mat-datepicker-content .mat-calendar-previous-button {\n color: mat-color($foreground, icon);\n }\n\n .mat-calendar-table-header {\n color: mat-color($foreground, hint-text);\n }\n\n .mat-calendar-table-header-divider::after {\n background: mat-color($foreground, divider);\n }\n\n .mat-calendar-body-label {\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-calendar-body-cell-content {\n color: mat-color($foreground, text);\n border-color: transparent;\n }\n\n .mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {\n color: mat-color($foreground, disabled-text);\n }\n\n .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover,\n .cdk-keyboard-focused .mat-calendar-body-active,\n .cdk-program-focused .mat-calendar-body-active {\n & > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {\n background-color: mat-color($background, hover);\n }\n }\n\n .mat-calendar-body-today:not(.mat-calendar-body-selected) {\n // Note: though it's not text, the border is a hint about the fact that this is today's date,\n // so we use the hint color.\n border-color: mat-color($foreground, hint-text);\n }\n\n .mat-calendar-body-disabled > .mat-calendar-body-today:not(.mat-calendar-body-selected) {\n border-color: fade-out(mat-color($foreground, hint-text), $mat-datepicker-today-fade-amount);\n }\n\n @include _mat-datepicker-color(map-get($theme, primary));\n\n .mat-datepicker-content {\n background-color: mat-color($background, card);\n color: mat-color($foreground, text);\n\n &.mat-accent {\n @include _mat-datepicker-color(map-get($theme, accent));\n }\n\n &.mat-warn {\n @include _mat-datepicker-color(map-get($theme, warn));\n }\n }\n\n .mat-datepicker-toggle-active {\n color: mat-color(map-get($theme, primary));\n\n &.mat-accent {\n color: mat-color(map-get($theme, accent));\n }\n\n &.mat-warn {\n color: mat-color(map-get($theme, warn));\n }\n }\n}\n\n@mixin mat-datepicker-typography($config) {\n .mat-calendar {\n font-family: mat-font-family($config);\n }\n\n .mat-calendar-body {\n font-size: $mat-calendar-body-font-size;\n }\n\n .mat-calendar-body-label,\n .mat-calendar-period-button {\n font: {\n size: mat-font-size($config, button);\n weight: mat-font-weight($config, button);\n }\n }\n\n .mat-calendar-table-header th {\n font: {\n size: $mat-calendar-weekday-table-font-size;\n weight: mat-font-weight($config, body-1);\n }\n }\n}\n\n\n\n\n\n\n@mixin mat-dialog-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-dialog-container {\n background: mat-color($background, dialog);\n color: mat-color($foreground, text);\n }\n}\n\n@mixin mat-dialog-typography($config) {\n .mat-dialog-title {\n @include mat-typography-level-to-styles($config, title);\n }\n}\n\n\n\n\n\n@mixin mat-expansion-panel-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-expansion-panel {\n background: mat-color($background, card);\n color: mat-color($foreground, text);\n }\n\n .mat-action-row {\n border-top-color: mat-color($foreground, divider);\n }\n\n .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header {\n &:not([aria-disabled='true']) {\n &.cdk-keyboard-focused,\n &.cdk-program-focused,\n &:hover {\n background: mat-color($background, hover);\n }\n }\n }\n\n // Disable the hover on touch devices since it can appear like it is stuck. We can't use\n // `@media (hover)` above, because the desktop support browser support isn't great.\n @media (hover: none) {\n .mat-expansion-panel:not(.mat-expanded):not([aria-disabled='true'])\n .mat-expansion-panel-header:hover {\n background: mat-color($background, card);\n }\n }\n\n .mat-expansion-panel-header-title {\n color: mat-color($foreground, text);\n }\n\n .mat-expansion-panel-header-description,\n .mat-expansion-indicator::after {\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-expansion-panel-header[aria-disabled='true'] {\n color: mat-color($foreground, disabled-button);\n\n .mat-expansion-panel-header-title,\n .mat-expansion-panel-header-description {\n color: inherit;\n }\n }\n}\n\n@mixin mat-expansion-panel-typography($config) {\n .mat-expansion-panel-header {\n font: {\n family: mat-font-family($config, subheading-1);\n size: mat-font-size($config, subheading-1);\n weight: mat-font-weight($config, subheading-1);\n }\n }\n\n .mat-expansion-panel-content {\n @include mat-typography-level-to-styles($config, body-1);\n }\n}\n\n\n\n\n// This mixin will ensure that lines that overflow the container will hide the overflow and\n// truncate neatly with an ellipsis.\n@mixin mat-truncate-line() {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n// Mixin to provide all mat-line styles, changing secondary font size based on whether the list\n// is in dense mode.\n@mixin mat-line-base($secondary-font-size) {\n .mat-line {\n @include mat-truncate-line();\n display: block;\n box-sizing: border-box;\n\n // all lines but the top line should have smaller text\n &:nth-child(n+2) {\n font-size: $secondary-font-size;\n }\n }\n}\n\n// This mixin normalizes default element styles, e.g. font weight for heading text.\n@mixin mat-normalize-text() {\n & > * {\n margin: 0;\n padding: 0;\n font-weight: normal;\n font-size: inherit;\n }\n}\n\n// This mixin provides base styles for the wrapper around mat-line elements in a list.\n@mixin mat-line-wrapper-base() {\n @include mat-normalize-text();\n\n display: flex;\n flex-direction: column;\n width: 100%;\n box-sizing: border-box;\n overflow: hidden;\n\n // Must remove wrapper when lines are empty or it takes up horizontal\n // space and pushes other elements to the right.\n &:empty {\n display: none;\n }\n}\n\n\n\n// Include this empty mixin for consistency with the other components.\n@mixin mat-grid-list-theme($theme) { }\n\n@mixin mat-grid-list-typography($config) {\n .mat-grid-tile-header,\n .mat-grid-tile-footer {\n @include mat-line-base(mat-font-size($config, caption));\n font-size: mat-font-size($config, body-1);\n }\n}\n\n\n\n\n// Include this empty mixin for consistency with the other components.\n@mixin mat-icon-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-icon {\n &.mat-primary {\n color: mat-color($primary);\n }\n\n &.mat-accent {\n color: mat-color($accent);\n }\n\n &.mat-warn {\n color: mat-color($warn);\n }\n }\n}\n\n@mixin mat-icon-typography($config) { }\n\n\n\n\n\n// Renders a gradient for showing the dashed line when the input is disabled.\n// Unlike using a border, a gradient allows us to adjust the spacing of the dotted line\n// to match the Material Design spec.\n@mixin mat-control-disabled-underline($color) {\n background-image: linear-gradient(to right, $color 0%, $color 33%, transparent 0%);\n background-size: 4px 100%;\n background-repeat: repeat-x;\n}\n\n// Figures out the color of the placeholder for a form control.\n// Used primarily to prevent the various form controls from\n// becoming out of sync since these colors aren't in a palette.\n@function _mat-control-placeholder-color($theme) {\n $foreground: map-get($theme, foreground);\n $is-dark-theme: map-get($theme, is-dark);\n @return mat-color($foreground, secondary-text, if($is-dark-theme, 0.5, 0.42));\n}\n\n\n/* stylelint-disable material/no-prefixes */\n@mixin user-select($value) {\n -webkit-user-select: $value;\n -moz-user-select: $value;\n -ms-user-select: $value;\n user-select: $value;\n}\n\n@mixin input-placeholder {\n &::placeholder {\n @content;\n }\n\n &::-moz-placeholder {\n @content;\n }\n\n &::-webkit-input-placeholder {\n @content;\n }\n\n &:-ms-input-placeholder {\n @content;\n }\n}\n\n@mixin cursor-grab {\n cursor: -webkit-grab;\n cursor: grab;\n}\n\n@mixin cursor-grabbing {\n cursor: -webkit-grabbing;\n cursor: grabbing;\n}\n\n@mixin backface-visibility($value) {\n -webkit-backface-visibility: $value;\n backface-visibility: $value;\n}\n/* stylelint-enable */\n\n\n\n@mixin mat-input-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $foreground: map-get($theme, foreground);\n\n .mat-input-element:disabled {\n color: mat-color($foreground, disabled-text);\n }\n\n .mat-input-element {\n caret-color: mat-color($primary);\n\n @include input-placeholder {\n color: _mat-control-placeholder-color($theme);\n }\n }\n\n .mat-accent .mat-input-element {\n caret-color: mat-color($accent);\n }\n\n .mat-warn .mat-input-element,\n .mat-form-field-invalid .mat-input-element {\n caret-color: mat-color($warn);\n }\n}\n\n@mixin mat-input-typography($config) {\n // The unit-less line-height from the font config.\n $line-height: mat-line-height($config, input);\n\n // The amount of space between the top of the line and the top of the actual text\n // (as a fraction of the font-size).\n $line-spacing: ($line-height - 1) / 2;\n\n // <input> elements seem to have their height set slightly too large on Safari causing the text to\n // be misaligned w.r.t. the placeholder. Adding this margin corrects it.\n input.mat-input-element {\n margin-top: -$line-spacing * 1em;\n }\n}\n\n\n\n\n\n\n\n@mixin mat-list-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-list, .mat-nav-list, .mat-selection-list {\n .mat-list-item {\n color: mat-color($foreground, text);\n }\n\n .mat-list-option {\n color: mat-color($foreground, text);\n }\n\n .mat-subheader {\n color: mat-color($foreground, secondary-text);\n }\n }\n\n .mat-list-item-disabled {\n background-color: mat-color($background, disabled-list-option);\n }\n\n .mat-list-option,\n .mat-nav-list .mat-list-item {\n &:hover, &.mat-list-item-focus {\n background: mat-color($background, 'hover');\n }\n }\n}\n\n@mixin mat-list-typography($config) {\n $font-family: mat-font-family($config);\n\n .mat-list-item {\n font-family: $font-family;\n }\n\n .mat-list-option {\n font-family: $font-family;\n }\n\n // Default list\n .mat-list, .mat-nav-list, .mat-selection-list {\n .mat-list-item {\n font-size: mat-font-size($config, subheading-2);\n @include mat-line-base(mat-font-size($config, body-1));\n }\n\n .mat-list-option {\n font-size: mat-font-size($config, subheading-2);\n @include mat-line-base(mat-font-size($config, body-1));\n }\n\n .mat-subheader {\n font-family: mat-font-family($config, body-2);\n font-size: mat-font-size($config, body-2);\n font-weight: mat-font-weight($config, body-2);\n }\n }\n\n // Dense list\n .mat-list[dense], .mat-nav-list[dense], .mat-selection-list[dense] {\n .mat-list-item {\n font-size: mat-font-size($config, caption);\n @include mat-line-base(mat-font-size($config, caption));\n }\n\n .mat-list-option {\n font-size: mat-font-size($config, caption);\n @include mat-line-base(mat-font-size($config, caption));\n }\n\n .mat-subheader {\n font-family: $font-family;\n font-size: mat-font-size($config, caption);\n font-weight: mat-font-weight($config, body-2);\n }\n }\n}\n\n\n\n\n\n\n@mixin mat-menu-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-menu-panel {\n background: mat-color($background, 'card');\n }\n\n .mat-menu-item {\n background: transparent;\n color: mat-color($foreground, 'text');\n\n &[disabled] {\n &, &::after {\n color: mat-color($foreground, 'disabled');\n }\n }\n }\n\n .mat-menu-item .mat-icon:not([color]),\n .mat-menu-item-submenu-trigger::after {\n color: mat-color($foreground, 'icon');\n }\n\n .mat-menu-item:hover,\n .mat-menu-item.cdk-program-focused,\n .mat-menu-item.cdk-keyboard-focused,\n .mat-menu-item-highlighted {\n &:not([disabled]) {\n background: mat-color($background, 'hover');\n }\n }\n}\n\n@mixin mat-menu-typography($config) {\n .mat-menu-item {\n font: {\n family: mat-font-family($config, subheading-2);\n size: mat-font-size($config, subheading-2);\n weight: mat-font-weight($config, subheading-2);\n }\n }\n}\n\n\n\n\n\n\n@mixin mat-paginator-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n\n .mat-paginator {\n background: mat-color($background, 'card');\n }\n\n .mat-paginator,\n .mat-paginator-page-size .mat-select-trigger {\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-paginator-decrement,\n .mat-paginator-increment {\n border-top: 2px solid mat-color($foreground, 'icon');\n border-right: 2px solid mat-color($foreground, 'icon');\n }\n\n .mat-paginator-first,\n .mat-paginator-last {\n border-top: 2px solid mat-color($foreground, 'icon');\n }\n\n .mat-icon-button[disabled] {\n .mat-paginator-decrement,\n .mat-paginator-increment,\n .mat-paginator-first,\n .mat-paginator-last {\n border-color: mat-color($foreground, 'disabled');\n }\n }\n}\n\n@mixin mat-paginator-typography($config) {\n .mat-paginator,\n .mat-paginator-page-size .mat-select-trigger {\n font: {\n family: mat-font-family($config, caption);\n size: mat-font-size($config, caption);\n }\n }\n}\n\n\n\n\n\n@mixin mat-progress-bar-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n\n .mat-progress-bar-background {\n fill: mat-color($primary, lighter);\n }\n\n .mat-progress-bar-buffer {\n background-color: mat-color($primary, lighter);\n }\n\n .mat-progress-bar-fill::after {\n background-color: mat-color($primary);\n }\n\n .mat-progress-bar.mat-accent {\n .mat-progress-bar-background {\n fill: mat-color($accent, lighter);\n }\n\n .mat-progress-bar-buffer {\n background-color: mat-color($accent, lighter);\n }\n\n .mat-progress-bar-fill::after {\n background-color: mat-color($accent);\n }\n }\n\n .mat-progress-bar.mat-warn {\n .mat-progress-bar-background {\n fill: mat-color($warn, lighter);\n }\n\n .mat-progress-bar-buffer {\n background-color: mat-color($warn, lighter);\n }\n\n .mat-progress-bar-fill::after {\n background-color: mat-color($warn);\n }\n }\n}\n\n@mixin mat-progress-bar-typography($config) { }\n\n\n\n\n\n\n@mixin mat-progress-spinner-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n\n .mat-progress-spinner, .mat-spinner {\n circle {\n stroke: mat-color($primary);\n }\n\n &.mat-accent circle {\n stroke: mat-color($accent);\n }\n\n &.mat-warn circle {\n stroke: mat-color($warn);\n }\n }\n}\n\n@mixin mat-progress-spinner-typography($config) { }\n\n\n\n\n\n@mixin _mat-radio-color($palette) {\n &.mat-radio-checked .mat-radio-outer-circle {\n border-color: mat-color($palette);\n }\n\n .mat-radio-inner-circle {\n background-color: mat-color($palette);\n }\n\n .mat-radio-ripple .mat-ripple-element {\n background-color: mat-color($palette, 0.26);\n }\n}\n\n@mixin mat-radio-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-radio-outer-circle {\n border-color: mat-color($foreground, secondary-text);\n }\n\n .mat-radio-button {\n &.mat-primary {\n @include _mat-radio-color($primary);\n }\n\n &.mat-accent {\n @include _mat-radio-color($accent);\n }\n\n &.mat-warn {\n @include _mat-radio-color($warn);\n }\n\n // This needs extra specificity, because the classes above are combined\n // (e.g. `.mat-radio-button.mat-accent`) which increases their specificity a lot.\n // TODO: consider making the selectors into descendants (`.mat-primary .mat-radio-button`).\n &.mat-radio-disabled {\n &.mat-radio-checked .mat-radio-outer-circle,\n .mat-radio-outer-circle {\n border-color: mat-color($foreground, disabled);\n }\n\n .mat-radio-ripple .mat-ripple-element,\n .mat-radio-inner-circle {\n background-color: mat-color($foreground, disabled);\n }\n\n .mat-radio-label-content {\n color: mat-color($foreground, disabled);\n }\n }\n }\n}\n\n@mixin mat-radio-typography($config) {\n .mat-radio-button {\n font-family: mat-font-family($config);\n }\n}\n\n\n\n\n\n\n\n@mixin mat-select-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n\n .mat-select-content, .mat-select-panel-done-animating {\n background: mat-color($background, card);\n }\n\n .mat-select-value {\n color: mat-color($foreground, text);\n }\n\n .mat-select-placeholder {\n color: _mat-control-placeholder-color($theme);\n }\n\n .mat-select-disabled .mat-select-value {\n color: mat-color($foreground, disabled-text);\n }\n\n .mat-select-arrow {\n color: mat-color($foreground, secondary-text);\n }\n\n .mat-select-panel {\n .mat-option.mat-selected:not(.mat-option-multiple) {\n background: mat-color($background, hover, 0.12);\n }\n }\n\n .mat-form-field {\n &.mat-focused {\n &.mat-primary .mat-select-arrow {\n color: mat-color($primary);\n }\n\n &.mat-accent .mat-select-arrow {\n color: mat-color($accent);\n }\n\n &.mat-warn .mat-select-arrow {\n color: mat-color($warn);\n }\n }\n\n .mat-select.mat-select-invalid .mat-select-arrow {\n color: mat-color($warn);\n }\n\n .mat-select.mat-select-disabled .mat-select-arrow {\n color: mat-color($foreground, disabled-text);\n }\n }\n}\n\n@mixin mat-select-typography($config) {\n // The unit-less line-height from the font config.\n $line-height: mat-line-height($config, input);\n\n .mat-select {\n font-family: mat-font-family($config);\n }\n\n .mat-select-trigger {\n height: $line-height * 1em;\n }\n}\n\n\n\n\n\n@mixin mat-sidenav-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n // We use invert() here to have the darken the background color expected to be used. If the\n // background is light, we use a dark backdrop. If the background is dark,\n // we use a light backdrop.\n $drawer-backdrop-color: invert(mat-color($background, card, 0.6)) !default;\n $drawer-background-color: mat-color($background, dialog) !default;\n $drawer-container-background-color: mat-color($background, background) !default;\n $drawer-push-background-color: mat-color($background, dialog) !default;\n\n .mat-drawer-container {\n background-color: $drawer-container-background-color;\n color: mat-color($foreground, text);\n }\n\n .mat-drawer {\n background-color: $drawer-background-color;\n color: mat-color($foreground, text);\n\n &.mat-drawer-push {\n background-color: $drawer-push-background-color;\n }\n }\n\n .mat-drawer-backdrop.mat-drawer-shown {\n background-color: $drawer-backdrop-color;\n }\n}\n\n@mixin mat-sidenav-typography($config) { }\n\n\n\n\n\n@mixin _mat-slide-toggle-checked($palette, $thumb-checked-hue) {\n // Do not apply the checked colors if the toggle is disabled, because the\n // specificity would be to high for the disabled styles.\n &.mat-checked:not(.mat-disabled) {\n .mat-slide-toggle-thumb {\n background-color: mat-color($palette, $thumb-checked-hue);\n }\n\n .mat-slide-toggle-bar {\n background-color: mat-color($palette, $thumb-checked-hue, 0.5);\n }\n }\n}\n\n// Applies the specified colors to the slide-toggle ripple elements.\n@mixin _mat-slide-toggle-ripple($palette, $ripple-unchecked-color, $ripple-checked-color) {\n &:not(.mat-checked) .mat-ripple-element {\n background-color: $ripple-unchecked-color;\n }\n .mat-ripple-element {\n background-color: $ripple-checked-color;\n }\n}\n\n@mixin mat-slide-toggle-theme($theme) {\n $is-dark: map_get($theme, is-dark);\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n // Color hues based on the specs, which prescribe different hues for dark and light themes\n // https://material.google.com/components/selection-controls.html#selection-controls-switch\n $thumb-normal-hue: if($is-dark, 400, 50);\n $thumb-checked-hue: if($is-dark, 200, 500);\n $thumb-disabled-hue: if($is-dark, 800, 400);\n\n $bar-normal-color: mat-color($foreground, disabled);\n $bar-disabled-color: if($is-dark, rgba(white, 0.12), rgba(black, 0.1));\n\n // Ripple colors are based on the current palette and the state of the slide-toggle.\n // See https://material.google.com/components/selection-controls.html#selection-controls-switch\n $ripple-checked-opacity: 0.12;\n $ripple-unchecked-color: mat-color($foreground, base, if($is-dark, 0.12, 0.06));\n $ripple-primary-color: mat-color($primary, $thumb-checked-hue, $ripple-checked-opacity);\n $ripple-accent-color: mat-color($accent, $thumb-checked-hue, $ripple-checked-opacity);\n $ripple-warn-color: mat-color($warn, $thumb-checked-hue, $ripple-checked-opacity);\n\n .mat-slide-toggle {\n @include _mat-slide-toggle-checked($accent, $thumb-checked-hue);\n @include _mat-slide-toggle-ripple($accent, $ripple-unchecked-color, $ripple-accent-color);\n\n &.mat-primary {\n @include _mat-slide-toggle-checked($primary, $thumb-checked-hue);\n @include _mat-slide-toggle-ripple($accent, $ripple-unchecked-color, $ripple-primary-color);\n }\n\n &.mat-warn {\n @include _mat-slide-toggle-checked($warn, $thumb-checked-hue);\n @include _mat-slide-toggle-ripple($accent, $ripple-unchecked-color, $ripple-warn-color);\n }\n\n }\n\n .mat-disabled {\n .mat-slide-toggle-thumb {\n // The thumb of the slide-toggle always uses the hue 400 of the grey palette in dark\n // or light themes. Since this is very specific to the slide-toggle component, we're not\n // providing it in the background palette.\n background-color: mat-color($mat-grey, $thumb-disabled-hue);\n }\n .mat-slide-toggle-bar {\n background-color: $bar-disabled-color;\n }\n }\n\n .mat-slide-toggle-thumb {\n background-color: mat-color($mat-grey, $thumb-normal-hue);\n }\n\n .mat-slide-toggle-bar {\n background-color: $bar-normal-color;\n }\n}\n\n@mixin mat-slide-toggle-typography($config) {\n .mat-slide-toggle-content {\n @include mat-typography-level-to-styles($config, body-1);\n }\n}\n\n\n\n\n\n@mixin _mat-slider-inner-content-theme($palette) {\n .mat-slider-track-fill,\n .mat-slider-thumb,\n .mat-slider-thumb-label {\n background-color: mat-color($palette);\n }\n\n .mat-slider-thumb-label-text {\n color: mat-color($palette, default-contrast);\n }\n}\n\n@mixin mat-slider-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n $mat-slider-off-color: mat-color($foreground, slider-off);\n $mat-slider-off-focused-color: mat-color($foreground, slider-off-active);\n $mat-slider-disabled-color: mat-color($foreground, slider-off);\n $mat-slider-labeled-min-value-thumb-color: mat-color($foreground, slider-min);\n $mat-slider-labeled-min-value-thumb-label-color: mat-color($foreground, slider-off);\n $mat-slider-focus-ring-color: mat-color($accent, default, 0.2);\n $mat-slider-focus-ring-min-value-color: mat-color($foreground, base, 0.12);\n $mat-slider-tick-color: mat-color($foreground, base, 0.7);\n $mat-slider-tick-size: 2px;\n\n .mat-slider-track-background {\n background-color: $mat-slider-off-color;\n }\n\n .mat-primary {\n @include _mat-slider-inner-content-theme($primary);\n }\n\n .mat-accent {\n @include _mat-slider-inner-content-theme($accent);\n }\n\n .mat-warn {\n @include _mat-slider-inner-content-theme($warn);\n }\n\n .mat-slider-focus-ring {\n background-color: $mat-slider-focus-ring-color;\n }\n\n .mat-slider:hover,\n .cdk-focused {\n .mat-slider-track-background {\n background-color: $mat-slider-off-focused-color;\n }\n }\n\n .mat-slider-disabled {\n .mat-slider-track-background,\n .mat-slider-track-fill,\n .mat-slider-thumb {\n background-color: $mat-slider-disabled-color;\n }\n\n &:hover {\n .mat-slider-track-background {\n background-color: $mat-slider-disabled-color;\n }\n }\n }\n\n .mat-slider-min-value {\n .mat-slider-focus-ring {\n background-color: $mat-slider-focus-ring-min-value-color;\n }\n\n &.mat-slider-thumb-label-showing {\n .mat-slider-thumb,\n .mat-slider-thumb-label {\n background-color: $mat-slider-labeled-min-value-thumb-color;\n }\n\n &.cdk-focused {\n .mat-slider-thumb,\n .mat-slider-thumb-label {\n background-color: $mat-slider-labeled-min-value-thumb-label-color;\n }\n }\n }\n\n &:not(.mat-slider-thumb-label-showing) {\n .mat-slider-thumb {\n border-color: $mat-slider-off-color;\n background-color: transparent;\n }\n\n &:hover,\n &.cdk-focused {\n .mat-slider-thumb {\n border-color: $mat-slider-off-focused-color;\n }\n\n &.mat-slider-disabled .mat-slider-thumb {\n border-color: $mat-slider-disabled-color;\n }\n }\n }\n }\n\n .mat-slider-has-ticks .mat-slider-wrapper::after {\n border-color: $mat-slider-tick-color;\n }\n\n .mat-slider-horizontal .mat-slider-ticks {\n background-image: repeating-linear-gradient(to right, $mat-slider-tick-color,\n $mat-slider-tick-color $mat-slider-tick-size, transparent 0, transparent);\n // Firefox doesn't draw the gradient correctly with 'to right'\n // (see https://bugzilla.mozilla.org/show_bug.cgi?id=1314319).\n background-image: -moz-repeating-linear-gradient(0.0001deg, $mat-slider-tick-color,\n $mat-slider-tick-color $mat-slider-tick-size, transparent 0, transparent);\n }\n\n .mat-slider-vertical .mat-slider-ticks {\n background-image: repeating-linear-gradient(to bottom, $mat-slider-tick-color,\n $mat-slider-tick-color $mat-slider-tick-size, transparent 0, transparent);\n }\n}\n\n@mixin mat-slider-typography($config) {\n .mat-slider-thumb-label-text {\n font: {\n family: mat-font-family($config);\n size: mat-font-size($config, caption);\n weight: mat-font-weight($config, body-2);\n }\n }\n}\n\n\n\n\n\n@mixin mat-stepper-theme($theme) {\n $foreground: map-get($theme, foreground);\n $background: map-get($theme, background);\n $primary: map-get($theme, primary);\n\n .mat-step-header {\n &.cdk-keyboard-focused,\n &.cdk-program-focused,\n &:hover {\n background-color: mat-color($background, hover);\n }\n\n .mat-step-label,\n .mat-step-optional {\n color: mat-color($foreground, disabled-text);\n }\n\n .mat-step-icon {\n background-color: mat-color($primary);\n color: mat-color($primary, default-contrast);\n }\n\n .mat-step-icon-not-touched {\n background-color: mat-color($foreground, disabled-text);\n color: mat-color($primary, default-contrast);\n }\n\n .mat-step-label.mat-step-label-active {\n color: mat-color($foreground, text);\n }\n }\n\n .mat-stepper-horizontal, .mat-stepper-vertical {\n background-color: mat-color($background, card);\n }\n\n .mat-stepper-vertical-line::before {\n border-left-color: mat-color($foreground, divider);\n }\n\n .mat-stepper-horizontal-line {\n border-top-color: mat-color($foreground, divider);\n }\n}\n\n@mixin mat-stepper-typography($config) {\n .mat-stepper-vertical, .mat-stepper-horizontal {\n font-family: mat-font-family($config);\n }\n\n .mat-step-label {\n font: {\n size: mat-font-size($config, body-1);\n weight: mat-font-weight($config, body-1);\n };\n }\n\n .mat-step-label-selected {\n font: {\n size: mat-font-size($config, body-2);\n weight: mat-font-weight($config, body-2);\n };\n }\n}\n\n@mixin mat-sort-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-sort-header-arrow {\n // Because the arrow is made up of multiple elements that are stacked on top of each other,\n // we can't use the semi-trasparent color from the theme directly. We convert it into a solid\n // color by taking the opacity from the rgba value and using the value to determine the\n // percentage of the background to put into foreground when mixing the colors together.\n $table-background: mat-color($background, 'card');\n $text-color: mat-color($foreground, secondary-text);\n $text-opacity: opacity($text-color);\n color: mix($table-background, rgba($text-color, 1), (1 - $text-opacity) * 100%);\n }\n}\n\n@mixin mat-sort-typography($config) { }\n\n\n\n\n\n@mixin mat-tabs-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n $header-border: 1px solid mat-color($foreground, divider);\n\n .mat-tab-nav-bar,\n .mat-tab-header {\n border-bottom: $header-border;\n }\n\n .mat-tab-group-inverted-header {\n .mat-tab-nav-bar,\n .mat-tab-header {\n border-top: $header-border;\n border-bottom: none;\n }\n }\n\n .mat-tab-label, .mat-tab-link {\n color: mat-color($foreground, text);\n\n &.mat-tab-disabled {\n color: mat-color($foreground, disabled-text);\n }\n }\n\n .mat-tab-header-pagination-chevron {\n border-color: mat-color($foreground, text);\n }\n\n .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n border-color: mat-color($foreground, disabled-text);\n }\n\n // Remove header border when there is a background color\n .mat-tab-group[class*='mat-background-'] .mat-tab-header,\n .mat-tab-nav-bar[class*='mat-background-'] {\n border-bottom: none;\n border-top: none;\n }\n\n .mat-tab-group, .mat-tab-nav-bar {\n $theme-colors: (\n primary: $primary,\n accent: $accent,\n warn: $warn\n );\n\n @each $name, $color in $theme-colors {\n // Set the foreground color of the tabs\n &.mat-#{$name} {\n @include _mat-tab-label-focus($color);\n @include _mat-ink-bar($color);\n\n // Override ink bar when background color is the same\n &.mat-background-#{$name} {\n @include _mat-ink-bar($color, default-contrast);\n }\n }\n }\n\n @each $name, $color in $theme-colors {\n // Set background color of the tabs and override focus color\n &.mat-background-#{$name} {\n @include _mat-tab-label-focus($color);\n @include _mat-tabs-background($color);\n }\n }\n }\n}\n\n@mixin _mat-ink-bar($color, $hue: default) {\n .mat-ink-bar {\n background-color: mat-color($color, $hue);\n }\n}\n\n@mixin _mat-tab-label-focus($tab-focus-color) {\n .mat-tab-label,\n .mat-tab-link {\n &.cdk-keyboard-focused,\n &.cdk-program-focused {\n &:not(.mat-tab-disabled) {\n background-color: mat-color($tab-focus-color, lighter, 0.3);\n }\n }\n }\n}\n\n@mixin _mat-tabs-background($background-color) {\n // Set background color for the tab group\n .mat-tab-header, .mat-tab-links {\n background-color: mat-color($background-color);\n }\n\n // Set labels to contrast against background\n .mat-tab-label, .mat-tab-link {\n color: mat-color($background-color, default-contrast);\n\n &.mat-tab-disabled {\n color: mat-color($background-color, default-contrast, 0.4);\n }\n }\n\n // Set pagination chevrons to contrast background\n .mat-tab-header-pagination-chevron {\n border-color: mat-color($background-color, default-contrast);\n }\n\n .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n border-color: mat-color($background-color, default-contrast, 0.4);\n }\n\n // Set ripples color to be the contrast color of the new background. Otherwise the ripple\n // color will be based on the app background color.\n .mat-ripple-element {\n background-color: mat-color($background-color, default-contrast, 0.12);\n }\n}\n\n@mixin mat-tabs-typography($config) {\n .mat-tab-group {\n font-family: mat-font-family($config);\n }\n\n .mat-tab-label, .mat-tab-link {\n font: {\n family: mat-font-family($config, button);\n size: mat-font-size($config, button);\n weight: mat-font-weight($config, button);\n }\n }\n}\n\n\n\n\n\n\n@mixin _mat-toolbar-color($palette) {\n background: mat-color($palette);\n color: mat-color($palette, default-contrast);\n}\n\n@mixin _mat-toolbar-form-field-overrides {\n .mat-form-field-underline,\n .mat-form-field-ripple,\n .mat-focused .mat-form-field-ripple {\n background-color: currentColor;\n }\n\n .mat-form-field-label,\n .mat-focused .mat-form-field-label,\n .mat-select-value,\n .mat-select-arrow,\n .mat-form-field.mat-focused .mat-select-arrow {\n color: inherit;\n }\n\n .mat-input-element {\n caret-color: currentColor;\n }\n}\n\n@mixin mat-toolbar-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-toolbar {\n background: mat-color($background, app-bar);\n color: mat-color($foreground, text);\n\n &.mat-primary {\n @include _mat-toolbar-color($primary);\n }\n\n &.mat-accent {\n @include _mat-toolbar-color($accent);\n }\n\n &.mat-warn {\n @include _mat-toolbar-color($warn);\n }\n\n @include _mat-toolbar-form-field-overrides;\n }\n}\n\n@mixin mat-toolbar-typography($config) {\n .mat-toolbar,\n .mat-toolbar h1,\n .mat-toolbar h2,\n .mat-toolbar h3,\n .mat-toolbar h4,\n .mat-toolbar h5,\n .mat-toolbar h6 {\n @include mat-typography-level-to-styles($config, title);\n margin: 0;\n }\n}\n\n\n\n\n\n$mat-tooltip-target-height: 22px;\n$mat-tooltip-font-size: 10px;\n$mat-tooltip-vertical-padding: ($mat-tooltip-target-height - $mat-tooltip-font-size) / 2;\n\n$mat-tooltip-handset-target-height: 32px;\n$mat-tooltip-handset-font-size: 14px;\n$mat-tooltip-handset-vertical-padding:\n ($mat-tooltip-handset-target-height - $mat-tooltip-handset-font-size) / 2;\n\n@mixin mat-tooltip-theme($theme) {\n .mat-tooltip {\n background: mat-color($mat-grey, 700, 0.9);\n }\n}\n\n@mixin mat-tooltip-typography($config) {\n .mat-tooltip {\n font-family: mat-font-family($config);\n font-size: $mat-tooltip-font-size;\n padding-top: $mat-tooltip-vertical-padding;\n padding-bottom: $mat-tooltip-vertical-padding;\n }\n\n .mat-tooltip-handset {\n font-size: $mat-tooltip-handset-font-size;\n padding-top: $mat-tooltip-handset-vertical-padding;\n padding-bottom: $mat-tooltip-handset-vertical-padding;\n }\n}\n\n\n\n\n@mixin mat-snack-bar-theme($theme) {\n $is-dark-theme: map-get($theme, is-dark);\n $accent: map-get($theme, accent);\n\n .mat-snack-bar-container {\n background: if($is-dark-theme, map-get($mat-grey, 50), #323232);\n color: if($is-dark-theme, $dark-primary-text, $light-primary-text);\n }\n\n .mat-simple-snackbar-action {\n color: if($is-dark-theme, inherit, mat-color($accent));\n }\n}\n\n@mixin mat-snack-bar-typography($config) {\n .mat-simple-snackbar {\n font: {\n family: mat-font-family($config, body-1);\n size: mat-font-size($config, body-1);\n }\n }\n\n .mat-simple-snackbar-action {\n line-height: 1;\n font: {\n family: inherit;\n size: inherit;\n weight: mat-font-weight($config, button);\n }\n }\n}\n\n\n\n\n\n\n\n\n\n\n\n\n\n// Theme styles that only apply to the fill appearance of the form-field.\n\n@mixin mat-form-field-fill-theme($theme) {\n $foreground: map-get($theme, foreground);\n $is-dark-theme: map-get($theme, is-dark);\n\n $fill-background: mat-color($foreground, base, if($is-dark-theme, 0.1, 0.04));\n $fill-disabled-background: mat-color($foreground, base, if($is-dark-theme, 0.05, 0.02));\n $underline-color: mat-color($foreground, divider, if($is-dark-theme, 0.5, 0.42));\n $label-disabled-color: mat-color($foreground, disabled-text);\n\n .mat-form-field-appearance-fill {\n .mat-form-field-flex {\n background-color: $fill-background;\n }\n\n &.mat-form-field-disabled .mat-form-field-flex {\n background-color: $fill-disabled-background;\n }\n\n .mat-form-field-underline::before {\n background-color: $underline-color;\n }\n\n &.mat-form-field-disabled {\n .mat-form-field-label {\n color: $label-disabled-color;\n }\n\n .mat-form-field-underline::before {\n background-color: transparent;\n }\n }\n }\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$mat-form-field-fill-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _mat-form-field-fill-label-floating($font-scale, $infix-padding, $infix-margin-top) {\n transform: translateY(-$infix-margin-top - $infix-padding + $mat-form-field-fill-dedupe)\n scale($font-scale);\n width: 100% / $font-scale + $mat-form-field-fill-dedupe;\n\n $mat-form-field-fill-dedupe: $mat-form-field-fill-dedupe + 0.00001 !global;\n}\n\n@mixin mat-form-field-fill-typography($config) {\n // The unit-less line-height from the font config.\n $line-height: mat-line-height($config, input);\n // The amount to scale the font for the floating label and subscript.\n $subscript-font-scale: 0.75;\n // The padding on top of the infix.\n $infix-padding-top: 0.25em;\n // The padding below the infix.\n $infix-padding-bottom: 0.75em;\n // The margin applied to the form-field-infix to reserve space for the floating label.\n $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n // The amount we offset the label from the input text in the fill appearance.\n $fill-appearance-label-offset: -0.5em;\n\n .mat-form-field-appearance-fill {\n .mat-form-field-infix {\n padding: $infix-padding-top 0 $infix-padding-bottom 0;\n }\n\n .mat-form-field-label {\n top: $infix-margin-top + $infix-padding-top;\n margin-top: $fill-appearance-label-offset;\n }\n\n &.mat-form-field-can-float {\n &.mat-form-field-should-float .mat-form-field-label,\n .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n @include _mat-form-field-fill-label-floating(\n $subscript-font-scale, $infix-padding-top + $fill-appearance-label-offset,\n $infix-margin-top);\n }\n\n // Server-side rendered matInput with a label attribute but label not shown\n // (used as a pure CSS stand-in for mat-form-field-should-float).\n .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n .mat-form-field-label {\n @include _mat-form-field-fill-label-floating(\n $subscript-font-scale, $infix-padding-top + $fill-appearance-label-offset,\n $infix-margin-top);\n }\n }\n }\n}\n\n\n\n\n\n\n\n// Theme styles that only apply to the legacy appearance of the form-field.\n\n@mixin mat-form-field-legacy-theme($theme) {\n $foreground: map-get($theme, foreground);\n $is-dark-theme: map-get($theme, is-dark);\n\n $label-color: mat-color($foreground, secondary-text);\n $underline-color: mat-color($foreground, divider, if($is-dark-theme, 0.7, 0.42));\n\n .mat-form-field-appearance-legacy {\n .mat-form-field-label {\n color: $label-color;\n }\n\n .mat-hint {\n color: $label-color;\n }\n\n .mat-form-field-underline {\n background-color: $underline-color;\n }\n\n &.mat-form-field-disabled .mat-form-field-underline {\n @include mat-control-disabled-underline($underline-color);\n }\n }\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$mat-form-field-legacy-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _mat-form-field-legacy-label-floating($font-scale, $infix-padding, $infix-margin-top) {\n // We use perspective to fix the text blurriness as described here:\n // http://www.useragentman.com/blog/2014/05/04/fixing-typography-inside-of-2-d-css-transforms/\n // This results in a small jitter after the label floats on Firefox, which the\n // translateZ fixes.\n transform: translateY(-$infix-margin-top - $infix-padding) scale($font-scale) perspective(100px)\n translateZ(0.001px + $mat-form-field-legacy-dedupe);\n // The tricks above used to smooth out the animation on chrome and firefox actually make things\n // worse on IE, so we don't include them in the IE version.\n -ms-transform: translateY(-$infix-margin-top - $infix-padding + $mat-form-field-legacy-dedupe)\n scale($font-scale);\n\n width: 100% / $font-scale + $mat-form-field-legacy-dedupe;\n\n $mat-form-field-legacy-dedupe: $mat-form-field-legacy-dedupe + 0.00001 !global;\n}\n\n@mixin mat-form-field-legacy-typography($config) {\n // The unit-less line-height from the font config.\n $line-height: mat-line-height($config, input);\n // The amount to scale the font for the floating label and subscript.\n $subscript-font-scale: 0.75;\n // The amount of space between the top of the line and the top of the actual text\n // (as a fraction of the font-size).\n $line-spacing: ($line-height - 1) / 2;\n // The padding on the infix. Mocks show half of the text size, but seem to measure from the edge\n // of the text itself, not the edge of the line; therefore we subtract off the line spacing.\n $infix-padding: 0.5em - $line-spacing;\n // The margin applied to the form-field-infix to reserve space for the floating label.\n $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n // The space between the bottom of the .mat-form-field-flex area and the subscript wrapper.\n // Mocks show half of the text size, but this margin is applied to an element with the subscript\n // text font size, so we need to divide by the scale factor to make it half of the original text\n // size. We again need to subtract off the line spacing since the mocks measure to the edge of the\n // text, not the edge of the line.\n $subscript-margin-top: 0.5em / $subscript-font-scale - ($line-spacing * 2);\n // The padding applied to the form-field-wrapper to reserve space for the subscript, since it's\n // absolutely positioned. This is a combination of the subscript's margin and line-height, but we\n // need to multiply by the subscript font scale factor since the wrapper has a larger font size.\n $wrapper-padding-bottom: ($subscript-margin-top + $line-height) * $subscript-font-scale;\n\n .mat-form-field-appearance-legacy {\n .mat-form-field-wrapper {\n padding-bottom: $wrapper-padding-bottom;\n }\n\n .mat-form-field-infix {\n padding: $infix-padding 0;\n }\n\n &.mat-form-field-can-float {\n &.mat-form-field-should-float .mat-form-field-label,\n .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n @include _mat-form-field-legacy-label-floating(\n $subscript-font-scale, $infix-padding, $infix-margin-top);\n }\n\n // @breaking-change 7.0.0 will rely on AutofillMonitor instead.\n .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper\n .mat-form-field-label {\n @include _mat-form-field-legacy-label-floating(\n $subscript-font-scale, $infix-padding, $infix-margin-top);\n }\n\n // Server-side rendered matInput with a label attribute but label not shown\n // (used as a pure CSS stand-in for mat-form-field-should-float).\n .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n .mat-form-field-label {\n @include _mat-form-field-legacy-label-floating(\n $subscript-font-scale, $infix-padding, $infix-margin-top);\n }\n }\n\n .mat-form-field-label {\n top: $infix-margin-top + $infix-padding;\n }\n\n .mat-form-field-underline {\n // We want the underline to start at the end of the content box, not the padding box,\n // so we move it up by the padding amount.\n bottom: $wrapper-padding-bottom;\n }\n\n .mat-form-field-subscript-wrapper {\n margin-top: $subscript-margin-top;\n\n // We want the subscript to start at the end of the content box, not the padding box,\n // so we move it up by the padding amount (adjusted for the smaller font size);\n top: calc(100% - #{$wrapper-padding-bottom / $subscript-font-scale});\n }\n }\n}\n\n\n\n\n\n\n\n// Theme styles that only apply to the outline appearance of the form-field.\n\n@mixin mat-form-field-outline-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $foreground: map-get($theme, foreground);\n $is-dark-theme: map-get($theme, is-dark);\n\n $label-disabled-color: mat-color($foreground, disabled-text);\n $outline-color: mat-color($foreground, divider, if($is-dark-theme, 0.3, 0.12));\n $outline-color-hover: mat-color($foreground, divider, if($is-dark-theme, 1, 0.87));\n $outline-color-primary: mat-color($primary);\n $outline-color-accent: mat-color($accent);\n $outline-color-warn: mat-color($warn);\n $outline-color-disabled: mat-color($foreground, divider, if($is-dark-theme, 0.15, 0.06));\n\n .mat-form-field-appearance-outline {\n .mat-form-field-outline {\n color: $outline-color;\n }\n\n .mat-form-field-outline-thick {\n color: $outline-color-hover;\n }\n\n &.mat-focused {\n .mat-form-field-outline-thick {\n color: $outline-color-primary;\n }\n\n &.mat-accent .mat-form-field-outline-thick {\n color: $outline-color-accent;\n }\n\n &.mat-warn .mat-form-field-outline-thick {\n color: $outline-color-warn;\n }\n }\n\n // Class repeated so that rule is specific enough to override focused accent color case.\n &.mat-form-field-invalid.mat-form-field-invalid {\n .mat-form-field-outline-thick {\n color: $outline-color-warn;\n }\n }\n\n &.mat-form-field-disabled {\n .mat-form-field-label {\n color: $label-disabled-color;\n }\n\n .mat-form-field-outline {\n color: $outline-color-disabled;\n }\n }\n }\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$mat-form-field-outline-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _mat-form-field-outline-label-floating($font-scale, $infix-padding, $infix-margin-top) {\n transform: translateY(-$infix-margin-top - $infix-padding + $mat-form-field-outline-dedupe)\n scale($font-scale);\n width: 100% / $font-scale + $mat-form-field-outline-dedupe;\n\n $mat-form-field-outline-dedupe: $mat-form-field-outline-dedupe + 0.00001 !global;\n}\n\n@mixin mat-form-field-outline-typography($config) {\n // The unit-less line-height from the font config.\n $line-height: mat-line-height($config, input);\n // The amount to scale the font for the floating label and subscript.\n $subscript-font-scale: 0.75;\n // The padding above and below the infix.\n $infix-padding: 1em;\n // The margin applied to the form-field-infix to reserve space for the floating label.\n $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n // The space between the bottom of the .mat-form-field-flex area and the subscript wrapper.\n // Mocks show half of the text size, but this margin is applied to an element with the subscript\n // text font size, so we need to divide by the scale factor to make it half of the original text\n // size.\n $subscript-margin-top: 0.5em / $subscript-font-scale;\n // The padding applied to the form-field-wrapper to reserve space for the subscript, since it's\n // absolutely positioned. This is a combination of the subscript's margin and line-height, but we\n // need to multiply by the subscript font scale factor since the wrapper has a larger font size.\n $wrapper-padding-bottom: ($subscript-margin-top + $line-height) * $subscript-font-scale;\n // The amount we offset the label from the input text in the outline appearance.\n $outline-appearance-label-offset: -0.25em;\n\n .mat-form-field-appearance-outline {\n .mat-form-field-infix {\n padding: $infix-padding 0 $infix-padding 0;\n }\n\n .mat-form-field-label {\n top: $infix-margin-top + $infix-padding;\n margin-top: $outline-appearance-label-offset;\n }\n\n &.mat-form-field-can-float {\n &.mat-form-field-should-float .mat-form-field-label,\n .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n @include _mat-form-field-outline-label-floating(\n $subscript-font-scale, $infix-padding + $outline-appearance-label-offset,\n $infix-margin-top);\n }\n\n // Server-side rendered matInput with a label attribute but label not shown\n // (used as a pure CSS stand-in for mat-form-field-should-float).\n .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n .mat-form-field-label {\n @include _mat-form-field-outline-label-floating(\n $subscript-font-scale, $infix-padding + $outline-appearance-label-offset,\n $infix-margin-top);\n }\n }\n }\n}\n\n\n\n\n\n\n\n// Theme styles that only apply to the standard appearance of the form-field.\n\n@mixin mat-form-field-standard-theme($theme) {\n $foreground: map-get($theme, foreground);\n $is-dark-theme: map-get($theme, is-dark);\n\n $underline-color: mat-color($foreground, divider, if($is-dark-theme, 0.7, 0.42));\n\n .mat-form-field-appearance-standard {\n .mat-form-field-underline {\n background-color: $underline-color;\n }\n\n &.mat-form-field-disabled .mat-form-field-underline {\n @include mat-control-disabled-underline($underline-color);\n }\n }\n}\n\n@mixin mat-form-field-standard-typography($config) {}\n\n\n\n// Theme styles that apply to all appearances of the form-field.\n\n@mixin mat-form-field-theme($theme) {\n $primary: map-get($theme, primary);\n $accent: map-get($theme, accent);\n $warn: map-get($theme, warn);\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n $is-dark-theme: map-get($theme, is-dark);\n\n // Label colors. Required is used for the `*` star shown in the label.\n $label-color: mat-color($foreground, secondary-text, if($is-dark-theme, 0.7, 0.6));\n $focused-label-color: mat-color($primary);\n $required-label-color: mat-color($accent);\n\n // Underline colors.\n $underline-color-base: mat-color($foreground, divider, if($is-dark-theme, 1, 0.87));\n $underline-color-accent: mat-color($accent);\n $underline-color-warn: mat-color($warn);\n $underline-focused-color: mat-color($primary);\n\n .mat-form-field-label {\n color: $label-color;\n }\n\n .mat-hint {\n color: $label-color;\n }\n\n .mat-form-field.mat-focused .mat-form-field-label {\n color: $focused-label-color;\n\n &.mat-accent {\n color: $underline-color-accent;\n }\n\n &.mat-warn {\n color: $underline-color-warn;\n }\n }\n\n .mat-focused .mat-form-field-required-marker {\n color: $required-label-color;\n }\n\n .mat-form-field-ripple {\n background-color: $underline-color-base;\n }\n\n .mat-form-field.mat-focused {\n .mat-form-field-ripple {\n background-color: $underline-focused-color;\n\n &.mat-accent {\n background-color: $underline-color-accent;\n }\n\n &.mat-warn {\n background-color: $underline-color-warn;\n }\n }\n }\n\n // Styling for the error state of the form field. Note that while the same can be\n // achieved with the ng-* classes, we use this approach in order to ensure that the same\n // logic is used to style the error state and to show the error messages.\n .mat-form-field.mat-form-field-invalid {\n .mat-form-field-label {\n color: $underline-color-warn;\n\n &.mat-accent,\n .mat-form-field-required-marker {\n color: $underline-color-warn;\n }\n }\n\n .mat-form-field-ripple,\n .mat-form-field-ripple.mat-accent {\n background-color: $underline-color-warn;\n }\n }\n\n .mat-error {\n color: $underline-color-warn;\n }\n\n @include mat-form-field-legacy-theme($theme);\n @include mat-form-field-standard-theme($theme);\n @include mat-form-field-fill-theme($theme);\n @include mat-form-field-outline-theme($theme);\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$mat-form-field-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _mat-form-field-label-floating($font-scale, $infix-padding, $infix-margin-top) {\n transform: translateY(-$infix-margin-top - $infix-padding + $mat-form-field-dedupe)\n scale($font-scale);\n width: 100% / $font-scale + $mat-form-field-dedupe;\n\n $mat-form-field-dedupe: $mat-form-field-dedupe + 0.00001 !global;\n}\n\n@mixin mat-form-field-typography($config) {\n // The unit-less line-height from the font config.\n $line-height: mat-line-height($config, input);\n\n // The amount to scale the font for the floating label and subscript.\n $subscript-font-scale: 0.75;\n // The amount to scale the font for the prefix and suffix icons.\n $prefix-suffix-icon-font-scale: 1.5;\n\n // The padding on the infix. Mocks show half of the text size.\n $infix-padding: 0.5em;\n // The margin applied to the form-field-infix to reserve space for the floating label.\n $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n // Font size to use for the label and subscript text.\n $subscript-font-size: $subscript-font-scale * 100%;\n // Font size to use for the for the prefix and suffix icons.\n $prefix-suffix-icon-font-size: $prefix-suffix-icon-font-scale * 100%;\n // The space between the bottom of the .mat-form-field-flex area and the subscript wrapper.\n // Mocks show half of the text size, but this margin is applied to an element with the subscript\n // text font size, so we need to divide by the scale factor to make it half of the original text\n // size.\n $subscript-margin-top: 0.5em / $subscript-font-scale;\n // The padding applied to the form-field-wrapper to reserve space for the subscript, since it's\n // absolutely positioned. This is a combination of the subscript's margin and line-height, but we\n // need to multiply by the subscript font scale factor since the wrapper has a larger font size.\n $wrapper-padding-bottom: ($subscript-margin-top + $line-height) * $subscript-font-scale;\n\n .mat-form-field {\n @include mat-typography-level-to-styles($config, input);\n }\n\n .mat-form-field-wrapper {\n padding-bottom: $wrapper-padding-bottom;\n }\n\n .mat-form-field-prefix,\n .mat-form-field-suffix {\n // Allow icons in a prefix or suffix to adapt to the correct size.\n .mat-icon {\n font-size: $prefix-suffix-icon-font-size;\n line-height: $line-height;\n }\n\n // Allow icon buttons in a prefix or suffix to adapt to the correct size.\n .mat-icon-button {\n height: $prefix-suffix-icon-font-scale * 1em;\n width: $prefix-suffix-icon-font-scale * 1em;\n\n .mat-icon {\n height: $line-height * 1em;\n line-height: $line-height;\n }\n }\n }\n\n .mat-form-field-infix {\n padding: $infix-padding 0;\n // Throws off the baseline if we do it as a real margin, so we do it as a border instead.\n border-top: $infix-margin-top solid transparent;\n }\n\n .mat-form-field-can-float {\n &.mat-form-field-should-float .mat-form-field-label,\n .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n @include _mat-form-field-label-floating(\n $subscript-font-scale, $infix-padding, $infix-margin-top);\n }\n\n // Server-side rendered matInput with a label attribute but label not shown\n // (used as a pure CSS stand-in for mat-form-field-should-float).\n .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n .mat-form-field-label {\n @include _mat-form-field-label-floating(\n $subscript-font-scale, $infix-padding, $infix-margin-top);\n }\n }\n\n .mat-form-field-label-wrapper {\n top: -$infix-margin-top;\n padding-top: $infix-margin-top;\n }\n\n .mat-form-field-label {\n top: $infix-margin-top + $infix-padding;\n }\n\n .mat-form-field-underline {\n // We want the underline to start at the end of the content box, not the padding box,\n // so we move it up by the padding amount.\n bottom: $wrapper-padding-bottom;\n }\n\n .mat-form-field-subscript-wrapper {\n font-size: $subscript-font-size;\n margin-top: $subscript-margin-top;\n\n // We want the subscript to start at the end of the content box, not the padding box,\n // so we move it up by the padding amount (adjusted for the smaller font size);\n top: calc(100% - #{$wrapper-padding-bottom / $subscript-font-scale});\n }\n\n @include mat-form-field-legacy-typography($config);\n @include mat-form-field-standard-typography($config);\n @include mat-form-field-fill-typography($config);\n @include mat-form-field-outline-typography($config);\n}\n\n\n\n\n\n@mixin mat-tree-theme($theme) {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n .mat-tree {\n background: mat-color($background, 'card');\n }\n\n .mat-tree-node {\n color: mat-color($foreground, text);\n }\n}\n\n@mixin mat-tree-typography($config) {\n .mat-tree {\n font-family: mat-font-family($config);\n }\n\n .mat-tree-node {\n font-weight: mat-font-weight($config, body-1);\n font-size: mat-font-size($config, body-1);\n }\n}\n\n\n\n// Includes all of the typographic styles.\n@mixin angular-material-typography($config: null) {\n @if $config == null {\n $config: mat-typography-config();\n }\n\n @include mat-badge-typography($config);\n @include mat-base-typography($config);\n @include mat-autocomplete-typography($config);\n @include mat-bottom-sheet-typography($config);\n @include mat-button-typography($config);\n @include mat-button-toggle-typography($config);\n @include mat-card-typography($config);\n @include mat-checkbox-typography($config);\n @include mat-chips-typography($config);\n @include mat-table-typography($config);\n @include mat-datepicker-typography($config);\n @include mat-dialog-typography($config);\n @include mat-expansion-panel-typography($config);\n @include mat-form-field-typography($config);\n @include mat-grid-list-typography($config);\n @include mat-icon-typography($config);\n @include mat-input-typography($config);\n @include mat-menu-typography($config);\n @include mat-paginator-typography($config);\n @include mat-progress-bar-typography($config);\n @include mat-progress-spinner-typography($config);\n @include mat-radio-typography($config);\n @include mat-select-typography($config);\n @include mat-sidenav-typography($config);\n @include mat-slide-toggle-typography($config);\n @include mat-slider-typography($config);\n @include mat-stepper-typography($config);\n @include mat-sort-typography($config);\n @include mat-tabs-typography($config);\n @include mat-toolbar-typography($config);\n @include mat-tooltip-typography($config);\n @include mat-list-typography($config);\n @include mat-option-typography($config);\n @include mat-optgroup-typography($config);\n @include mat-snack-bar-typography($config);\n @include mat-tree-typography($config);\n}\n\n\n// Mixin that renders all of the core styles that are not theme-dependent.\n@mixin mat-core($typography-config: null) {\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 .#{$_mat-elevation-prefix}#{$zValue} {\n @include mat-elevation($zValue);\n }\n }\n\n @include angular-material-typography($typography-config);\n @include mat-ripple();\n @include cdk-a11y();\n @include cdk-overlay();\n @include cdk-text-field();\n}\n\n// Mixin that renders all of the core styles that depend on the theme.\n@mixin mat-core-theme($theme) {\n @include mat-ripple-theme($theme);\n @include mat-option-theme($theme);\n @include mat-optgroup-theme($theme);\n @include mat-pseudo-checkbox-theme($theme);\n\n // Wrapper element that provides the theme background when the user's content isn't\n // inside of a `mat-sidenav-container`. Note that we need to exclude the ampersand\n // selector in case the mixin is included at the top level.\n .mat-app-background#{if(&, ', &.mat-app-background', '')} {\n $background: map-get($theme, background);\n $foreground: map-get($theme, foreground);\n\n background-color: mat-color($background, background);\n color: mat-color($foreground, text);\n }\n\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\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n@mixin mat-divider-theme($theme) {\n $foreground: map-get($theme, foreground);\n\n .mat-divider {\n border-top-color: mat-color($foreground, divider);\n }\n\n .mat-divider-vertical {\n border-right-color: mat-color($foreground, divider);\n }\n}\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n// Create a theme.\n@mixin angular-material-theme($theme) {\n @include mat-core-theme($theme);\n @include mat-autocomplete-theme($theme);\n @include mat-badge-theme($theme);\n @include mat-bottom-sheet-theme($theme);\n @include mat-button-theme($theme);\n @include mat-button-toggle-theme($theme);\n @include mat-card-theme($theme);\n @include mat-checkbox-theme($theme);\n @include mat-chips-theme($theme);\n @include mat-table-theme($theme);\n @include mat-datepicker-theme($theme);\n @include mat-dialog-theme($theme);\n @include mat-divider-theme($theme);\n @include mat-expansion-panel-theme($theme);\n @include mat-form-field-theme($theme);\n @include mat-grid-list-theme($theme);\n @include mat-icon-theme($theme);\n @include mat-input-theme($theme);\n @include mat-list-theme($theme);\n @include mat-menu-theme($theme);\n @include mat-paginator-theme($theme);\n @include mat-progress-bar-theme($theme);\n @include mat-progress-spinner-theme($theme);\n @include mat-radio-theme($theme);\n @include mat-select-theme($theme);\n @include mat-sidenav-theme($theme);\n @include mat-slide-toggle-theme($theme);\n @include mat-slider-theme($theme);\n @include mat-stepper-theme($theme);\n @include mat-sort-theme($theme);\n @include mat-tabs-theme($theme);\n @include mat-toolbar-theme($theme);\n @include mat-tooltip-theme($theme);\n @include mat-tree-theme($theme);\n @include mat-snack-bar-theme($theme);\n}\n",null,"/**\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.mat-elevation-z0 {\n box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z1 {\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z2 {\n box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z3 {\n box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z4 {\n box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z5 {\n box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z6 {\n box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z7 {\n box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z8 {\n box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z9 {\n box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z10 {\n box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z11 {\n box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z12 {\n box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z13 {\n box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z14 {\n box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z15 {\n box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z16 {\n box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z17 {\n box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z18 {\n box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z19 {\n box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z20 {\n box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z21 {\n box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z22 {\n box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z23 {\n box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12); }\n\n.mat-elevation-z24 {\n box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); }\n\n.mat-badge-content {\n font-weight: 600;\n font-size: 12px;\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-badge-small .mat-badge-content {\n font-size: 6px; }\n\n.mat-badge-large .mat-badge-content {\n font-size: 24px; }\n\n.mat-h1, .mat-headline, .mat-typography h1 {\n font: 400 24px/32px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 16px; }\n\n.mat-h2, .mat-title, .mat-typography h2 {\n font: 500 20px/32px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 16px; }\n\n.mat-h3, .mat-subheading-2, .mat-typography h3 {\n font: 400 16px/28px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 16px; }\n\n.mat-h4, .mat-subheading-1, .mat-typography h4 {\n font: 400 15px/24px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 16px; }\n\n.mat-h5, .mat-typography h5 {\n font: 400 11.62px/20px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 12px; }\n\n.mat-h6, .mat-typography h6 {\n font: 400 9.38px/20px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 12px; }\n\n.mat-body-strong, .mat-body-2 {\n font: 500 14px/24px Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-body, .mat-body-1, .mat-typography {\n font: 400 14px/20px Roboto, \"Helvetica Neue\", sans-serif; }\n .mat-body p, .mat-body-1 p, .mat-typography p {\n margin: 0 0 12px; }\n\n.mat-small, .mat-caption {\n font: 400 12px/20px Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-display-4, .mat-typography .mat-display-4 {\n font: 300 112px/112px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 56px;\n letter-spacing: -0.05em; }\n\n.mat-display-3, .mat-typography .mat-display-3 {\n font: 400 56px/56px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 64px;\n letter-spacing: -0.02em; }\n\n.mat-display-2, .mat-typography .mat-display-2 {\n font: 400 45px/48px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 64px;\n letter-spacing: -0.005em; }\n\n.mat-display-1, .mat-typography .mat-display-1 {\n font: 400 34px/40px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0 0 64px; }\n\n.mat-bottom-sheet-container {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 16px;\n font-weight: 400; }\n\n.mat-button, .mat-raised-button, .mat-icon-button, .mat-stroked-button,\n.mat-flat-button, .mat-fab, .mat-mini-fab {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 14px;\n font-weight: 500; }\n\n.mat-button-toggle {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-card {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-card-title {\n font-size: 24px;\n font-weight: 400; }\n\n.mat-card-subtitle,\n.mat-card-content,\n.mat-card-header .mat-card-title {\n font-size: 14px; }\n\n.mat-checkbox {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-checkbox-layout .mat-checkbox-label {\n line-height: 24px; }\n\n.mat-chip {\n font-size: 13px;\n line-height: 18px; }\n .mat-chip .mat-chip-trailing-icon.mat-icon,\n .mat-chip .mat-chip-remove.mat-icon {\n font-size: 18px; }\n\n.mat-table {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-header-cell {\n font-size: 12px;\n font-weight: 500; }\n\n.mat-cell, .mat-footer-cell {\n font-size: 14px; }\n\n.mat-calendar {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-calendar-body {\n font-size: 13px; }\n\n.mat-calendar-body-label,\n.mat-calendar-period-button {\n font-size: 14px;\n font-weight: 500; }\n\n.mat-calendar-table-header th {\n font-size: 11px;\n font-weight: 400; }\n\n.mat-dialog-title {\n font: 500 20px/32px Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-expansion-panel-header {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 15px;\n font-weight: 400; }\n\n.mat-expansion-panel-content {\n font: 400 14px/20px Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-form-field {\n font-size: inherit;\n font-weight: 400;\n line-height: 1.125;\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-form-field-wrapper {\n padding-bottom: 1.34375em; }\n\n.mat-form-field-prefix .mat-icon,\n.mat-form-field-suffix .mat-icon {\n font-size: 150%;\n line-height: 1.125; }\n\n.mat-form-field-prefix .mat-icon-button,\n.mat-form-field-suffix .mat-icon-button {\n height: 1.5em;\n width: 1.5em; }\n .mat-form-field-prefix .mat-icon-button .mat-icon,\n .mat-form-field-suffix .mat-icon-button .mat-icon {\n height: 1.125em;\n line-height: 1.125; }\n\n.mat-form-field-infix {\n padding: 0.5em 0;\n border-top: 0.84375em solid transparent; }\n\n.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n transform: translateY(-1.34375em) scale(0.75);\n width: 133.33333333%; }\n\n.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n.mat-form-field-label {\n transform: translateY(-1.34374em) scale(0.75);\n width: 133.33334333%; }\n\n.mat-form-field-label-wrapper {\n top: -0.84375em;\n padding-top: 0.84375em; }\n\n.mat-form-field-label {\n top: 1.34375em; }\n\n.mat-form-field-underline {\n bottom: 1.34375em; }\n\n.mat-form-field-subscript-wrapper {\n font-size: 75%;\n margin-top: 0.66666667em;\n top: calc(100% - 1.79166667em); }\n\n.mat-form-field-appearance-legacy .mat-form-field-wrapper {\n padding-bottom: 1.25em; }\n\n.mat-form-field-appearance-legacy .mat-form-field-infix {\n padding: 0.4375em 0; }\n\n.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px);\n -ms-transform: translateY(-1.28125em) scale(0.75);\n width: 133.33333333%; }\n\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper\n.mat-form-field-label {\n transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.00101px);\n -ms-transform: translateY(-1.28124em) scale(0.75);\n width: 133.33334333%; }\n\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n.mat-form-field-label {\n transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.00102px);\n -ms-transform: translateY(-1.28123em) scale(0.75);\n width: 133.33335333%; }\n\n.mat-form-field-appearance-legacy .mat-form-field-label {\n top: 1.28125em; }\n\n.mat-form-field-appearance-legacy .mat-form-field-underline {\n bottom: 1.25em; }\n\n.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {\n margin-top: 0.54166667em;\n top: calc(100% - 1.66666667em); }\n\n.mat-form-field-appearance-fill .mat-form-field-infix {\n padding: 0.25em 0 0.75em 0; }\n\n.mat-form-field-appearance-fill .mat-form-field-label {\n top: 1.09375em;\n margin-top: -0.5em; }\n\n.mat-form-field-appearance-fill.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n transform: translateY(-0.59375em) scale(0.75);\n width: 133.33333333%; }\n\n.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n.mat-form-field-label {\n transform: translateY(-0.59374em) scale(0.75);\n width: 133.33334333%; }\n\n.mat-form-field-appearance-outline .mat-form-field-infix {\n padding: 1em 0 1em 0; }\n\n.mat-form-field-appearance-outline .mat-form-field-label {\n top: 1.84375em;\n margin-top: -0.25em; }\n\n.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n transform: translateY(-1.59375em) scale(0.75);\n width: 133.33333333%; }\n\n.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n.mat-form-field-label {\n transform: translateY(-1.59374em) scale(0.75);\n width: 133.33334333%; }\n\n.mat-grid-tile-header,\n.mat-grid-tile-footer {\n font-size: 14px; }\n .mat-grid-tile-header .mat-line,\n .mat-grid-tile-footer .mat-line {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n box-sizing: border-box; }\n .mat-grid-tile-header .mat-line:nth-child(n+2),\n .mat-grid-tile-footer .mat-line:nth-child(n+2) {\n font-size: 12px; }\n\ninput.mat-input-element {\n margin-top: -0.0625em; }\n\n.mat-menu-item {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 16px;\n font-weight: 400; }\n\n.mat-paginator,\n.mat-paginator-page-size .mat-select-trigger {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 12px; }\n\n.mat-radio-button {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-select {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-select-trigger {\n height: 1.125em; }\n\n.mat-slide-toggle-content {\n font: 400 14px/20px Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-slider-thumb-label-text {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 12px;\n font-weight: 500; }\n\n.mat-stepper-vertical, .mat-stepper-horizontal {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-step-label {\n font-size: 14px;\n font-weight: 400; }\n\n.mat-step-label-selected {\n font-size: 14px;\n font-weight: 500; }\n\n.mat-tab-group {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-tab-label, .mat-tab-link {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 14px;\n font-weight: 500; }\n\n.mat-toolbar,\n.mat-toolbar h1,\n.mat-toolbar h2,\n.mat-toolbar h3,\n.mat-toolbar h4,\n.mat-toolbar h5,\n.mat-toolbar h6 {\n font: 500 20px/32px Roboto, \"Helvetica Neue\", sans-serif;\n margin: 0; }\n\n.mat-tooltip {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 10px;\n padding-top: 6px;\n padding-bottom: 6px; }\n\n.mat-tooltip-handset {\n font-size: 14px;\n padding-top: 9px;\n padding-bottom: 9px; }\n\n.mat-list-item {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-list-option {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item {\n font-size: 16px; }\n .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n box-sizing: border-box; }\n .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) {\n font-size: 14px; }\n\n.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option {\n font-size: 16px; }\n .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n box-sizing: border-box; }\n .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) {\n font-size: 14px; }\n\n.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 14px;\n font-weight: 500; }\n\n.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item {\n font-size: 12px; }\n .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n box-sizing: border-box; }\n .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) {\n font-size: 12px; }\n\n.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option {\n font-size: 12px; }\n .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n box-sizing: border-box; }\n .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) {\n font-size: 12px; }\n\n.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 12px;\n font-weight: 500; }\n\n.mat-option {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 16px; }\n\n.mat-optgroup-label {\n font: 500 14px/24px Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-simple-snackbar {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n font-size: 14px; }\n\n.mat-simple-snackbar-action {\n line-height: 1;\n font-family: inherit;\n font-size: inherit;\n font-weight: 500; }\n\n.mat-tree {\n font-family: Roboto, \"Helvetica Neue\", sans-serif; }\n\n.mat-tree-node {\n font-weight: 400;\n font-size: 14px; }\n\n.mat-ripple {\n overflow: hidden; }\n\n.mat-ripple.mat-ripple-unbounded {\n overflow: visible; }\n\n.mat-ripple-element {\n position: absolute;\n border-radius: 50%;\n pointer-events: none;\n transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);\n transform: scale(0); }\n @media screen and (-ms-high-contrast: active) {\n .mat-ripple-element {\n display: none; } }\n\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 outline: 0;\n -webkit-appearance: none;\n -moz-appearance: none; }\n\n.cdk-overlay-container, .cdk-global-overlay-wrapper {\n pointer-events: none;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%; }\n\n.cdk-overlay-container {\n position: fixed;\n z-index: 1000; }\n .cdk-overlay-container:empty {\n display: none; }\n\n.cdk-global-overlay-wrapper {\n display: flex;\n position: absolute;\n z-index: 1000; }\n\n.cdk-overlay-pane {\n position: absolute;\n pointer-events: auto;\n box-sizing: border-box;\n z-index: 1000;\n display: flex;\n max-width: 100%;\n max-height: 100%; }\n\n.cdk-overlay-backdrop {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n pointer-events: auto;\n -webkit-tap-highlight-color: transparent;\n transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n opacity: 0; }\n .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n opacity: 1; }\n @media screen and (-ms-high-contrast: active) {\n .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n opacity: 0.6; } }\n\n.cdk-overlay-dark-backdrop {\n background: rgba(0, 0, 0, 0.288); }\n\n.cdk-overlay-transparent-backdrop, .cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {\n opacity: 0; }\n\n.cdk-overlay-connected-position-bounding-box {\n position: absolute;\n z-index: 1000;\n display: flex;\n flex-direction: column;\n min-width: 1px;\n min-height: 1px; }\n\n.cdk-global-scrollblock {\n position: fixed;\n width: 100%;\n overflow-y: scroll; }\n\n@keyframes cdk-text-field-autofill-start {\n /*!*/ }\n\n@keyframes cdk-text-field-autofill-end {\n /*!*/ }\n\n.cdk-text-field-autofill-monitored:-webkit-autofill {\n animation-name: cdk-text-field-autofill-start; }\n\n.cdk-text-field-autofill-monitored:not(:-webkit-autofill) {\n animation-name: cdk-text-field-autofill-end; }\n\ntextarea.cdk-textarea-autosize {\n resize: none; }\n\ntextarea.cdk-textarea-autosize-measuring {\n height: auto !important;\n overflow: hidden !important;\n padding: 2px 0 !important;\n box-sizing: content-box !important; }\n\n.mat-ripple-element {\n background-color: rgba(0, 0, 0, 0.1); }\n\n.mat-option {\n color: rgba(0, 0, 0, 0.87); }\n .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) {\n background: rgba(0, 0, 0, 0.04); }\n .mat-option.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {\n background: rgba(0, 0, 0, 0.04); }\n .mat-option.mat-active {\n background: rgba(0, 0, 0, 0.04);\n color: rgba(0, 0, 0, 0.87); }\n .mat-option.mat-option-disabled {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {\n color: #1565c0; }\n\n.mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {\n color: #689f38; }\n\n.mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {\n color: #f44336; }\n\n.mat-optgroup-label {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-optgroup-disabled .mat-optgroup-label {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-pseudo-checkbox {\n color: rgba(0, 0, 0, 0.54); }\n .mat-pseudo-checkbox::after {\n color: #fafafa; }\n\n.mat-pseudo-checkbox-checked,\n.mat-pseudo-checkbox-indeterminate,\n.mat-accent .mat-pseudo-checkbox-checked,\n.mat-accent .mat-pseudo-checkbox-indeterminate {\n background: #689f38; }\n\n.mat-primary .mat-pseudo-checkbox-checked,\n.mat-primary .mat-pseudo-checkbox-indeterminate {\n background: #1565c0; }\n\n.mat-warn .mat-pseudo-checkbox-checked,\n.mat-warn .mat-pseudo-checkbox-indeterminate {\n background: #f44336; }\n\n.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled,\n.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {\n background: #b0b0b0; }\n\n.mat-app-background {\n background-color: #fafafa;\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-theme-loaded-marker {\n display: none; }\n\n.mat-autocomplete-panel {\n background: white;\n color: rgba(0, 0, 0, 0.87); }\n .mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active):not(:hover) {\n background: white; }\n .mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active):not(:hover):not(.mat-option-disabled) {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-badge-content {\n color: white;\n background: #1565c0; }\n\n.mat-badge-accent .mat-badge-content {\n background: #689f38;\n color: white; }\n\n.mat-badge-warn .mat-badge-content {\n color: white;\n background: #f44336; }\n\n.mat-badge {\n position: relative; }\n\n.mat-badge-hidden .mat-badge-content {\n display: none; }\n\n.mat-badge-content {\n position: absolute;\n text-align: center;\n display: inline-block;\n border-radius: 50%;\n transition: transform 200ms ease-in-out;\n transform: scale(0.6);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n pointer-events: none; }\n\n.mat-badge-content.mat-badge-active {\n transform: none; }\n\n.mat-badge-small .mat-badge-content {\n width: 16px;\n height: 16px;\n line-height: 16px; }\n @media screen and (-ms-high-contrast: active) {\n .mat-badge-small .mat-badge-content {\n outline: solid 1px;\n border-radius: 0; } }\n\n.mat-badge-small.mat-badge-above .mat-badge-content {\n top: -8px; }\n\n.mat-badge-small.mat-badge-below .mat-badge-content {\n bottom: -8px; }\n\n.mat-badge-small.mat-badge-before .mat-badge-content {\n left: -16px; }\n\n[dir='rtl'] .mat-badge-small.mat-badge-before .mat-badge-content {\n left: auto;\n right: -16px; }\n\n.mat-badge-small.mat-badge-after .mat-badge-content {\n right: -16px; }\n\n[dir='rtl'] .mat-badge-small.mat-badge-after .mat-badge-content {\n right: auto;\n left: -16px; }\n\n.mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {\n left: -8px; }\n\n[dir='rtl'] .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {\n left: auto;\n right: -8px; }\n\n.mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {\n right: -8px; }\n\n[dir='rtl'] .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {\n right: auto;\n left: -8px; }\n\n.mat-badge-medium .mat-badge-content {\n width: 22px;\n height: 22px;\n line-height: 22px; }\n @media screen and (-ms-high-contrast: active) {\n .mat-badge-medium .mat-badge-content {\n outline: solid 1px;\n border-radius: 0; } }\n\n.mat-badge-medium.mat-badge-above .mat-badge-content {\n top: -11px; }\n\n.mat-badge-medium.mat-badge-below .mat-badge-content {\n bottom: -11px; }\n\n.mat-badge-medium.mat-badge-before .mat-badge-content {\n left: -22px; }\n\n[dir='rtl'] .mat-badge-medium.mat-badge-before .mat-badge-content {\n left: auto;\n right: -22px; }\n\n.mat-badge-medium.mat-badge-after .mat-badge-content {\n right: -22px; }\n\n[dir='rtl'] .mat-badge-medium.mat-badge-after .mat-badge-content {\n right: auto;\n left: -22px; }\n\n.mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {\n left: -11px; }\n\n[dir='rtl'] .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {\n left: auto;\n right: -11px; }\n\n.mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {\n right: -11px; }\n\n[dir='rtl'] .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {\n right: auto;\n left: -11px; }\n\n.mat-badge-large .mat-badge-content {\n width: 28px;\n height: 28px;\n line-height: 28px; }\n @media screen and (-ms-high-contrast: active) {\n .mat-badge-large .mat-badge-content {\n outline: solid 1px;\n border-radius: 0; } }\n\n.mat-badge-large.mat-badge-above .mat-badge-content {\n top: -14px; }\n\n.mat-badge-large.mat-badge-below .mat-badge-content {\n bottom: -14px; }\n\n.mat-badge-large.mat-badge-before .mat-badge-content {\n left: -28px; }\n\n[dir='rtl'] .mat-badge-large.mat-badge-before .mat-badge-content {\n left: auto;\n right: -28px; }\n\n.mat-badge-large.mat-badge-after .mat-badge-content {\n right: -28px; }\n\n[dir='rtl'] .mat-badge-large.mat-badge-after .mat-badge-content {\n right: auto;\n left: -28px; }\n\n.mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {\n left: -14px; }\n\n[dir='rtl'] .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {\n left: auto;\n right: -14px; }\n\n.mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {\n right: -14px; }\n\n[dir='rtl'] .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {\n right: auto;\n left: -14px; }\n\n.mat-bottom-sheet-container {\n background: white;\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-button, .mat-icon-button, .mat-stroked-button {\n color: inherit;\n background: transparent; }\n .mat-button.mat-primary, .mat-icon-button.mat-primary, .mat-stroked-button.mat-primary {\n color: #1565c0; }\n .mat-button.mat-accent, .mat-icon-button.mat-accent, .mat-stroked-button.mat-accent {\n color: #689f38; }\n .mat-button.mat-warn, .mat-icon-button.mat-warn, .mat-stroked-button.mat-warn {\n color: #f44336; }\n .mat-button.mat-primary[disabled], .mat-button.mat-accent[disabled], .mat-button.mat-warn[disabled], .mat-button[disabled][disabled], .mat-icon-button.mat-primary[disabled], .mat-icon-button.mat-accent[disabled], .mat-icon-button.mat-warn[disabled], .mat-icon-button[disabled][disabled], .mat-stroked-button.mat-primary[disabled], .mat-stroked-button.mat-accent[disabled], .mat-stroked-button.mat-warn[disabled], .mat-stroked-button[disabled][disabled] {\n color: rgba(0, 0, 0, 0.26); }\n .mat-button.mat-primary .mat-button-focus-overlay, .mat-icon-button.mat-primary .mat-button-focus-overlay, .mat-stroked-button.mat-primary .mat-button-focus-overlay {\n background-color: rgba(21, 101, 192, 0.12); }\n .mat-button.mat-accent .mat-button-focus-overlay, .mat-icon-button.mat-accent .mat-button-focus-overlay, .mat-stroked-button.mat-accent .mat-button-focus-overlay {\n background-color: rgba(104, 159, 56, 0.12); }\n .mat-button.mat-warn .mat-button-focus-overlay, .mat-icon-button.mat-warn .mat-button-focus-overlay, .mat-stroked-button.mat-warn .mat-button-focus-overlay {\n background-color: rgba(244, 67, 54, 0.12); }\n .mat-button[disabled] .mat-button-focus-overlay, .mat-icon-button[disabled] .mat-button-focus-overlay, .mat-stroked-button[disabled] .mat-button-focus-overlay {\n background-color: transparent; }\n .mat-button.mat-primary .mat-ripple-element, .mat-icon-button.mat-primary .mat-ripple-element, .mat-stroked-button.mat-primary .mat-ripple-element {\n background-color: rgba(21, 101, 192, 0.1); }\n .mat-button.mat-accent .mat-ripple-element, .mat-icon-button.mat-accent .mat-ripple-element, .mat-stroked-button.mat-accent .mat-ripple-element {\n background-color: rgba(104, 159, 56, 0.1); }\n .mat-button.mat-warn .mat-ripple-element, .mat-icon-button.mat-warn .mat-ripple-element, .mat-stroked-button.mat-warn .mat-ripple-element {\n background-color: rgba(244, 67, 54, 0.1); }\n\n.mat-flat-button, .mat-raised-button, .mat-fab, .mat-mini-fab {\n color: rgba(0, 0, 0, 0.87);\n background-color: white; }\n .mat-flat-button.mat-primary, .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {\n color: white; }\n .mat-flat-button.mat-accent, .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {\n color: white; }\n .mat-flat-button.mat-warn, .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {\n color: white; }\n .mat-flat-button.mat-primary[disabled], .mat-flat-button.mat-accent[disabled], .mat-flat-button.mat-warn[disabled], .mat-flat-button[disabled][disabled], .mat-raised-button.mat-primary[disabled], .mat-raised-button.mat-accent[disabled], .mat-raised-button.mat-warn[disabled], .mat-raised-button[disabled][disabled], .mat-fab.mat-primary[disabled], .mat-fab.mat-accent[disabled], .mat-fab.mat-warn[disabled], .mat-fab[disabled][disabled], .mat-mini-fab.mat-primary[disabled], .mat-mini-fab.mat-accent[disabled], .mat-mini-fab.mat-warn[disabled], .mat-mini-fab[disabled][disabled] {\n color: rgba(0, 0, 0, 0.26); }\n .mat-flat-button.mat-primary, .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {\n background-color: #1565c0; }\n .mat-flat-button.mat-accent, .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {\n background-color: #689f38; }\n .mat-flat-button.mat-warn, .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {\n background-color: #f44336; }\n .mat-flat-button.mat-primary[disabled], .mat-flat-button.mat-accent[disabled], .mat-flat-button.mat-warn[disabled], .mat-flat-button[disabled][disabled], .mat-raised-button.mat-primary[disabled], .mat-raised-button.mat-accent[disabled], .mat-raised-button.mat-warn[disabled], .mat-raised-button[disabled][disabled], .mat-fab.mat-primary[disabled], .mat-fab.mat-accent[disabled], .mat-fab.mat-warn[disabled], .mat-fab[disabled][disabled], .mat-mini-fab.mat-primary[disabled], .mat-mini-fab.mat-accent[disabled], .mat-mini-fab.mat-warn[disabled], .mat-mini-fab[disabled][disabled] {\n background-color: rgba(0, 0, 0, 0.12); }\n .mat-flat-button.mat-primary .mat-ripple-element, .mat-raised-button.mat-primary .mat-ripple-element, .mat-fab.mat-primary .mat-ripple-element, .mat-mini-fab.mat-primary .mat-ripple-element {\n background-color: rgba(255, 255, 255, 0.1); }\n .mat-flat-button.mat-accent .mat-ripple-element, .mat-raised-button.mat-accent .mat-ripple-element, .mat-fab.mat-accent .mat-ripple-element, .mat-mini-fab.mat-accent .mat-ripple-element {\n background-color: rgba(255, 255, 255, 0.1); }\n .mat-flat-button.mat-warn .mat-ripple-element, .mat-raised-button.mat-warn .mat-ripple-element, .mat-fab.mat-warn .mat-ripple-element, .mat-mini-fab.mat-warn .mat-ripple-element {\n background-color: rgba(255, 255, 255, 0.1); }\n\n.mat-icon-button.mat-primary .mat-ripple-element {\n background-color: rgba(21, 101, 192, 0.2); }\n\n.mat-icon-button.mat-accent .mat-ripple-element {\n background-color: rgba(104, 159, 56, 0.2); }\n\n.mat-icon-button.mat-warn .mat-ripple-element {\n background-color: rgba(244, 67, 54, 0.2); }\n\n.mat-button-toggle {\n color: rgba(0, 0, 0, 0.38); }\n .mat-button-toggle .mat-button-toggle-focus-overlay {\n background-color: rgba(0, 0, 0, 0.12); }\n\n.mat-button-toggle-checked {\n background-color: #e0e0e0;\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-button-toggle-disabled {\n background-color: #eeeeee;\n color: rgba(0, 0, 0, 0.26); }\n .mat-button-toggle-disabled.mat-button-toggle-checked {\n background-color: #bdbdbd; }\n\n.mat-card {\n background: white;\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-card-subtitle {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-checkbox-frame {\n border-color: rgba(0, 0, 0, 0.54); }\n\n.mat-checkbox-checkmark {\n fill: #fafafa; }\n\n.mat-checkbox-checkmark-path {\n stroke: #fafafa !important; }\n @media screen and (-ms-high-contrast: black-on-white) {\n .mat-checkbox-checkmark-path {\n stroke: #000 !important; } }\n\n.mat-checkbox-mixedmark {\n background-color: #fafafa; }\n\n.mat-checkbox-indeterminate.mat-primary .mat-checkbox-background, .mat-checkbox-checked.mat-primary .mat-checkbox-background {\n background-color: #1565c0; }\n\n.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background {\n background-color: #689f38; }\n\n.mat-checkbox-indeterminate.mat-warn .mat-checkbox-background, .mat-checkbox-checked.mat-warn .mat-checkbox-background {\n background-color: #f44336; }\n\n.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {\n background-color: #b0b0b0; }\n\n.mat-checkbox-disabled:not(.mat-checkbox-checked) .mat-checkbox-frame {\n border-color: #b0b0b0; }\n\n.mat-checkbox-disabled .mat-checkbox-label {\n color: #b0b0b0; }\n\n@media screen and (-ms-high-contrast: active) {\n .mat-checkbox-disabled {\n opacity: 0.5; } }\n\n@media screen and (-ms-high-contrast: active) {\n .mat-checkbox-background {\n background: none; } }\n\n.mat-checkbox:not(.mat-checkbox-disabled).mat-primary .mat-checkbox-ripple .mat-ripple-element {\n background-color: rgba(21, 101, 192, 0.26); }\n\n.mat-checkbox:not(.mat-checkbox-disabled).mat-accent .mat-checkbox-ripple .mat-ripple-element {\n background-color: rgba(104, 159, 56, 0.26); }\n\n.mat-checkbox:not(.mat-checkbox-disabled).mat-warn .mat-checkbox-ripple .mat-ripple-element {\n background-color: rgba(244, 67, 54, 0.26); }\n\n.mat-chip.mat-standard-chip {\n background-color: #e0e0e0;\n color: rgba(0, 0, 0, 0.87); }\n .mat-chip.mat-standard-chip .mat-chip-remove {\n color: rgba(0, 0, 0, 0.87);\n opacity: 0.4; }\n .mat-chip.mat-standard-chip .mat-chip-remove:hover {\n opacity: 0.54; }\n\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary {\n background-color: #1565c0;\n color: white; }\n .mat-chip.mat-standard-chip.mat-chip-selected.mat-primary .mat-chip-remove {\n color: white;\n opacity: 0.4; }\n .mat-chip.mat-standard-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover {\n opacity: 0.54; }\n\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn {\n background-color: #f44336;\n color: white; }\n .mat-chip.mat-standard-chip.mat-chip-selected.mat-warn .mat-chip-remove {\n color: white;\n opacity: 0.4; }\n .mat-chip.mat-standard-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover {\n opacity: 0.54; }\n\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent {\n background-color: #689f38;\n color: white; }\n .mat-chip.mat-standard-chip.mat-chip-selected.mat-accent .mat-chip-remove {\n color: white;\n opacity: 0.4; }\n .mat-chip.mat-standard-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover {\n opacity: 0.54; }\n\n.mat-table {\n background: white; }\n\n.mat-table thead, .mat-table tbody, .mat-table tfoot,\nmat-header-row, mat-row, mat-footer-row,\n[mat-header-row], [mat-row], [mat-footer-row],\n.mat-table-sticky {\n background: inherit; }\n\nmat-row, mat-header-row, mat-footer-row,\nth.mat-header-cell, td.mat-cell, td.mat-footer-cell {\n border-bottom-color: rgba(0, 0, 0, 0.12); }\n\n.mat-header-cell {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-cell, .mat-footer-cell {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-calendar-arrow {\n border-top-color: rgba(0, 0, 0, 0.54); }\n\n.mat-datepicker-toggle,\n.mat-datepicker-content .mat-calendar-next-button,\n.mat-datepicker-content .mat-calendar-previous-button {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-calendar-table-header {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-calendar-table-header-divider::after {\n background: rgba(0, 0, 0, 0.12); }\n\n.mat-calendar-body-label {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-calendar-body-cell-content {\n color: rgba(0, 0, 0, 0.87);\n border-color: transparent; }\n\n.mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),\n.cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),\n.cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {\n background-color: rgba(0, 0, 0, 0.04); }\n\n.mat-calendar-body-today:not(.mat-calendar-body-selected) {\n border-color: rgba(0, 0, 0, 0.38); }\n\n.mat-calendar-body-disabled > .mat-calendar-body-today:not(.mat-calendar-body-selected) {\n border-color: rgba(0, 0, 0, 0.18); }\n\n.mat-calendar-body-selected {\n background-color: #1565c0;\n color: white; }\n\n.mat-calendar-body-disabled > .mat-calendar-body-selected {\n background-color: rgba(21, 101, 192, 0.4); }\n\n.mat-calendar-body-today.mat-calendar-body-selected {\n box-shadow: inset 0 0 0 1px white; }\n\n.mat-datepicker-content {\n background-color: white;\n color: rgba(0, 0, 0, 0.87); }\n .mat-datepicker-content.mat-accent .mat-calendar-body-selected {\n background-color: #689f38;\n color: white; }\n .mat-datepicker-content.mat-accent .mat-calendar-body-disabled > .mat-calendar-body-selected {\n background-color: rgba(104, 159, 56, 0.4); }\n .mat-datepicker-content.mat-accent .mat-calendar-body-today.mat-calendar-body-selected {\n box-shadow: inset 0 0 0 1px white; }\n .mat-datepicker-content.mat-warn .mat-calendar-body-selected {\n background-color: #f44336;\n color: white; }\n .mat-datepicker-content.mat-warn .mat-calendar-body-disabled > .mat-calendar-body-selected {\n background-color: rgba(244, 67, 54, 0.4); }\n .mat-datepicker-content.mat-warn .mat-calendar-body-today.mat-calendar-body-selected {\n box-shadow: inset 0 0 0 1px white; }\n\n.mat-datepicker-toggle-active {\n color: #1565c0; }\n .mat-datepicker-toggle-active.mat-accent {\n color: #689f38; }\n .mat-datepicker-toggle-active.mat-warn {\n color: #f44336; }\n\n.mat-dialog-container {\n background: white;\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-divider {\n border-top-color: rgba(0, 0, 0, 0.12); }\n\n.mat-divider-vertical {\n border-right-color: rgba(0, 0, 0, 0.12); }\n\n.mat-expansion-panel {\n background: white;\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-action-row {\n border-top-color: rgba(0, 0, 0, 0.12); }\n\n.mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:not([aria-disabled='true']):hover {\n background: rgba(0, 0, 0, 0.04); }\n\n@media (hover: none) {\n .mat-expansion-panel:not(.mat-expanded):not([aria-disabled='true'])\n.mat-expansion-panel-header:hover {\n background: white; } }\n\n.mat-expansion-panel-header-title {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-expansion-panel-header-description,\n.mat-expansion-indicator::after {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-expansion-panel-header[aria-disabled='true'] {\n color: rgba(0, 0, 0, 0.26); }\n .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title,\n .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description {\n color: inherit; }\n\n.mat-form-field-label {\n color: rgba(0, 0, 0, 0.6); }\n\n.mat-hint {\n color: rgba(0, 0, 0, 0.6); }\n\n.mat-form-field.mat-focused .mat-form-field-label {\n color: #1565c0; }\n .mat-form-field.mat-focused .mat-form-field-label.mat-accent {\n color: #689f38; }\n .mat-form-field.mat-focused .mat-form-field-label.mat-warn {\n color: #f44336; }\n\n.mat-focused .mat-form-field-required-marker {\n color: #689f38; }\n\n.mat-form-field-ripple {\n background-color: rgba(0, 0, 0, 0.87); }\n\n.mat-form-field.mat-focused .mat-form-field-ripple {\n background-color: #1565c0; }\n .mat-form-field.mat-focused .mat-form-field-ripple.mat-accent {\n background-color: #689f38; }\n .mat-form-field.mat-focused .mat-form-field-ripple.mat-warn {\n background-color: #f44336; }\n\n.mat-form-field.mat-form-field-invalid .mat-form-field-label {\n color: #f44336; }\n .mat-form-field.mat-form-field-invalid .mat-form-field-label.mat-accent,\n .mat-form-field.mat-form-field-invalid .mat-form-field-label .mat-form-field-required-marker {\n color: #f44336; }\n\n.mat-form-field.mat-form-field-invalid .mat-form-field-ripple,\n.mat-form-field.mat-form-field-invalid .mat-form-field-ripple.mat-accent {\n background-color: #f44336; }\n\n.mat-error {\n color: #f44336; }\n\n.mat-form-field-appearance-legacy .mat-form-field-label {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-form-field-appearance-legacy .mat-hint {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-form-field-appearance-legacy .mat-form-field-underline {\n background-color: rgba(0, 0, 0, 0.42); }\n\n.mat-form-field-appearance-legacy.mat-form-field-disabled .mat-form-field-underline {\n background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%);\n background-size: 4px 100%;\n background-repeat: repeat-x; }\n\n.mat-form-field-appearance-standard .mat-form-field-underline {\n background-color: rgba(0, 0, 0, 0.42); }\n\n.mat-form-field-appearance-standard.mat-form-field-disabled .mat-form-field-underline {\n background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%);\n background-size: 4px 100%;\n background-repeat: repeat-x; }\n\n.mat-form-field-appearance-fill .mat-form-field-flex {\n background-color: rgba(0, 0, 0, 0.04); }\n\n.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-flex {\n background-color: rgba(0, 0, 0, 0.02); }\n\n.mat-form-field-appearance-fill .mat-form-field-underline::before {\n background-color: rgba(0, 0, 0, 0.42); }\n\n.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-underline::before {\n background-color: transparent; }\n\n.mat-form-field-appearance-outline .mat-form-field-outline {\n color: rgba(0, 0, 0, 0.12); }\n\n.mat-form-field-appearance-outline .mat-form-field-outline-thick {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick {\n color: #1565c0; }\n\n.mat-form-field-appearance-outline.mat-focused.mat-accent .mat-form-field-outline-thick {\n color: #689f38; }\n\n.mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick {\n color: #f44336; }\n\n.mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick {\n color: #f44336; }\n\n.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline {\n color: rgba(0, 0, 0, 0.06); }\n\n.mat-icon.mat-primary {\n color: #1565c0; }\n\n.mat-icon.mat-accent {\n color: #689f38; }\n\n.mat-icon.mat-warn {\n color: #f44336; }\n\n.mat-input-element:disabled {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-input-element {\n caret-color: #1565c0; }\n .mat-input-element::placeholder {\n color: rgba(0, 0, 0, 0.42); }\n .mat-input-element::-moz-placeholder {\n color: rgba(0, 0, 0, 0.42); }\n .mat-input-element::-webkit-input-placeholder {\n color: rgba(0, 0, 0, 0.42); }\n .mat-input-element:-ms-input-placeholder {\n color: rgba(0, 0, 0, 0.42); }\n\n.mat-accent .mat-input-element {\n caret-color: #689f38; }\n\n.mat-warn .mat-input-element,\n.mat-form-field-invalid .mat-input-element {\n caret-color: #f44336; }\n\n.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-list-item-disabled {\n background-color: #eeeeee; }\n\n.mat-list-option:hover, .mat-list-option.mat-list-item-focus,\n.mat-nav-list .mat-list-item:hover,\n.mat-nav-list .mat-list-item.mat-list-item-focus {\n background: rgba(0, 0, 0, 0.04); }\n\n.mat-menu-panel {\n background: white; }\n\n.mat-menu-item {\n background: transparent;\n color: rgba(0, 0, 0, 0.87); }\n .mat-menu-item[disabled], .mat-menu-item[disabled]::after {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-menu-item .mat-icon:not([color]),\n.mat-menu-item-submenu-trigger::after {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-menu-item:hover:not([disabled]),\n.mat-menu-item.cdk-program-focused:not([disabled]),\n.mat-menu-item.cdk-keyboard-focused:not([disabled]),\n.mat-menu-item-highlighted:not([disabled]) {\n background: rgba(0, 0, 0, 0.04); }\n\n.mat-paginator {\n background: white; }\n\n.mat-paginator,\n.mat-paginator-page-size .mat-select-trigger {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-paginator-decrement,\n.mat-paginator-increment {\n border-top: 2px solid rgba(0, 0, 0, 0.54);\n border-right: 2px solid rgba(0, 0, 0, 0.54); }\n\n.mat-paginator-first,\n.mat-paginator-last {\n border-top: 2px solid rgba(0, 0, 0, 0.54); }\n\n.mat-icon-button[disabled] .mat-paginator-decrement,\n.mat-icon-button[disabled] .mat-paginator-increment,\n.mat-icon-button[disabled] .mat-paginator-first,\n.mat-icon-button[disabled] .mat-paginator-last {\n border-color: rgba(0, 0, 0, 0.38); }\n\n.mat-progress-bar-background {\n fill: #64b5f6; }\n\n.mat-progress-bar-buffer {\n background-color: #64b5f6; }\n\n.mat-progress-bar-fill::after {\n background-color: #1565c0; }\n\n.mat-progress-bar.mat-accent .mat-progress-bar-background {\n fill: #dcedc8; }\n\n.mat-progress-bar.mat-accent .mat-progress-bar-buffer {\n background-color: #dcedc8; }\n\n.mat-progress-bar.mat-accent .mat-progress-bar-fill::after {\n background-color: #689f38; }\n\n.mat-progress-bar.mat-warn .mat-progress-bar-background {\n fill: #ffcdd2; }\n\n.mat-progress-bar.mat-warn .mat-progress-bar-buffer {\n background-color: #ffcdd2; }\n\n.mat-progress-bar.mat-warn .mat-progress-bar-fill::after {\n background-color: #f44336; }\n\n.mat-progress-spinner circle, .mat-spinner circle {\n stroke: #1565c0; }\n\n.mat-progress-spinner.mat-accent circle, .mat-spinner.mat-accent circle {\n stroke: #689f38; }\n\n.mat-progress-spinner.mat-warn circle, .mat-spinner.mat-warn circle {\n stroke: #f44336; }\n\n.mat-radio-outer-circle {\n border-color: rgba(0, 0, 0, 0.54); }\n\n.mat-radio-button.mat-primary.mat-radio-checked .mat-radio-outer-circle {\n border-color: #1565c0; }\n\n.mat-radio-button.mat-primary .mat-radio-inner-circle {\n background-color: #1565c0; }\n\n.mat-radio-button.mat-primary .mat-radio-ripple .mat-ripple-element {\n background-color: rgba(21, 101, 192, 0.26); }\n\n.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {\n border-color: #689f38; }\n\n.mat-radio-button.mat-accent .mat-radio-inner-circle {\n background-color: #689f38; }\n\n.mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {\n background-color: rgba(104, 159, 56, 0.26); }\n\n.mat-radio-button.mat-warn.mat-radio-checked .mat-radio-outer-circle {\n border-color: #f44336; }\n\n.mat-radio-button.mat-warn .mat-radio-inner-circle {\n background-color: #f44336; }\n\n.mat-radio-button.mat-warn .mat-radio-ripple .mat-ripple-element {\n background-color: rgba(244, 67, 54, 0.26); }\n\n.mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-outer-circle,\n.mat-radio-button.mat-radio-disabled .mat-radio-outer-circle {\n border-color: rgba(0, 0, 0, 0.38); }\n\n.mat-radio-button.mat-radio-disabled .mat-radio-ripple .mat-ripple-element,\n.mat-radio-button.mat-radio-disabled .mat-radio-inner-circle {\n background-color: rgba(0, 0, 0, 0.38); }\n\n.mat-radio-button.mat-radio-disabled .mat-radio-label-content {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-select-content, .mat-select-panel-done-animating {\n background: white; }\n\n.mat-select-value {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-select-placeholder {\n color: rgba(0, 0, 0, 0.42); }\n\n.mat-select-disabled .mat-select-value {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-select-arrow {\n color: rgba(0, 0, 0, 0.54); }\n\n.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) {\n background: rgba(0, 0, 0, 0.12); }\n\n.mat-form-field.mat-focused.mat-primary .mat-select-arrow {\n color: #1565c0; }\n\n.mat-form-field.mat-focused.mat-accent .mat-select-arrow {\n color: #689f38; }\n\n.mat-form-field.mat-focused.mat-warn .mat-select-arrow {\n color: #f44336; }\n\n.mat-form-field .mat-select.mat-select-invalid .mat-select-arrow {\n color: #f44336; }\n\n.mat-form-field .mat-select.mat-select-disabled .mat-select-arrow {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-drawer-container {\n background-color: #fafafa;\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-drawer {\n background-color: white;\n color: rgba(0, 0, 0, 0.87); }\n .mat-drawer.mat-drawer-push {\n background-color: white; }\n\n.mat-drawer-backdrop.mat-drawer-shown {\n background-color: rgba(0, 0, 0, 0.6); }\n\n.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {\n background-color: #8bc34a; }\n\n.mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {\n background-color: rgba(139, 195, 74, 0.5); }\n\n.mat-slide-toggle:not(.mat-checked) .mat-ripple-element {\n background-color: rgba(0, 0, 0, 0.06); }\n\n.mat-slide-toggle .mat-ripple-element {\n background-color: rgba(139, 195, 74, 0.12); }\n\n.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {\n background-color: #2196f3; }\n\n.mat-slide-toggle.mat-primary.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {\n background-color: rgba(33, 150, 243, 0.5); }\n\n.mat-slide-toggle.mat-primary:not(.mat-checked) .mat-ripple-element {\n background-color: rgba(0, 0, 0, 0.06); }\n\n.mat-slide-toggle.mat-primary .mat-ripple-element {\n background-color: rgba(33, 150, 243, 0.12); }\n\n.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {\n background-color: #f44336; }\n\n.mat-slide-toggle.mat-warn.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {\n background-color: rgba(244, 67, 54, 0.5); }\n\n.mat-slide-toggle.mat-warn:not(.mat-checked) .mat-ripple-element {\n background-color: rgba(0, 0, 0, 0.06); }\n\n.mat-slide-toggle.mat-warn .mat-ripple-element {\n background-color: rgba(244, 67, 54, 0.12); }\n\n.mat-disabled .mat-slide-toggle-thumb {\n background-color: #bdbdbd; }\n\n.mat-disabled .mat-slide-toggle-bar {\n background-color: rgba(0, 0, 0, 0.1); }\n\n.mat-slide-toggle-thumb {\n background-color: #fafafa; }\n\n.mat-slide-toggle-bar {\n background-color: rgba(0, 0, 0, 0.38); }\n\n.mat-slider-track-background {\n background-color: rgba(0, 0, 0, 0.26); }\n\n.mat-primary .mat-slider-track-fill,\n.mat-primary .mat-slider-thumb,\n.mat-primary .mat-slider-thumb-label {\n background-color: #1565c0; }\n\n.mat-primary .mat-slider-thumb-label-text {\n color: white; }\n\n.mat-accent .mat-slider-track-fill,\n.mat-accent .mat-slider-thumb,\n.mat-accent .mat-slider-thumb-label {\n background-color: #689f38; }\n\n.mat-accent .mat-slider-thumb-label-text {\n color: white; }\n\n.mat-warn .mat-slider-track-fill,\n.mat-warn .mat-slider-thumb,\n.mat-warn .mat-slider-thumb-label {\n background-color: #f44336; }\n\n.mat-warn .mat-slider-thumb-label-text {\n color: white; }\n\n.mat-slider-focus-ring {\n background-color: rgba(104, 159, 56, 0.2); }\n\n.mat-slider:hover .mat-slider-track-background,\n.cdk-focused .mat-slider-track-background {\n background-color: rgba(0, 0, 0, 0.38); }\n\n.mat-slider-disabled .mat-slider-track-background,\n.mat-slider-disabled .mat-slider-track-fill,\n.mat-slider-disabled .mat-slider-thumb {\n background-color: rgba(0, 0, 0, 0.26); }\n\n.mat-slider-disabled:hover .mat-slider-track-background {\n background-color: rgba(0, 0, 0, 0.26); }\n\n.mat-slider-min-value .mat-slider-focus-ring {\n background-color: rgba(0, 0, 0, 0.12); }\n\n.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb,\n.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label {\n background-color: rgba(0, 0, 0, 0.87); }\n\n.mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb,\n.mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label {\n background-color: rgba(0, 0, 0, 0.26); }\n\n.mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb {\n border-color: rgba(0, 0, 0, 0.26);\n background-color: transparent; }\n\n.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused .mat-slider-thumb {\n border-color: rgba(0, 0, 0, 0.38); }\n\n.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover.mat-slider-disabled .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused.mat-slider-disabled .mat-slider-thumb {\n border-color: rgba(0, 0, 0, 0.26); }\n\n.mat-slider-has-ticks .mat-slider-wrapper::after {\n border-color: rgba(0, 0, 0, 0.7); }\n\n.mat-slider-horizontal .mat-slider-ticks {\n background-image: repeating-linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);\n background-image: -moz-repeating-linear-gradient(0.0001deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent); }\n\n.mat-slider-vertical .mat-slider-ticks {\n background-image: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent); }\n\n.mat-step-header.cdk-keyboard-focused, .mat-step-header.cdk-program-focused, .mat-step-header:hover {\n background-color: rgba(0, 0, 0, 0.04); }\n\n.mat-step-header .mat-step-label,\n.mat-step-header .mat-step-optional {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-step-header .mat-step-icon {\n background-color: #1565c0;\n color: white; }\n\n.mat-step-header .mat-step-icon-not-touched {\n background-color: rgba(0, 0, 0, 0.38);\n color: white; }\n\n.mat-step-header .mat-step-label.mat-step-label-active {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-stepper-horizontal, .mat-stepper-vertical {\n background-color: white; }\n\n.mat-stepper-vertical-line::before {\n border-left-color: rgba(0, 0, 0, 0.12); }\n\n.mat-stepper-horizontal-line {\n border-top-color: rgba(0, 0, 0, 0.12); }\n\n.mat-sort-header-arrow {\n color: #757575; }\n\n.mat-tab-nav-bar,\n.mat-tab-header {\n border-bottom: 1px solid rgba(0, 0, 0, 0.12); }\n\n.mat-tab-group-inverted-header .mat-tab-nav-bar,\n.mat-tab-group-inverted-header .mat-tab-header {\n border-top: 1px solid rgba(0, 0, 0, 0.12);\n border-bottom: none; }\n\n.mat-tab-label, .mat-tab-link {\n color: rgba(0, 0, 0, 0.87); }\n .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {\n color: rgba(0, 0, 0, 0.38); }\n\n.mat-tab-header-pagination-chevron {\n border-color: rgba(0, 0, 0, 0.87); }\n\n.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n border-color: rgba(0, 0, 0, 0.38); }\n\n.mat-tab-group[class*='mat-background-'] .mat-tab-header,\n.mat-tab-nav-bar[class*='mat-background-'] {\n border-bottom: none;\n border-top: none; }\n\n.mat-tab-group.mat-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n background-color: rgba(100, 181, 246, 0.3); }\n\n.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar {\n background-color: #1565c0; }\n\n.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar {\n background-color: white; }\n\n.mat-tab-group.mat-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n background-color: rgba(220, 237, 200, 0.3); }\n\n.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar {\n background-color: #689f38; }\n\n.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar {\n background-color: white; }\n\n.mat-tab-group.mat-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n background-color: rgba(255, 205, 210, 0.3); }\n\n.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar {\n background-color: #f44336; }\n\n.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar {\n background-color: white; }\n\n.mat-tab-group.mat-background-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-background-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n background-color: rgba(100, 181, 246, 0.3); }\n\n.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links {\n background-color: #1565c0; }\n\n.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link {\n color: white; }\n .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled {\n color: rgba(255, 255, 255, 0.4); }\n\n.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron {\n border-color: white; }\n\n.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n border-color: rgba(255, 255, 255, 0.4); }\n\n.mat-tab-group.mat-background-primary .mat-ripple-element, .mat-tab-nav-bar.mat-background-primary .mat-ripple-element {\n background-color: rgba(255, 255, 255, 0.12); }\n\n.mat-tab-group.mat-background-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-background-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n background-color: rgba(220, 237, 200, 0.3); }\n\n.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links {\n background-color: #689f38; }\n\n.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link {\n color: white; }\n .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled {\n color: rgba(255, 255, 255, 0.4); }\n\n.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron {\n border-color: white; }\n\n.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n border-color: rgba(255, 255, 255, 0.4); }\n\n.mat-tab-group.mat-background-accent .mat-ripple-element, .mat-tab-nav-bar.mat-background-accent .mat-ripple-element {\n background-color: rgba(255, 255, 255, 0.12); }\n\n.mat-tab-group.mat-background-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-background-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n background-color: rgba(255, 205, 210, 0.3); }\n\n.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links {\n background-color: #f44336; }\n\n.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link {\n color: white; }\n .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled {\n color: rgba(255, 255, 255, 0.4); }\n\n.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron {\n border-color: white; }\n\n.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n border-color: rgba(255, 255, 255, 0.4); }\n\n.mat-tab-group.mat-background-warn .mat-ripple-element, .mat-tab-nav-bar.mat-background-warn .mat-ripple-element {\n background-color: rgba(255, 255, 255, 0.12); }\n\n.mat-toolbar {\n background: whitesmoke;\n color: rgba(0, 0, 0, 0.87); }\n .mat-toolbar.mat-primary {\n background: #1565c0;\n color: white; }\n .mat-toolbar.mat-accent {\n background: #689f38;\n color: white; }\n .mat-toolbar.mat-warn {\n background: #f44336;\n color: white; }\n .mat-toolbar .mat-form-field-underline,\n .mat-toolbar .mat-form-field-ripple,\n .mat-toolbar .mat-focused .mat-form-field-ripple {\n background-color: currentColor; }\n .mat-toolbar .mat-form-field-label,\n .mat-toolbar .mat-focused .mat-form-field-label,\n .mat-toolbar .mat-select-value,\n .mat-toolbar .mat-select-arrow,\n .mat-toolbar .mat-form-field.mat-focused .mat-select-arrow {\n color: inherit; }\n .mat-toolbar .mat-input-element {\n caret-color: currentColor; }\n\n.mat-tooltip {\n background: rgba(97, 97, 97, 0.9); }\n\n.mat-tree {\n background: white; }\n\n.mat-tree-node {\n color: rgba(0, 0, 0, 0.87); }\n\n.mat-snack-bar-container {\n background: #323232;\n color: white; }\n\n.mat-simple-snackbar-action {\n color: #689f38; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\nbody, html {\n -webkit-font-smoothing: antialiased;\n -webkit-tap-highlight-color: transparent;\n -webkit-touch-callout: none;\n -webkit-text-size-adjust: 100%;\n -ms-text-size-adjust: 100%;\n -moz-osx-font-smoothing: grayscale;\n width: 100%;\n height: 100%;\n position: relative;\n box-sizing: border-box; }\n\nhtml {\n font-size: 62.5%;\n touch-action: manipulation; }\n\nbody {\n font-family: Roboto, \"Helvetica Neue\", sans-serif;\n color: rgba(0, 0, 0, 0.87);\n line-height: 1.42857143;\n font-size: 1.4rem;\n margin: 0;\n overflow: hidden; }\n\nbody {\n box-sizing: inherit; }\n body *, body *:before, body *:after {\n box-sizing: inherit; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.scroll-container, .scroll-container-x {\n width: 100%;\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden; }\n .scroll-container.ps, .scroll-container-x.ps {\n position: relative;\n overflow: hidden; }\n\n.scroll-container-x {\n overflow-y: hidden;\n overflow-x: auto; }\n\nimg {\n display: block; }\n\n.block {\n display: block; }\n\na {\n text-decoration: none;\n color: #1565c0; }\n a.hover-underline {\n color: inherit; }\n a.hover-underline:hover {\n text-decoration: underline; }\n\n.hidden {\n display: none !important;\n visibility: hidden; }\n\n.visually-hidden {\n visibility: hidden;\n pointer-events: none; }\n\n.error {\n color: #F44336; }\n .error.margin-bottom {\n margin-bottom: 20px; }\n .error.margin-top {\n margin-top: 20px; }\n\n.file-over-dropzone * {\n pointer-events: none !important; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.no-results-message {\n width: 100%;\n max-height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n flex-flow: column wrap;\n font-weight: 300;\n color: #43484d; }\n .no-results-message .icon {\n width: 150px;\n height: 150px;\n fill: currentColor;\n margin-top: 25px; }\n .no-results-message .main {\n font-size: 2.6rem;\n font-weight: 500;\n text-align: center; }\n .no-results-message .secondary {\n font-size: 1.7rem;\n font-weight: 400;\n text-align: center; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\nbutton.no-style {\n background: none;\n border: 0;\n color: inherit;\n font: inherit;\n line-height: normal;\n overflow: visible;\n padding: 0;\n border-radius: 0;\n min-width: initial;\n -webkit-user-select: none;\n /* for button */\n -moz-user-select: none;\n -ms-user-select: none;\n outline: none;\n cursor: pointer; }\n\n.mat-flat-button.mat-gray {\n background-color: #f1f1f1;\n color: rgba(0, 0, 0, 0.38);\n border: 1px solid #E0E0E0; }\n .mat-flat-button.mat-gray:hover {\n background-color: #f6f6f6; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.input-container {\n display: block;\n width: 100%; }\n .input-container .error {\n margin-top: 6px;\n color: #F44336; }\n .input-container p {\n color: rgba(0, 0, 0, 0.54);\n font-size: 1.3rem; }\n .input-container label {\n color: inherit;\n display: block;\n padding-bottom: 5px; }\n .input-container input, .input-container select, .input-container textarea, .input-container .fake-input {\n width: 100%;\n height: 46px;\n color: inherit;\n border: 1px solid #E0E0E0;\n padding: 12px;\n line-height: normal;\n font-size: 1.4rem;\n font-family: inherit;\n background-color: inherit;\n box-sizing: border-box;\n border-radius: 4px; }\n .input-container input:invalid, .input-container select:invalid, .input-container textarea:invalid, .input-container .fake-input:invalid {\n box-shadow: none; }\n .input-container input:disabled, .input-container select:disabled, .input-container textarea:disabled, .input-container .fake-input:disabled {\n background-color: #f8f8f8;\n color: rgba(0, 0, 0, 0.38); }\n .input-container textarea {\n height: auto;\n padding: 10px; }\n\n.many-inputs > .input-container {\n margin-bottom: 20px; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.be-modal {\n width: 530px; }\n .be-modal .dialog-loading-bar {\n position: absolute;\n top: 0;\n left: 0; }\n .be-modal .mat-dialog-container {\n position: relative; }\n .be-modal .modal-header {\n display: flex;\n align-items: center;\n position: relative;\n color: #494949;\n margin: 0 0 35px; }\n .be-modal .modal-header > h2 {\n font-size: 1.6rem;\n font-weight: 500;\n flex: 1 1 auto;\n margin: 0;\n line-height: 30px; }\n .be-modal .mat-dialog-content {\n position: relative;\n padding-top: 1px;\n padding-bottom: 1px; }\n .be-modal .mat-dialog-actions {\n justify-content: flex-end;\n padding-bottom: 16px; }\n .be-modal .close-button {\n flex: 0 0 24px;\n width: 24px;\n height: 24px;\n line-height: 24px;\n color: rgba(0, 0, 0, 0.5);\n transition: transform ease 0.2s;\n z-index: 999; }\n .be-modal .close-button:hover {\n transform: rotate(90deg); }\n .be-modal .close-button .mat-icon {\n width: 24px;\n height: 24px; }\n .be-modal .errors {\n color: #F44336; }\n .be-modal .errors > .error {\n padding: 10px 0; }\n .be-modal .errors > .error:last-of-type {\n margin-bottom: 20px; }\n .be-modal .input-container > input, .be-modal .input-container > textarea, .be-modal .input-container select {\n background-color: transparent; }\n .be-modal .input-container > .error {\n color: #F44336; }\n .be-modal .input-container > p {\n margin-top: 8px;\n line-height: 1.5;\n font-size: 1.4rem;\n color: rgba(0, 0, 0, 0.54); }\n .be-modal .no-input-error {\n padding: 10px 0;\n color: #F44336; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.social-icons:empty {\n display: none; }\n\n.social-icons .social-icon {\n width: 31px;\n height: 31px;\n margin-right: 8px;\n border-radius: 3px; }\n .social-icons .social-icon.facebook {\n color: #3b5998;\n background-color: #3b5998; }\n .social-icons .social-icon.facebook .mat-icon {\n background-color: #fff; }\n .social-icons .social-icon.twitter {\n background-color: #1da1f2;\n color: #fff; }\n .social-icons .social-icon.google {\n background-color: #d34836;\n color: #fff; }\n .social-icons .social-icon .mat-icon {\n width: 18px;\n height: 18px;\n margin: 0 auto; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.auth-page {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: #fafafa;\n color: inherit; }\n .auth-page > .auth-panel {\n position: relative;\n max-width: 90%;\n width: 400px;\n padding: 30px 35px;\n background-color: white;\n border: 1px solid #ededed; }\n .auth-page > .auth-panel .general-error {\n padding: 8px 0;\n color: #F44336;\n text-align: center; }\n .auth-page > .auth-panel .color-secondary {\n color: #797979; }\n .auth-page > .auth-panel .social-icons {\n flex: 0 0 50%;\n height: 36px;\n padding: 3px 0 0; }\n .auth-page > .auth-panel .logo {\n display: block;\n width: 100%;\n margin: 0 auto 30px; }\n .auth-page > .auth-panel .logo > img {\n display: block;\n margin: auto;\n width: 200px; }\n .auth-page > .auth-panel .big-social-auth-button {\n width: 100%;\n text-align: center; }\n .auth-page > .auth-panel .big-social-auth-button button {\n line-height: 48px;\n width: 100%; }\n .auth-page > .auth-panel .big-social-auth-button svg {\n display: block; }\n .auth-page > .auth-panel .input-container {\n position: relative; }\n .auth-page > .auth-panel .input-container > input {\n font-size: 1.5rem;\n font-weight: 500;\n letter-spacing: .5px;\n height: 47px;\n padding: 6px 12px;\n border: 1px solid #ededed;\n background-color: #fff;\n color: inherit; }\n .auth-page > .auth-panel .input-container > .error {\n position: absolute;\n top: 0;\n left: 100%;\n margin: 0;\n padding: 0 20px;\n white-space: nowrap;\n background-color: #F44336;\n color: #fff;\n line-height: 45px;\n max-width: 350px;\n overflow: hidden;\n text-overflow: ellipsis; }\n @media only screen and (max-width: 768px) {\n .auth-page > .auth-panel .input-container > .error {\n position: static;\n padding: 0;\n background-color: inherit;\n color: #F44336;\n line-height: initial;\n max-width: 100%;\n margin: 8px 0 0; } }\n .auth-page > .auth-panel .input-container > .forgot-password {\n cursor: pointer;\n position: absolute;\n right: 13px;\n top: 14px; }\n .auth-page > .auth-panel .input-container > .forgot-password:hover {\n color: #1565c0; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.ps {\n position: relative; }\n .ps > .ps__rail-x {\n opacity: 0.6; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.context-menu {\n width: 300px;\n background-color: #fff;\n box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n z-index: 10;\n padding: 8px 0;\n user-select: none; }\n .context-menu .context-menu-item {\n width: 100%;\n background-color: inherit;\n color: rgba(0, 0, 0, 0.87);\n border: none;\n font-size: 16px;\n height: 48px;\n padding: 0 16px;\n display: flex;\n align-items: center;\n cursor: pointer;\n outline: none; }\n .context-menu .context-menu-item:not(:disabled) .mat-icon {\n color: rgba(0, 0, 0, 0.54); }\n .context-menu .context-menu-item:not(:disabled):hover {\n background-color: rgba(0, 0, 0, 0.04); }\n .context-menu .context-menu-item:disabled {\n color: rgba(0, 0, 0, 0.38);\n cursor: default; }\n .context-menu .context-menu-item > .mat-icon {\n margin-right: 16px; }\n .context-menu .context-menu-item > .alt-text {\n margin-left: auto;\n color: rgba(0, 0, 0, 0.54);\n font-size: 14px; }\n .context-menu .context-menu-item > .indent {\n margin-left: 40px; }\n .context-menu .separator {\n background-color: rgba(0, 0, 0, 0.11);\n margin: 8px 0;\n height: 1px;\n max-height: 1px;\n min-height: 1px;\n width: 100%; }\n\n.selected-el-box {\n border: 2px dashed #E91E63;\n position: absolute;\n pointer-events: none;\n padding: 5px;\n top: -10px;\n right: -10px; }\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 * @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n * `white-on-black` or `black-on-white`.\n */\n/* Theme for the ripple elements.*/\n/* stylelint-disable material/no-prefixes */\n/* stylelint-enable */\n.files-select-box {\n position: absolute;\n z-index: 999;\n background-color: rgba(0, 0, 0, 0.05);\n border: 1px solid rgba(0, 0, 0, 0.1);\n width: 0;\n height: 0; }\n\n.image-file {\n color: #f44336; }\n\n.audio-file {\n color: #FF9800; }\n\n.video-file {\n color: #f44336; }\n\n.text-file {\n color: #2196F3; }\n\n.default-file {\n color: #757575; }\n\n.folder-file {\n color: #FBC02D; }\n\n.shared-folder-file {\n color: #FBC02D; }\n\n.archive-file {\n color: #FBC02D; }\n\n.pdf-file {\n color: #f44336; }\n\n.toggle-expansion-icon {\n cursor: default;\n transform: rotate(-90deg);\n transition: transform 100ms ease-out;\n flex: 0 0 24px; }\n .toggle-expansion-icon.expanded {\n transform: none; }\n","@import \"variables\";\r\n\r\nbody, html {\r\n -webkit-font-smoothing: antialiased;\r\n -webkit-tap-highlight-color: transparent;\r\n -webkit-touch-callout: none;\r\n -webkit-text-size-adjust: 100%;\r\n -ms-text-size-adjust: 100%;\r\n -moz-osx-font-smoothing: grayscale;\r\n width: 100%;\r\n height: 100%;\r\n position: relative;\r\n box-sizing: border-box;\r\n}\r\n\r\nhtml {\r\n font-size: 62.5%;\r\n touch-action: manipulation;\r\n}\r\n\r\nbody {\r\n font-family: $font-family;\r\n color: $site-text-color-400;\r\n line-height: 1.42857143;\r\n font-size: 1.4rem;\r\n margin: 0;\r\n overflow: hidden;\r\n}\r\n\r\n//box-sizing\r\nbody {\r\n box-sizing: inherit;\r\n\r\n *, *:before, *:after {\r\n box-sizing: inherit;\r\n }\r\n}","@import \"../../scss/variables\";\r\n\r\n.scroll-container, .scroll-container-x {\r\n width: 100%;\r\n height: 100%;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n\r\n &.ps {\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n}\r\n\r\n.scroll-container-x {\r\n overflow-y: hidden;\r\n overflow-x: auto;\r\n}\r\n\r\nimg {\r\n display: block;\r\n}\r\n\r\n.block {\r\n display: block;\r\n}\r\n\r\na {\r\n text-decoration: none;\r\n color: $link-color;\r\n\r\n &.hover-underline {\r\n color: inherit;\r\n\r\n &:hover {\r\n text-decoration: underline;\r\n }\r\n }\r\n}\r\n\r\n.hidden {\r\n display: none !important;\r\n visibility: hidden;\r\n}\r\n\r\n.visually-hidden {\r\n visibility: hidden;\r\n pointer-events: none;\r\n}\r\n\r\n.error {\r\n color: $danger-bg-color;\r\n\r\n &.margin-bottom {\r\n margin-bottom: 20px;\r\n }\r\n\r\n &.margin-top {\r\n margin-top: 20px;\r\n }\r\n}\r\n\r\n//fix file dropzone firing \"dragleave\" event when hovering its child\r\n.file-over-dropzone * {\r\n pointer-events: none !important;\r\n}","@import \"../../scss/variables\";\r\n\r\n.no-results-message {\r\n width: 100%;\r\n max-height: 100%;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n flex-flow: column wrap;\r\n font-weight: 300;\r\n color: #43484d;\r\n\r\n .icon {\r\n width: 150px;\r\n height: 150px;\r\n fill: currentColor;\r\n margin-top: 25px;\r\n }\r\n\r\n .main {\r\n font-size: 2.6rem;\r\n font-weight: 500;\r\n text-align: center;\r\n }\r\n\r\n .secondary {\r\n font-size: 1.7rem;\r\n font-weight: 400;\r\n text-align: center;\r\n }\r\n}","@import \"variables\";\r\n\r\nbutton.no-style {\r\n background: none;\r\n border: 0;\r\n color: inherit;\r\n font: inherit;\r\n line-height: normal;\r\n overflow: visible;\r\n padding: 0;\r\n border-radius: 0;\r\n min-width: initial;\r\n -webkit-user-select: none; /* for button */\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n outline: none;\r\n cursor: pointer;\r\n}\r\n\r\n.mat-flat-button.mat-gray {\r\n background-color: $site-bg-color-300;\r\n color: $site-text-color-200;\r\n border: 1px solid $site-border-color-200;\r\n\r\n &:hover {\r\n background-color: lighten($site-bg-color-300, 2%);\r\n }\r\n}","@import \"variables\";\r\n\r\n.input-container {\r\n display: block;\r\n width: 100%;\r\n\r\n .error {\r\n margin-top: 6px;\r\n color: $danger-bg-color;\r\n }\r\n\r\n p {\r\n color: $site-text-color-300;\r\n font-size: 1.3rem;\r\n }\r\n\r\n label {\r\n color: inherit;\r\n display: block;\r\n padding-bottom: 5px;\r\n }\r\n\r\n input, select, textarea, .fake-input {\r\n width: 100%;\r\n height: $input-height;\r\n color: inherit;\r\n border: 1px solid $site-border-color-200;\r\n padding: 12px;\r\n line-height: normal;\r\n font-size: 1.4rem;\r\n font-family: inherit;\r\n background-color: inherit;\r\n box-sizing: border-box;\r\n border-radius: 4px;\r\n\r\n &:invalid {\r\n box-shadow: none;\r\n }\r\n\r\n &:disabled {\r\n background-color: #f8f8f8;\r\n color: $site-text-color-200;\r\n }\r\n }\r\n\r\n textarea {\r\n height: auto;\r\n padding: 10px;\r\n }\r\n}\r\n\r\n.many-inputs {\r\n > .input-container {\r\n margin-bottom: 20px;\r\n }\r\n}","@import \"_variables\";\r\n\r\n.be-modal {\r\n width: $modal-content-width;\r\n \r\n .dialog-loading-bar {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n }\r\n\r\n .mat-dialog-container {\r\n position: relative;\r\n }\r\n\r\n .modal-header {\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n color: $modal-header-text-color;\r\n margin: $modal-header-margin;\r\n\r\n > h2 {\r\n font-size: $modal-header-font-size;\r\n font-weight: $modal-header-font-weight;\r\n flex: 1 1 auto;\r\n margin: 0;\r\n line-height: 30px;\r\n }\r\n }\r\n\r\n .mat-dialog-content {\r\n position: relative;\r\n padding-top: 1px;\r\n padding-bottom: 1px;\r\n }\r\n\r\n .mat-dialog-actions {\r\n justify-content: flex-end;\r\n padding-bottom: 16px;\r\n }\r\n\r\n .close-button {\r\n flex: 0 0 $modal-close-button-size;\r\n width: $modal-close-button-size;\r\n height: $modal-close-button-size;\r\n line-height: $modal-close-button-size;\r\n color: $modal-close-button-color;\r\n transition: transform ease 0.2s;\r\n z-index: 999;\r\n\r\n &:hover {\r\n transform: rotate(90deg);\r\n }\r\n\r\n .mat-icon {\r\n width: $modal-close-button-size;\r\n height: $modal-close-button-size;\r\n }\r\n }\r\n\r\n .errors {\r\n color: $modal-error-text-color;\r\n\r\n > .error {\r\n padding: 10px 0;\r\n\r\n &:last-of-type {\r\n margin-bottom: 20px;\r\n }\r\n }\r\n }\r\n\r\n .input-container {\r\n > input, > textarea, select {\r\n background-color: $modal-input-bg-color;\r\n }\r\n\r\n > .error {\r\n color: $modal-error-text-color;\r\n }\r\n\r\n > p {\r\n margin-top: 8px;\r\n line-height: 1.5;\r\n font-size: 1.4rem;\r\n color: $modal-input-hint-text-color;\r\n }\r\n }\r\n\r\n .no-input-error {\r\n padding: 10px 0;\r\n color: $danger-bg-color;\r\n }\r\n}","@import \"../scss/variables\";\r\n\r\n.social-icons {\r\n &:empty {\r\n display: none;\r\n }\r\n\r\n .social-icon {\r\n width: 31px;\r\n height: 31px;\r\n margin-right: 8px;\r\n border-radius: 3px;\r\n\r\n &.facebook {\r\n color: $facebook-color;\r\n background-color: $facebook-color;\r\n\r\n .mat-icon {\r\n background-color: #fff;\r\n }\r\n }\r\n\r\n &.twitter {\r\n background-color: $twitter-color;\r\n color: #fff;\r\n }\r\n\r\n &.google {\r\n background-color: $google-color;\r\n color: #fff;\r\n }\r\n\r\n .mat-icon {\r\n width: 18px;\r\n height: 18px;\r\n margin: 0 auto;\r\n }\r\n }\r\n}","@import \"../scss/variables\";\r\n\r\n.auth-page {\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n background-color: $login-page-bg-color;\r\n color: $login-page-text-color;\r\n\r\n > .auth-panel {\r\n position: relative;\r\n max-width: 90%;\r\n width: 400px;\r\n padding: 30px 35px;\r\n background-color: $login-page-panel-bg-color;\r\n border: 1px solid $login-page-border-color;\r\n\r\n .general-error {\r\n padding: 8px 0;\r\n color: $danger-bg-color;\r\n text-align: center;\r\n }\r\n\r\n .color-secondary {\r\n color: $login-page-secondary-text-color;\r\n }\r\n\r\n .social-icons {\r\n flex: 0 0 50%;\r\n height: 36px;\r\n padding: 3px 0 0;\r\n }\r\n\r\n .logo {\r\n display: block;\r\n width: 100%;\r\n margin: 0 auto 30px;\r\n\r\n > img {\r\n display: block;\r\n margin: auto;\r\n width: 200px;\r\n }\r\n }\r\n\r\n .big-social-auth-button {\r\n width: 100%;\r\n text-align: center;\r\n\r\n button {\r\n line-height: 48px;\r\n width: 100%;\r\n }\r\n\r\n svg {\r\n display: block;\r\n }\r\n }\r\n\r\n .input-container {\r\n position: relative;\r\n\r\n > input {\r\n font-size: 1.5rem;\r\n font-weight: 500;\r\n letter-spacing: .5px;\r\n height: 47px;\r\n padding: 6px 12px;\r\n border: 1px solid $login-page-border-color;\r\n background-color: $login-page-input-bg-color;\r\n color: inherit;\r\n }\r\n\r\n > .error {\r\n position: absolute;\r\n top: 0;\r\n left: 100%;\r\n margin: 0;\r\n padding: 0 20px;\r\n white-space: nowrap;\r\n background-color: $danger-bg-color;\r\n color: $danger-text-color;\r\n line-height: 45px;\r\n max-width: 350px;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n\r\n @media only screen and (max-width: $tablet) {\r\n position: static;\r\n padding: 0;\r\n background-color: inherit;\r\n color: $danger-bg-color;\r\n line-height: initial;\r\n max-width: 100%;\r\n margin: 8px 0 0;\r\n }\r\n }\r\n\r\n > .forgot-password {\r\n cursor: pointer;\r\n position: absolute;\r\n right: 13px;\r\n top: 14px;\r\n\r\n &:hover {\r\n color: $link-color;\r\n }\r\n }\r\n }\r\n }\r\n}","@import \"_variables\";\r\n\r\n//always should horizontal scrollbar\r\n.ps {\r\n position: relative;\r\n\r\n > .ps__rail-x {\r\n opacity: 0.6;\r\n }\r\n}","@import \"../scss/variables\";\r\n\r\n.context-menu {\r\n width: 300px;\r\n background-color: $site-bg-color-100;\r\n @include mat-elevation(4);\r\n z-index: 10;\r\n padding: 8px 0;\r\n user-select: none;\r\n\r\n .context-menu-item {\r\n width: 100%;\r\n background-color: inherit;\r\n color: $site-text-color-400;\r\n border: none;\r\n font-size: 16px;\r\n height: 48px;\r\n padding: 0 16px;\r\n display: flex;\r\n align-items: center;\r\n cursor: pointer;\r\n outline: none;\r\n\r\n &:not(:disabled) {\r\n .mat-icon {\r\n color: $site-text-color-300;\r\n }\r\n\r\n &:hover {\r\n background-color: rgba(0,0,0,.04);\r\n }\r\n }\r\n\r\n &:disabled {\r\n color: $site-text-color-200;\r\n cursor: default;\r\n }\r\n\r\n > .mat-icon {\r\n margin-right: 16px;\r\n }\r\n\r\n > .alt-text {\r\n margin-left: auto;\r\n color: $site-text-color-300;\r\n font-size: 14px;\r\n }\r\n\r\n > .indent {\r\n margin-left: 40px;\r\n }\r\n }\r\n\r\n .separator {\r\n background-color: rgba(0,0,0,0.11);\r\n margin: 8px 0;\r\n height: 1px;\r\n max-height: 1px;\r\n min-height: 1px;\r\n width: 100%;\r\n }\r\n}",".selected-el-box {\r\n border: 2px dashed #E91E63;\r\n position: absolute;\r\n pointer-events: none;\r\n padding: 5px;\r\n top: -10px;\r\n right: -10px;\r\n}","@import \"variables\";\r\n\r\n.files-select-box {\r\n position: absolute;\r\n z-index: 999;\r\n background-color: rgba(0,0,0,0.05);\r\n border: 1px solid rgba(0,0,0,0.1);\r\n width: 0;\r\n height: 0;\r\n}","$fileColors: (\r\n image: #f44336,\r\n audio: #FF9800,\r\n video: #f44336,\r\n text: #2196F3,\r\n default: #757575,\r\n folder: #FBC02D,\r\n shared-folder: #FBC02D,\r\n archive: #FBC02D,\r\n pdf: #f44336\r\n);\r\n\r\n.file-color {\r\n color: map_get($fileColors, generic);\r\n}\r\n\r\n@each $type, $color in $fileColors {\r\n .#{$type}-file {\r\n color: $color;\r\n }\r\n}",".toggle-expansion-icon {\r\n cursor: default;\r\n transform: rotate(-90deg);\r\n transition: transform 100ms ease-out;\r\n flex: 0 0 24px;\r\n\r\n &.expanded {\r\n transform: none;\r\n }\r\n}"],"sourceRoot":""}
Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists