{"version":3,"sources":["../../node_modules/@angular/material/_theming.scss","common/styles/_elevation.scss","theming/prebuilt/teal-orange.css","common/styles/_palette.scss","common/_common-theme.scss","layout/_layout-theme.scss","steps/_steps-theme.scss","common/styles/_variables.scss","expansion-panel/_expansion-panel-theme.scss","chips/_chips-theme.scss","file/_file-theme.scss","json-formatter/_json-formatter-theme.scss","paging/_paging-bar-theme.scss","loading/_loading-theme.scss","data-table/_data-table-theme.scss","notifications/_notification-count-theme.scss","message/_message-theme.scss"],"names":[],"mappings":"AAs/CI,kBCt2CF,WAA4B,EAAA,EAAA,EAAA,EAAA,cAA0C,CAC3C,EAAA,EAAA,EAAA,EAAA,eAA6C,CAC7C,EAAA,EAAA,EAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,IAAA,EAAA,eAA6C,CAC7C,EAAA,IAAA,IAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,IAAA,EAAA,eAA6C,CAC7C,EAAA,IAAA,IAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,IAAA,EAAA,eAA6C,CAC7C,EAAA,IAAA,IAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,IAAA,EAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,IAAA,EAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,KAAA,EAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,EAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,kBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,IAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,IAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,KAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,KAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,KAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,IAAA,KAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,KAAA,KAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,KAAA,KAAA,KAAA,cAA0C,CAC3C,EAAA,KAAA,KAAA,IAAA,eAA6C,CAC7C,EAAA,IAAA,KAAA,IAAA,gBDo2CzB,mBCt2CF,WAA4B,EAAA,KAAA,KAAA,KAAA,cAA0C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QHs0CL,oBAAA,yBAAA,8BACE,iBGhoCG,QHkoCL,kBAAA,uBAAA,4BACE,iBGnlDG,QHulDH,8BAAA,+BAAA,4BAAA,6BAAA,mCAAA,oCAAA,iCAAA,kCAAA,wCAAA,yCAAA,sCAAA,uCAEE,iBGrmDkB,gBHmkDR,yCAAA,8CAAA,mDACZ,iBGhyCK,qBHmyCM,wCAAA,6CAAA,kDACX,iBG7lCK,qBHgmCI,sCAAA,2CAAA,gDACT,iBGjjDK,qBHwiDO,4CACZ,iBG/yCG,mBHkzCQ,2CACX,iBG5mCG,mBH+mCM,yCACT,iBGhkDG,mBHujDS,iDACZ,iBG/yCG,mBHkzCQ,gDACX,iBG5mCG,mBH+mCM,8CACT,iBGhkDG,mBHooDL,SAAU,cACR,iBGrrCG,QHsrCH,MGvqCK,KHqqCP,6BAAU,kCAON,iBG5qCG,qBHmsCP,mBACE,MG1gCoB,gBHggCtB,gEACE,iBGpqDmB,gBHorDrB,2BACE,iBG5nCG,QH6nCH,MGzhCe,KH4hCjB,4BACE,iBGloCG,KHmoCH,MG1hCoB,gBHwhCtB,sDAKI,iBGpoCC,QHipCL,UACE,WG3kCU,KH4kCV,MGtiCoB,gBHyiCtB,mBACE,MG7iCoB,gBHskCtB,oBACE,aGvkCoB,gBH0kCtB,wBACE,KGzrCE,QH4rCJ,6BAGE,OG/rCE,kBHksCJ,wBACE,iBGnsCE,QHssCyB,2DAA7B,iEAEI,iBG3+CC,QHy+CwB,0DAA7B,gEAMI,iBGxyCC,QHkyCwB,wDAA7B,8DAUI,iBG5vDC,QHgwDL,qEAAA,2EAGM,iBAtCyB,QAmC/B,sEASM,aA5CyB,QAiD/B,+FAEI,iBGvgDC,oBHqgDL,8FAMI,iBGp0CC,oBH8zCL,4FAUI,iBGxxDC,oBHqzDL,+BACE,iBAPuE,QAQvE,MAbiB,gBAgBnB,iDACE,iBATwE,KAUxE,MGz0DoB,sBHu0DtB,6DAKI,iBGtjDC,QHujDD,MGxiDG,KHkiDP,4DAUI,iBGp3CC,QHq3CD,MGt2CG,KH21CP,0DAeI,iBGz0DC,QH00DD,MG3zDG,KH60DP,cACE,iBGtuCU,KHyuCZ,oBACE,iBGtsCoB,gBHysCtB,0BACA,8BACE,MG3sCoB,gBH8sCtB,2BACE,MGjtCoB,gBHotCtB,0CACE,WG13DoB,gBH63DtB,yBACE,MGxtCoB,gBH2tCtB,gCACE,MGztCoB,gBH0tCpB,aAAc,YAEd,6FACE,MGluCkB,gBHuuCtB,iHADA,yGAGI,iBG3wCa,gBH+wCjB,4BACE,iBG7nDG,QH8nDH,MG/mDK,KHknDP,wDACE,iBAAkB,mBAGpB,0DAII,aGzvCkB,gBHqvCtB,oDAQI,WAAY,MAAM,EAAE,EAAE,EA9DuB,IGhkD1C,KHmoDP,sFACE,aAAc,gBAWhB,sBACE,WGhzCU,KHs0CZ,sBAEI,MGvrDC,QHqrDL,qBAMI,MGp/CC,QH8+CL,mBAUI,MGx8DC,QHm+DL,uBACE,MG30CoB,gBHg1CtB,oCACE,MGjuDG,QHguDL,+CAII,MG7hDC,QHyhDL,6CAQI,MGj/DC,QHq/DL,4BACE,MG91CoB,gBHm2CtB,wEADA,0FAGI,MG7iDC,QHijDL,qBACE,aG9gEoB,gBH6gEtB,uCAII,iBG5vDC,QHwvDL,kDAOM,iBGxjDD,QHijDL,gDAUM,iBG3gED,QHmhEL,0CAAA,6CAGI,MGthEC,QHmhEL,wCAOI,aG1hEC,QHmhEL,qCAWI,iBG9hEC,QHkiEL,iBACE,MGniEG,QH+iEL,yBAAW,6BAEP,MGp5CkB,gBHk5CtB,yBAAW,6BAMP,MG35CkB,gBH+5CtB,aACE,iBGtkEoB,gBHykEtB,yDAAA,2CAEI,WGz8Ca,gBHs9CjB,kBACE,WGt9CU,KHy9CZ,eACE,WAAY,IACZ,MGr7CoB,gBHm7CtB,yBAKI,MG/7CkB,gBH07CtB,yBASI,MG97CkB,gBH+7ClB,eAAgB,OAVpB,qCAAA,qCAcI,WGx+Ca,gBHs/CjB,6BACE,WAAW,sdAGb,yBACE,iBG92DG,QHi3DL,8BACE,iBG52DG,QH+2DL,0DAEI,WAAW,sdAFf,sDAMI,iBG5qDE,QHsqDN,2DASI,iBGjrDC,QHqrDL,wDAEI,WAAW,sdAFf,oDAMI,iBGhpEC,QH0oEL,yDASI,iBG9oEC,QH2rEL,2BAAuB,kBAEnB,OGp7DC,QHk7DL,sCAAuB,6BAMnB,OGjvDC,QH2uDL,oCAAuB,2BAUnB,OGrsEC,QHqtEL,wBACE,aG5jDoB,gBH+jDtB,2CACE,aG1wDG,QH6wDL,4CACE,aGxkDoB,gBH2kDtB,wBACE,iBGlxDG,QHqxDL,sCACE,iBGtxDG,oBHyxDL,4CAAA,0DAEI,iBGrlDkB,gBHinDtB,kBADA,oBAEE,MG/mDoB,gBHknDtB,sBACE,iBGxxEoB,gBH4xEtB,kBADA,uCAEA,oBACE,MGznDoB,gBH4nDtB,oBAAqB,iCACnB,WG/pDU,KHkqDZ,kBACE,MG7nDoB,gBHylDD,0EAArB,4EACE,MG9+DG,QHi/DL,8EACE,iBGl/DG,QH6+DgB,yEAArB,2EACE,MGvyDG,QH0yDL,6EACE,iBG3yDG,QHsyDgB,uEAArB,yEAAqB,0FAArB,4FACE,MGvvEG,QH0vEL,2EAAA,8FACE,iBG3vEG,QHg0EL,uBACE,iBGrxDE,QHsxDF,MGrqDoB,gBHwqDtB,aACE,iBG9sDU,KH+sDV,MG1qDoB,gBHwqDtB,8BAKI,iBGltDQ,KHstDZ,wCACE,iBApBuB,eA+BvB,yEACE,iBG94DC,QHi5DH,uEACE,iBGl5DC,mBHy5De,wDAClB,iBGptDe,gBHstDjB,sCACE,iBG75DG,oBH64DH,qFACE,iBGplEC,QHulEH,mFACE,iBGxlEC,mBH+lEe,oEAClB,iBGptDe,gBHstDjB,kDACE,iBGnmEG,oBHmlEH,kFACE,iBG51EC,QH+1EH,gFACE,iBGh2EC,mBHu2Ee,iEAClB,iBGptDe,gBHstDjB,+CACE,iBG32EG,oBHw5EL,sCAKI,iBG52DC,QHu2DL,oCAQI,iBAlCsD,eAsC1D,wBACE,iBGx3DE,QH23DJ,sBACE,iBGlxDoB,gBHkzDtB,6BACE,iBAT0B,gBAf5B,+BACA,qCAFA,oCAGE,iBG1qEG,QH6qEL,0CACE,MG/pEK,KHypEP,8BACA,oCAFA,mCAGE,iBGn+DG,QHs+DL,yCACE,MGx9DK,KHk9DP,4BACA,kCAFA,iCAGE,iBGn7EG,QHs7EL,uCACE,MGx6EK,KHy8EP,uBACE,iBGzgEG,mBH6gEL,0CADA,+CAGI,iBA9BgC,gBAkCpC,uCAAA,kDAAA,4CAII,iBArC6B,gBAiCjC,wDASM,iBA1C2B,gBA+CjC,6CAEI,iBA7CyC,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","file":"teal-orange.css","sourcesContent":["// Import all the theming functionality.\n// Core styles that can be used to apply material design treatments to any element.\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    text-transform: none;\n    width: 1px;\n  }\n}\n\n/**\n * Applies styles for users in high contrast mode. Note that this only applies\n * to Microsoft browsers. Chrome can be included by checking for the `html[hc]`\n * attribute, however Chrome handles high contrast differently.\n */\n@mixin cdk-high-contrast {\n  @media screen and (-ms-high-contrast: active) {\n    @content;\n  }\n}\n\n// Typography\n$mat-body-font-size-base: 14px !default;\n$mat-font-family: Roboto, 'Helvetica Neue', sans-serif !default;\n\n// Media queries\n// TODO: Find a way to respect media query ranges.\n// TODO: For example the xs-breakpoint should not interfere with the sm-breakpoint.\n$mat-xsmall: 'max-width: 600px';\n$mat-small: 'max-width: 960px';\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// Overlay z indices.\n\n// We want overlays to always appear over user content, so set a baseline\n// very high z-index for the overlay container, which is where we create the new\n// stacking context for all overlays.\n$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.6);\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://www.google.com/design/spec/what-is-material/elevation-shadows.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$_umbra-color: rgba(black, 0.2);\n$_penumbra-color: rgba(black, 0.14);\n$_ambient-color: rgba(black, 0.12);\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$_umbra-elevation-map: (\n  0: '0px 0px 0px 0px #{$_umbra-color}',\n  1: '0px 2px 1px -1px #{$_umbra-color}',\n  2: '0px 3px 1px -2px #{$_umbra-color}',\n  3: '0px 3px 3px -2px #{$_umbra-color}',\n  4: '0px 2px 4px -1px #{$_umbra-color}',\n  5: '0px 3px 5px -1px #{$_umbra-color}',\n  6: '0px 3px 5px -1px #{$_umbra-color}',\n  7: '0px 4px 5px -2px #{$_umbra-color}',\n  8: '0px 5px 5px -3px #{$_umbra-color}',\n  9: '0px 5px 6px -3px #{$_umbra-color}',\n  10: '0px 6px 6px -3px #{$_umbra-color}',\n  11: '0px 6px 7px -4px #{$_umbra-color}',\n  12: '0px 7px 8px -4px #{$_umbra-color}',\n  13: '0px 7px 8px -4px #{$_umbra-color}',\n  14: '0px 7px 9px -4px #{$_umbra-color}',\n  15: '0px 8px 9px -5px #{$_umbra-color}',\n  16: '0px 8px 10px -5px #{$_umbra-color}',\n  17: '0px 8px 11px -5px #{$_umbra-color}',\n  18: '0px 9px 11px -5px #{$_umbra-color}',\n  19: '0px 9px 12px -6px #{$_umbra-color}',\n  20: '0px 10px 13px -6px #{$_umbra-color}',\n  21: '0px 10px 13px -6px #{$_umbra-color}',\n  22: '0px 10px 14px -6px #{$_umbra-color}',\n  23: '0px 11px 14px -7px #{$_umbra-color}',\n  24: '0px 11px 15px -7px #{$_umbra-color}'\n);\n\n$_penumbra-elevation-map: (\n  0: '0px 0px 0px 0px #{$_penumbra-color}',\n  1: '0px 1px 1px 0px #{$_penumbra-color}',\n  2: '0px 2px 2px 0px #{$_penumbra-color}',\n  3: '0px 3px 4px 0px #{$_penumbra-color}',\n  4: '0px 4px 5px 0px #{$_penumbra-color}',\n  5: '0px 5px 8px 0px #{$_penumbra-color}',\n  6: '0px 6px 10px 0px #{$_penumbra-color}',\n  7: '0px 7px 10px 1px #{$_penumbra-color}',\n  8: '0px 8px 10px 1px #{$_penumbra-color}',\n  9: '0px 9px 12px 1px #{$_penumbra-color}',\n  10: '0px 10px 14px 1px #{$_penumbra-color}',\n  11: '0px 11px 15px 1px #{$_penumbra-color}',\n  12: '0px 12px 17px 2px #{$_penumbra-color}',\n  13: '0px 13px 19px 2px #{$_penumbra-color}',\n  14: '0px 14px 21px 2px #{$_penumbra-color}',\n  15: '0px 15px 22px 2px #{$_penumbra-color}',\n  16: '0px 16px 24px 2px #{$_penumbra-color}',\n  17: '0px 17px 26px 2px #{$_penumbra-color}',\n  18: '0px 18px 28px 2px #{$_penumbra-color}',\n  19: '0px 19px 29px 2px #{$_penumbra-color}',\n  20: '0px 20px 31px 3px #{$_penumbra-color}',\n  21: '0px 21px 33px 3px #{$_penumbra-color}',\n  22: '0px 22px 35px 3px #{$_penumbra-color}',\n  23: '0px 23px 36px 3px #{$_penumbra-color}',\n  24: '0px 24px 38px 3px #{$_penumbra-color}'\n);\n\n$_ambient-elevation-map: (\n  0: '0px 0px 0px 0px #{$_ambient-color}',\n  1: '0px 1px 3px 0px #{$_ambient-color}',\n  2: '0px 1px 5px 0px #{$_ambient-color}',\n  3: '0px 1px 8px 0px #{$_ambient-color}',\n  4: '0px 1px 10px 0px #{$_ambient-color}',\n  5: '0px 1px 14px 0px #{$_ambient-color}',\n  6: '0px 1px 18px 0px #{$_ambient-color}',\n  7: '0px 2px 16px 1px #{$_ambient-color}',\n  8: '0px 3px 14px 2px #{$_ambient-color}',\n  9: '0px 3px 16px 2px #{$_ambient-color}',\n  10: '0px 4px 18px 3px #{$_ambient-color}',\n  11: '0px 4px 20px 3px #{$_ambient-color}',\n  12: '0px 5px 22px 4px #{$_ambient-color}',\n  13: '0px 5px 24px 4px #{$_ambient-color}',\n  14: '0px 5px 26px 4px #{$_ambient-color}',\n  15: '0px 6px 28px 5px #{$_ambient-color}',\n  16: '0px 6px 30px 5px #{$_ambient-color}',\n  17: '0px 6px 32px 5px #{$_ambient-color}',\n  18: '0px 7px 34px 6px #{$_ambient-color}',\n  19: '0px 7px 36px 6px #{$_ambient-color}',\n  20: '0px 8px 38px 7px #{$_ambient-color}',\n  21: '0px 8px 40px 7px #{$_ambient-color}',\n  22: '0px 8px 42px 7px #{$_ambient-color}',\n  23: '0px 9px 44px 8px #{$_ambient-color}',\n  24: '0px 9px 46px 8px #{$_ambient-color}'\n);\n\n\n// The css property used for elevation. In most cases this should not be changed. It is exposed\n// as a variable for abstraction / easy use when needing to reference the property directly, for\n// example in a will-change rule.\n$mat-elevation-property: box-shadow !default;\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// 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) {\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  #{$mat-elevation-property}: #{map-get($_umbra-elevation-map, $zValue)},\n                             #{map-get($_penumbra-elevation-map, $zValue)},\n                             #{map-get($_ambient-elevation-map, $zValue)};\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//   will-change: $mat-elevation-property, opacity;\n// }\n@function mat-elevation-transition-property-value(\n    $duration: $mat-elevation-transition-duration,\n    $easing: $mat-elevation-transition-timing-function) {\n  @return #{$mat-elevation-property} #{$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  will-change: $mat-elevation-property;\n}\n\n\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\n    // Note: we prefer viewport units, because they aren't being offset by the global scrollbar.\n    height: 100vh;\n    width: 100vw;\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\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    position: absolute;\n    pointer-events: auto;\n    box-sizing: border-box;\n    z-index: $cdk-z-index-overlay;\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\n    // TODO(jelbourn): figure out if there are actually spec'ed colors for both light and dark\n    // themes here. Currently using the values from AngularJS Material.\n    transition: opacity $swift-ease-out-duration $swift-ease-out-timing-function;\n    opacity: 0;\n\n    &.cdk-overlay-backdrop-showing {\n      opacity: 0.48;\n    }\n  }\n\n  .cdk-overlay-dark-backdrop {\n    background: $cdk-overlay-dark-backdrop-background;\n  }\n\n  .cdk-overlay-transparent-backdrop {\n    background: none;\n  }\n}\n\n// Color palettes from the Material Design spec.\n// See https://www.google.com/design/spec/style/color.html\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$black-87-opacity: rgba(black, 0.87);\n$white-87-opacity: rgba(white, 0.87);\n$black-12-opacity: rgba(black, 0.12);\n$white-12-opacity: rgba(white, 0.12);\n$black-6-opacity: rgba(black, 0.06);\n$white-6-opacity: rgba(white, 0.06);\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: $white-87-opacity,\n    A700: $white-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: $white-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: $black-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: $black-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: $white-87-opacity,\n  )\n);\n\n$mat-grey: (\n  0: #ffffff,\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  1000: #000000,\n  A100: #ffffff,\n  A200: #eeeeee,\n  A400: #bdbdbd,\n  A700: #616161,\n  contrast: (\n    0: $black-87-opacity,\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    1000: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $white-87-opacity,\n  )\n);\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: white,\n    500: white,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: $white-87-opacity,\n  )\n);\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: $black-12-opacity,\n  raised-button: white,\n  focused-button: $black-6-opacity,\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);\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: $white-12-opacity,\n  raised-button: map-get($mat-grey, 800),\n  focused-button: $white-6-opacity,\n  selected-button: map_get($mat-grey, 900),\n  selected-disabled-button: map_get($mat-grey, 800),\n  disabled-button-toggle: map_get($mat-grey, 1000),\n);\n\n// Foreground palette for light themes.\n$mat-light-theme-foreground: (\n  base:            black,\n  divider:         $black-12-opacity,\n  dividers:        $black-12-opacity,\n  disabled:        rgba(black, 0.38),\n  disabled-button: rgba(black, 0.38),\n  disabled-text:   rgba(black, 0.38),\n  hint-text:       rgba(black, 0.38),\n  secondary-text:  rgba(black, 0.54),\n  icon:            rgba(black, 0.54),\n  icons:           rgba(black, 0.54),\n  text:            rgba(black, 0.87)\n);\n\n// Foreground palette for dark themes.\n$mat-dark-theme-foreground: (\n  base:            white,\n  divider:         $white-12-opacity,\n  dividers:        $white-12-opacity,\n  disabled:        rgba(white, 0.3),\n  disabled-button: rgba(white, 0.3),\n  disabled-text:   rgba(white, 0.3),\n  hint-text:       rgba(white, 0.3),\n  secondary-text:  rgba(white, 0.7),\n  icon:            white,\n  icons:           white,\n  text:            white\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$mat-ripple-color-opacity: 0.1;\n\n@mixin mat-ripple() {\n  // The host element of an md-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}\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// A mixin, which generates temporary ink ripple on a given component.\n// To be removed once the real ripple is applied to all elements.\n// When $bindToParent is set to true, it will check for the focused class on the same selector as you included\n// that mixin.\n// It is also possible to specify the color palette of the temporary ripple. By default it uses the\n// accent palette for its background.\n@mixin mat-temporary-ink-ripple($component, $bindToParent: false) {\n  // TODO(mtlin): Replace when ink ripple component is implemented.\n  // A placeholder ink ripple, shown when keyboard focused.\n  .mat-ink-ripple {\n    border-radius: 50%;\n    opacity: 0;\n    height: 48px;\n    left: 50%;\n    overflow: hidden;\n    pointer-events: none;\n    position: absolute;\n    top: 50%;\n    transform: translate(-50%, -50%);\n    transition: opacity ease 280ms, background-color ease 280ms;\n    width: 48px;\n  }\n\n  // Fade in when radio focused.\n  #{if($bindToParent, '&', '')}.mat-#{$component}-focused .mat-ink-ripple {\n    opacity: 1;\n  }\n\n  // TODO(mtlin): This corresponds to disabled focus state, but it's unclear how to enter into\n  // this state.\n  #{if($bindToParent, '&', '')}.mat-#{$component}-disabled .mat-ink-ripple {\n    background-color: #000;\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/** The mixins below are shared between md-menu and md-select */\n\n// menu width must be a multiple of 56px\n$mat-menu-overlay-min-width: 112px !default;   // 56 * 2\n$mat-menu-overlay-max-width: 280px !default;   // 56 * 5\n\n$mat-menu-item-height: 48px !default;\n$mat-menu-font-size: 16px !default;\n$mat-menu-side-padding: 16px !default;\n$mat-menu-icon-margin: 16px !default;\n\n@mixin mat-menu-base() {\n  @include mat-elevation(8);\n  min-width: $mat-menu-overlay-min-width;\n  max-width: $mat-menu-overlay-max-width;\n\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;   // for momentum scroll on mobile\n}\n\n@mixin mat-menu-item-base() {\n  @include mat-truncate-line();\n\n  // Needs to be a block for the ellipsis to work.\n  display: block;\n  line-height: $mat-menu-item-height;\n  height: $mat-menu-item-height;\n  padding: 0 $mat-menu-side-padding;\n\n  font-size: $mat-menu-font-size;\n  font-family: $mat-font-family;\n  text-align: left;\n  text-decoration: none;   // necessary to reset anchor tags\n\n  &[disabled] {\n    cursor: default;\n  }\n\n  [dir='rtl'] & {\n    text-align: right;\n  }\n\n  .mat-icon {\n    margin-right: $mat-menu-icon-margin;\n\n    [dir='rtl'] & {\n      margin-left: $mat-menu-icon-margin;\n      margin-right: 0;\n    }\n  }\n}\n\n/**\n * This mixin adds the correct panel transform styles based\n * on the direction that the menu panel opens.\n */\n@mixin mat-menu-positions() {\n  &.mat-menu-after.mat-menu-below {\n    transform-origin: left top;\n  }\n\n  &.mat-menu-after.mat-menu-above {\n    transform-origin: left bottom;\n  }\n\n  &.mat-menu-before.mat-menu-below {\n    transform-origin: right top;\n  }\n\n  &.mat-menu-before.mat-menu-above {\n    transform-origin: right bottom;\n  }\n\n  [dir='rtl'] & {\n    &.mat-menu-after.mat-menu-below {\n      transform-origin: right top;\n    }\n\n    &.mat-menu-after.mat-menu-above {\n      transform-origin: right bottom;\n    }\n\n    &.mat-menu-before.mat-menu-below {\n      transform-origin: left top;\n    }\n\n    &.mat-menu-before.mat-menu-above {\n      transform-origin: left bottom;\n    }\n  }\n}\n\n/* stylelint-disable material/no-prefixes */\n@mixin user-select($value) {\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\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/* stylelint-enable */\n\n\n\n/**\n * This mixin contains shared option styles between the select and\n * autocomplete components.\n */\n@mixin mat-option() {\n  .mat-option {\n    @include mat-menu-item-base();\n    position: relative;\n    cursor: pointer;\n    outline: none;\n\n    &[aria-disabled='true'] {\n      @include user-select(none);\n      cursor: default;\n    }\n  }\n\n  .mat-option-ripple {\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    right: 0;\n\n    // Disable pointer events for the ripple container because the container will overlay the\n    // user content and we don't want to disable mouse events on the user content.\n    // Pointer events can be safely disabled because the ripple trigger element is the host element.\n    pointer-events: none;\n\n    // In high contrast mode this completely covers the text.\n    @include cdk-high-contrast {\n      opacity: 0.5;\n    }\n  }\n\n  .mat-option-pseudo-checkbox {\n    $margin: $mat-menu-side-padding / 2;\n    margin-right: $margin;\n\n    [dir='rtl'] & {\n      margin-left: $margin;\n      margin-right: 0;\n    }\n  }\n}\n\n\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    &:hover:not(.mat-option-disabled), &:focus:not(.mat-option-disabled) {\n      background: mat-color($background, hover);\n    }\n\n    &.mat-selected.mat-primary, .mat-primary &.mat-selected {\n      color: mat-color($primary);\n    }\n\n    &.mat-selected.mat-accent, .mat-accent &.mat-selected {\n      color: mat-color($accent);\n    }\n\n    &.mat-selected.mat-warn, .mat-warn &.mat-selected {\n      color: mat-color($warn);\n    }\n\n    // In multiple mode there is a checkbox to show that the option is selected.\n    &.mat-selected:not(.mat-option-multiple) {\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\n\n\n@mixin _mat-pseudo-checkbox-inner-content-theme($theme, $pallete-name) {\n  $pallete: map-get($theme, $pallete-name);\n  $color: mat-color($pallete);\n\n  .mat-pseudo-checkbox-checked.mat-#{$pallete-name},\n  .mat-pseudo-checkbox-indeterminate.mat-#{$pallete-name},\n  .mat-#{$pallete-name} .mat-pseudo-checkbox-checked,\n  .mat-#{$pallete-name} .mat-pseudo-checkbox-indeterminate {\n    background: $color;\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  @include _mat-pseudo-checkbox-inner-content-theme($theme, primary);\n  @include _mat-pseudo-checkbox-inner-content-theme($theme, accent);\n  @include _mat-pseudo-checkbox-inner-content-theme($theme, warn);\n\n  .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {\n    &.mat-pseudo-checkbox-disabled {\n      background: $disabled-color;\n    }\n  }\n}\n\n\n// Mixin that renders all of the core styles that are not theme-dependent.\n@mixin mat-core() {\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-z#{$zValue} {\n      @include mat-elevation($zValue);\n    }\n  }\n\n  @include mat-ripple();\n  @include mat-option();\n  @include cdk-a11y();\n  @include cdk-overlay();\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-pseudo-checkbox-theme($theme);\n\n  // Wrapper element that provides the theme background when the\n  // user's content isn't inside of a `md-sidenav-container`.\n  .mat-app-background {\n    $background: map-get($theme, background);\n    background-color: mat-color($background, background);\n  }\n\n  // Marker that is used to determine whether the user has added a theme to their page.\n  .mat-theme-loaded-marker {\n    display: none;\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    .mat-option {\n      &.mat-selected:not(.mat-active) {\n        background: mat-color($background, card);\n        color: mat-color($foreground, text);\n      }\n    }\n  }\n\n}\n\n\n// Applies a focus style to an md-button element for each of the supported palettes.\n@mixin _mat-button-focus-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.2) {\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 md-button element for each of the supported palettes.\n@mixin _mat-button-theme-color($theme, $property, $color: 'default') {\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, $color);\n  }\n  &.mat-accent {\n    #{$property}: mat-color($accent, $color);\n  }\n  &.mat-warn {\n    #{$property}: mat-color($warn, $color);\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 {\n    background: transparent;\n\n    @include _mat-button-focus-color($theme);\n    @include _mat-button-theme-color($theme, 'color');\n  }\n\n  .mat-raised-button, .mat-fab, .mat-mini-fab {\n    // Default properties when not using any [color] value.\n    color: mat-color($foreground, text);\n    background-color: mat-color($background, raised-button);\n\n    @include _mat-button-theme-color($theme, 'color', default-contrast);\n    @include _mat-button-theme-color($theme, 'background-color');\n\n    // Add ripple effect with contrast color to buttons that don't have a focus overlay.\n    @include _mat-button-ripple-color($theme, default-contrast);\n  }\n\n  // Add ripple effect with default color to flat buttons, which also have a focus overlay.\n  .mat-button {\n    @include _mat-button-ripple-color($theme, default, 0.1);\n  }\n\n  // Add ripple effect with default color to the icon button. Ripple color needs to be stronger\n  // since the icon button doesn't have a focus overlay.\n  .mat-icon-button {\n    @include _mat-button-ripple-color($theme, default);\n  }\n\n  // TODO(devversion): The color class accent should be just set from TS code. No need for this.\n  .mat-fab, .mat-mini-fab {\n    background-color: mat-color($accent);\n    color: mat-color($accent, default-contrast);\n\n    // Button fab elements are using the accent palette by default. The color classes won't\n    // be set on the element. To have a proper ripple color for those, we set the ripple color.\n    .mat-ripple-element {\n      background-color: mat-color($accent, default-contrast, 0.2);\n    }\n  }\n}\n\n\n\n\n\n\n// Applies a focus style to an md-button-toggle element for each of the supported palettes.\n@mixin _mat-button-toggle-focus-color($theme) {\n  $background: map-get($theme, background);\n\n  .mat-button-toggle-focus-overlay {\n    background-color: mat-color($background, focused-button);\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    &.cdk-focused {\n      @include _mat-button-toggle-focus-color($theme);\n    }\n  }\n\n  .mat-button-toggle-checked {\n    background-color: mat-color($background, selected-button);\n    color: mat-color($foreground, base);\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\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\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 attribute on the SVG in order\n    // for line animation to work properly.\n    stroke: $checkbox-mark-color !important;\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\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\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  // Use spec-recommended color for regular foreground, and utilise contrast color for a grey very\n  // close to the selected spec since no guidance is provided and to ensure palette consistency.\n  $light-foreground: rgba(0, 0, 0, 0.87);\n  $light-selected-foreground: mat-contrast($mat-grey, 600);\n\n  // The spec only provides guidance for light-themed chips. When inside of a dark theme, fall back\n  // to standard background and foreground colors.\n  $unselected-background: if($is-dark-theme, mat-color($background, card), #e0e0e0);\n  $unselected-foreground: if($is-dark-theme, mat-color($foreground, text), $light-foreground);\n\n  $selected-background: if($is-dark-theme, mat-color($background, app-bar), #808080);\n  $selected-foreground: if($is-dark-theme, mat-color($foreground, text), $light-selected-foreground);\n\n  .mat-chip:not(.mat-basic-chip) {\n    background-color: $unselected-background;\n    color: $unselected-foreground;\n  }\n\n  .mat-chip.mat-chip-selected:not(.mat-basic-chip) {\n    background-color: $selected-background;\n    color: $selected-foreground;\n\n    &.mat-primary {\n      background-color: mat-color($primary);\n      color: mat-color($primary, default-contrast);\n    }\n\n    &.mat-accent {\n      background-color: mat-color($accent);\n      color: mat-color($accent, default-contrast);\n    }\n\n    &.mat-warn {\n      background-color: mat-color($warn);\n      color: mat-color($warn, default-contrast);\n    }\n  }\n}\n\n\n\n\n\n@mixin mat-datepicker-theme($theme) {\n  $primary: map-get($theme, primary);\n  $foreground: map-get($theme, foreground);\n  $background: map-get($theme, background);\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\n  .mat-calendar {\n    background-color: mat-color($background, card);\n  }\n\n  .mat-calendar-arrow {\n    border-top-color: mat-color($foreground, icon);\n  }\n\n  .mat-calendar-next-button,\n  .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    .mat-calendar-body-disabled > &:not(.mat-calendar-body-selected) {\n      color: mat-color($foreground, disabled-text);\n    }\n  }\n\n  :not(.mat-calendar-body-disabled):hover,\n  .cdk-keyboard-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-selected {\n    background-color: mat-color($primary);\n    color: mat-color($primary, default-contrast);\n  }\n\n  .mat-calendar-body-disabled > .mat-calendar-body-selected {\n    background-color: fade-out(mat-color($primary), $mat-datepicker-selected-fade-amount);\n  }\n\n  .mat-calendar-body-today {\n    &: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-selected {\n      box-shadow: inset 0 0 0 $mat-datepicker-selected-today-box-shadow-width\n                  mat-color($primary, default-contrast);\n    }\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\n\n\n\n\n@mixin mat-dialog-theme($theme) {\n  $background: map-get($theme, background);\n\n  .mat-dialog-container {\n    background: mat-color($background, dialog);\n  }\n}\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\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\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  $background: map-get($theme, background);\n  $foreground: map-get($theme, foreground);\n\n  // Placeholder colors. Required is used for the `*` star shown in the placeholder.\n  $input-placeholder-color: mat-color($foreground, hint-text);\n  $input-floating-placeholder-color: mat-color($primary);\n  $input-required-placeholder-color: mat-color($accent);\n\n  // Underline colors.\n  $input-underline-color: mat-color($foreground, divider);\n  $input-underline-color-accent: mat-color($accent);\n  $input-underline-color-warn: mat-color($warn);\n  $input-underline-focused-color: mat-color($primary);\n\n  .mat-input-placeholder {\n    color: $input-placeholder-color;\n  }\n\n  // :focus is applied to the input, but we apply mat-focused to the other elements\n  // that need to listen to it.\n  .mat-focused .mat-input-placeholder {\n    color: $input-floating-placeholder-color;\n\n    &.mat-accent {\n      color: $input-underline-color-accent;\n    }\n\n    &.mat-warn {\n      color: $input-underline-color-warn;\n    }\n  }\n\n  .mat-input-element:disabled {\n    color: mat-color($foreground, disabled-text);\n  }\n\n  // See mat-input-placeholder-floating mixin in input.scss\n  input.mat-input-element:-webkit-autofill + .mat-input-placeholder,\n  .mat-focused .mat-input-placeholder.mat-float {\n    .mat-placeholder-required {\n      color: $input-required-placeholder-color;\n    }\n  }\n\n  .mat-input-underline {\n    border-color: $input-underline-color;\n\n    .mat-input-ripple {\n      background-color: $input-underline-focused-color;\n\n      &.mat-accent {\n        background-color: $input-underline-color-accent;\n      }\n      &.mat-warn {\n        background-color: $input-underline-color-warn;\n      }\n    }\n  }\n\n  // Styling for the error state of the input container. 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-input-invalid {\n    .mat-input-placeholder,\n    .mat-placeholder-required {\n      color: $input-underline-color-warn;\n    }\n\n    .mat-input-underline {\n      border-color: $input-underline-color-warn;\n    }\n\n    .mat-input-ripple {\n      background-color: $input-underline-color-warn;\n    }\n  }\n\n  .mat-input-error {\n    color: $input-underline-color-warn;\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 {\n    .mat-list-item {\n      color: mat-color($foreground, text);\n    }\n\n    .mat-subheader {\n      color: mat-color($foreground, secondary-text);\n    }\n  }\n\n  .mat-divider {\n    border-top-color: mat-color($foreground, divider);\n  }\n\n  .mat-nav-list .mat-list-item-content {\n    &:hover, &.mat-list-item-focus {\n      background: mat-color($background, 'hover');\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-content {\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      color: mat-color($foreground, 'disabled');\n    }\n\n    .mat-icon {\n      color: mat-color($foreground, 'icon');\n      vertical-align: middle;\n    }\n\n    &:hover:not([disabled]), &:focus:not([disabled]) {\n      background: mat-color($background, 'hover');\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    background: #{_mat-progress-bar-buffer($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      background: #{_mat-progress-bar-buffer($accent, lighter)};\n    }\n\n    .mat-progress-bar-buffer {\n      background-color: mat-color($accent, lighter);\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      background: #{_mat-progress-bar-buffer($warn, lighter)};\n    }\n\n    .mat-progress-bar-buffer {\n      background-color: mat-color($warn, lighter);\n    }\n    .mat-progress-bar-fill::after {\n      background-color: mat-color($warn);\n    }\n  }\n}\n\n// TODO(josephperrott): Find better way to inline svgs.\n// In buffer mode a repeated SVG object is used as a background.\n// Each of the following defines the SVG object for each of the class defined colors.\n//\n// The string is a URL encoded version of:\n//\n// <svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n//      version=\"1.1\" x=\"0px\" y=\"0px\" enable-background=\"new 0 0 5 2\"\n//      xml:space=\"preserve\" viewBox=\"0 0 5 2\" preserveAspectRatio=\"none slice\">\n//   <circle cx=\"1\" cy=\"1\" r=\"1\" fill=\"{INJECTED_COLOR}\"/>\n// </svg>\n@function _mat-progress-bar-buffer($palette, $hue) {\n  $color: mat-color($palette, $hue) + '';\n\n  // We also need to escape the hash in hex colors,\n  // otherwise IE will throw an XML error.\n  @if str-index($color, '#') == 1 {\n    $color: '%23' + str-slice($color, 2);\n  }\n\n  $result: '' +\n    'data:image/svg+xml;charset=UTF-8,%3Csvg%20version%3D%271.1%27%20xmlns%3D%27http%3A%2F%2F' +\n    'www.w3.org%2F2000%2Fsvg%27%20xmlns%3Axlink%3D%27http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%2' +\n    '7%20x%3D%270px%27%20y%3D%270px%27%20enable-background%3D%27new%200%200%205%202%27%20xml%' +\n    '3Aspace%3D%27preserve%27%20viewBox%3D%270%200%205%202%27%20preserveAspectRatio%3D%27none' +\n    '%20slice%27%3E%3Ccircle%20cx%3D%271%27%20cy%3D%271%27%20r%3D%271%27%20fill%3D%27' +\n    $color + '%27%2F%3E%3C%2Fsvg%3E';\n\n  @return url($result);\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    path {\n      stroke: mat-color($primary);\n    }\n\n    &.mat-accent path {\n      stroke: mat-color($accent);\n    }\n\n    &.mat-warn path {\n      stroke: mat-color($warn);\n    }\n  }\n}\n\n\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-checked .mat-radio-outer-circle {\n    border-color: mat-color($accent);\n  }\n\n  .mat-radio-disabled .mat-radio-outer-circle {\n    border-color: mat-color($foreground, disabled);\n  }\n\n  .mat-radio-inner-circle {\n    background-color: mat-color($accent);\n  }\n\n  .mat-radio-ripple .mat-ripple-element {\n    background-color: mat-color($accent, 0.26);\n  }\n\n  .mat-radio-disabled {\n    .mat-radio-ripple .mat-ripple-element, .mat-radio-inner-circle {\n      background-color: mat-color($foreground, disabled);\n    }\n  }\n}\n\n\n\n\n@mixin _mat-select-inner-content-theme($palette) {\n  $color: mat-color($palette);\n\n  .mat-select-trigger, .mat-select-arrow {\n    color: $color;\n  }\n\n  .mat-select-underline {\n    background-color: $color;\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-trigger,\n  .mat-select-arrow {\n    color: mat-color($foreground, hint-text);\n  }\n\n  .mat-select-underline {\n    background-color: mat-color($foreground, divider);\n  }\n\n  .mat-select-disabled .mat-select-value,\n  .mat-select-arrow,\n  .mat-select-trigger {\n    color: mat-color($foreground, hint-text);\n  }\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:focus:not(.mat-select-disabled) {\n    &.mat-primary {\n      @include _mat-select-inner-content-theme($primary);\n    }\n\n    &.mat-accent {\n      @include _mat-select-inner-content-theme($accent);\n    }\n  }\n\n  .mat-select:focus:not(.mat-select-disabled).mat-warn,\n  .mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) {\n    @include _mat-select-inner-content-theme($warn);\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  $sidenav-backdrop-color: invert(mat-color($background, card, 0.6)) !default;\n  $sidenav-background-color: mat-color($background, dialog) !default;\n  $sidenav-container-background-color:  mat-color($background, background) !default;\n  $sidenav-push-background-color: mat-color($background, dialog) !default;\n\n  .mat-sidenav-container {\n    background-color: $sidenav-container-background-color;\n    color: mat-color($foreground, text);\n  }\n\n  .mat-sidenav {\n    background-color: $sidenav-background-color;\n    color: mat-color($foreground, text);\n\n    &.mat-sidenav-push {\n      background-color: $sidenav-push-background-color;\n    }\n  }\n\n  .mat-sidenav-backdrop.mat-sidenav-shown {\n    background-color: $sidenav-backdrop-color;\n  }\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 specificity would be to high for\n  // 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 or light themes.\n      // Since this is very specific to the slide-toggle component, we're not providing\n      // 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\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\n  $mat-slider-off-color: rgba(black, 0.26);\n  $mat-slider-off-focused-color: rgba(black, 0.38);\n  $mat-slider-disabled-color: rgba(black, 0.26);\n  $mat-slider-labeled-min-value-thumb-color: black;\n  $mat-slider-labeled-min-value-thumb-label-color: rgba(black, 0.26);\n  $mat-slider-focus-ring-color: rgba(mat-color($accent), 0.2);\n  $mat-slider-focus-ring-min-value-color: rgba(black, 0.12);\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\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:focus {\n    background-color: mat-color($primary, lighter, 0.3);\n  }\n\n  .mat-ink-bar {\n    background-color: mat-color($primary);\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\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-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}\n\n\n\n\n\n@mixin mat-tooltip-theme($theme) {\n  .mat-tooltip {\n    background: mat-color($mat-grey, 700, 0.9);\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-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-datepicker-theme($theme);\n  @include mat-dialog-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-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-tabs-theme($theme);\n  @include mat-toolbar-theme($theme);\n  @include mat-tooltip-theme($theme);\n}\n","@import 'variables';\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://www.google.com/design/spec/what-is-material/elevation-shadows.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$_umbra-color: rgba(black, 0.2);\n$_penumbra-color: rgba(black, 0.14);\n$_ambient-color: rgba(black, 0.12);\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$_umbra-elevation-map: (\n  0: '0px 0px 0px 0px #{$_umbra-color}',\n  1: '0px 2px 1px -1px #{$_umbra-color}',\n  2: '0px 3px 1px -2px #{$_umbra-color}',\n  3: '0px 3px 3px -2px #{$_umbra-color}',\n  4: '0px 2px 4px -1px #{$_umbra-color}',\n  5: '0px 3px 5px -1px #{$_umbra-color}',\n  6: '0px 3px 5px -1px #{$_umbra-color}',\n  7: '0px 4px 5px -2px #{$_umbra-color}',\n  8: '0px 5px 5px -3px #{$_umbra-color}',\n  9: '0px 5px 6px -3px #{$_umbra-color}',\n  10: '0px 6px 6px -3px #{$_umbra-color}',\n  11: '0px 6px 7px -4px #{$_umbra-color}',\n  12: '0px 7px 8px -4px #{$_umbra-color}',\n  13: '0px 7px 8px -4px #{$_umbra-color}',\n  14: '0px 7px 9px -4px #{$_umbra-color}',\n  15: '0px 8px 9px -5px #{$_umbra-color}',\n  16: '0px 8px 10px -5px #{$_umbra-color}',\n  17: '0px 8px 11px -5px #{$_umbra-color}',\n  18: '0px 9px 11px -5px #{$_umbra-color}',\n  19: '0px 9px 12px -6px #{$_umbra-color}',\n  20: '0px 10px 13px -6px #{$_umbra-color}',\n  21: '0px 10px 13px -6px #{$_umbra-color}',\n  22: '0px 10px 14px -6px #{$_umbra-color}',\n  23: '0px 11px 14px -7px #{$_umbra-color}',\n  24: '0px 11px 15px -7px #{$_umbra-color}'\n);\n\n$_penumbra-elevation-map: (\n  0: '0px 0px 0px 0px #{$_penumbra-color}',\n  1: '0px 1px 1px 0px #{$_penumbra-color}',\n  2: '0px 2px 2px 0px #{$_penumbra-color}',\n  3: '0px 3px 4px 0px #{$_penumbra-color}',\n  4: '0px 4px 5px 0px #{$_penumbra-color}',\n  5: '0px 5px 8px 0px #{$_penumbra-color}',\n  6: '0px 6px 10px 0px #{$_penumbra-color}',\n  7: '0px 7px 10px 1px #{$_penumbra-color}',\n  8: '0px 8px 10px 1px #{$_penumbra-color}',\n  9: '0px 9px 12px 1px #{$_penumbra-color}',\n  10: '0px 10px 14px 1px #{$_penumbra-color}',\n  11: '0px 11px 15px 1px #{$_penumbra-color}',\n  12: '0px 12px 17px 2px #{$_penumbra-color}',\n  13: '0px 13px 19px 2px #{$_penumbra-color}',\n  14: '0px 14px 21px 2px #{$_penumbra-color}',\n  15: '0px 15px 22px 2px #{$_penumbra-color}',\n  16: '0px 16px 24px 2px #{$_penumbra-color}',\n  17: '0px 17px 26px 2px #{$_penumbra-color}',\n  18: '0px 18px 28px 2px #{$_penumbra-color}',\n  19: '0px 19px 29px 2px #{$_penumbra-color}',\n  20: '0px 20px 31px 3px #{$_penumbra-color}',\n  21: '0px 21px 33px 3px #{$_penumbra-color}',\n  22: '0px 22px 35px 3px #{$_penumbra-color}',\n  23: '0px 23px 36px 3px #{$_penumbra-color}',\n  24: '0px 24px 38px 3px #{$_penumbra-color}'\n);\n\n$_ambient-elevation-map: (\n  0: '0px 0px 0px 0px #{$_ambient-color}',\n  1: '0px 1px 3px 0px #{$_ambient-color}',\n  2: '0px 1px 5px 0px #{$_ambient-color}',\n  3: '0px 1px 8px 0px #{$_ambient-color}',\n  4: '0px 1px 10px 0px #{$_ambient-color}',\n  5: '0px 1px 14px 0px #{$_ambient-color}',\n  6: '0px 1px 18px 0px #{$_ambient-color}',\n  7: '0px 2px 16px 1px #{$_ambient-color}',\n  8: '0px 3px 14px 2px #{$_ambient-color}',\n  9: '0px 3px 16px 2px #{$_ambient-color}',\n  10: '0px 4px 18px 3px #{$_ambient-color}',\n  11: '0px 4px 20px 3px #{$_ambient-color}',\n  12: '0px 5px 22px 4px #{$_ambient-color}',\n  13: '0px 5px 24px 4px #{$_ambient-color}',\n  14: '0px 5px 26px 4px #{$_ambient-color}',\n  15: '0px 6px 28px 5px #{$_ambient-color}',\n  16: '0px 6px 30px 5px #{$_ambient-color}',\n  17: '0px 6px 32px 5px #{$_ambient-color}',\n  18: '0px 7px 34px 6px #{$_ambient-color}',\n  19: '0px 7px 36px 6px #{$_ambient-color}',\n  20: '0px 8px 38px 7px #{$_ambient-color}',\n  21: '0px 8px 40px 7px #{$_ambient-color}',\n  22: '0px 8px 42px 7px #{$_ambient-color}',\n  23: '0px 9px 44px 8px #{$_ambient-color}',\n  24: '0px 9px 46px 8px #{$_ambient-color}'\n);\n\n\n// The css property used for elevation. In most cases this should not be changed. It is exposed\n// as a variable for abstraction / easy use when needing to reference the property directly, for\n// example in a will-change rule.\n$mat-elevation-property: box-shadow !default;\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$mat-elevation-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;\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) {\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  #{$mat-elevation-property}: #{map-get($_umbra-elevation-map, $zValue)},\n                             #{map-get($_penumbra-elevation-map, $zValue)},\n                             #{map-get($_ambient-elevation-map, $zValue)};\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//   will-change: $mat-elevation-property, opacity;\n// }\n@function mat-elevation-transition-property-value(\n    $duration: $mat-elevation-transition-duration,\n    $easing: $mat-elevation-transition-timing-function) {\n  @return #{$mat-elevation-property} #{$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  will-change: $mat-elevation-property;\n}",null,"$black-87-opacity: rgba(black, 0.87);\n$white-87-opacity: rgba(white, 0.87);\n$black-12-opacity: rgba(black, 0.12);\n$white-12-opacity: rgba(white, 0.12);\n$black-6-opacity: rgba(black, 0.06);\n$white-6-opacity: rgba(white, 0.06);\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: $white-87-opacity,\n    A700: $white-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: $white-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: white,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: $black-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: $black-87-opacity,\n    900: $black-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $black-87-opacity,\n    700: $black-87-opacity,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: white,\n    600: white,\n    700: white,\n    800: white,\n    900: white,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: white,\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: white,\n    400: white,\n    500: $white-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: $white-87-opacity,\n  )\n);\n\n$mat-grey: (\n  0: #ffffff,\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  1000: #000000,\n  A100: #ffffff,\n  A200: #eeeeee,\n  A400: #bdbdbd,\n  A700: #616161,\n  contrast: (\n    0: $black-87-opacity,\n    50: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: $black-87-opacity,\n    500: $black-87-opacity,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    1000: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: $black-87-opacity,\n    A700: $white-87-opacity,\n  )\n);\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: $black-87-opacity,\n    100: $black-87-opacity,\n    200: $black-87-opacity,\n    300: $black-87-opacity,\n    400: white,\n    500: white,\n    600: $white-87-opacity,\n    700: $white-87-opacity,\n    800: $white-87-opacity,\n    900: $white-87-opacity,\n    A100: $black-87-opacity,\n    A200: $black-87-opacity,\n    A400: white,\n    A700: $white-87-opacity,\n  )\n);\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: $black-12-opacity,\n  raised-button: white,\n  focused-button: $black-6-opacity,\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);\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: $white-12-opacity,\n  raised-button: map-get($mat-grey, 800),\n  focused-button: $white-6-opacity,\n  selected-button: map_get($mat-grey, 900),\n  selected-disabled-button: map_get($mat-grey, 800),\n  disabled-button-toggle: map_get($mat-grey, 1000),\n);\n\n// Foreground palette for light themes.\n$mat-light-theme-foreground: (\n  base:            black,\n  divider:         $black-12-opacity,\n  dividers:        $black-12-opacity,\n  disabled:        rgba(black, 0.38),\n  disabled-button: rgba(black, 0.38),\n  disabled-text:   rgba(black, 0.38),\n  hint-text:       rgba(black, 0.38),\n  secondary-text:  rgba(black, 0.54),\n  icon:            rgba(black, 0.54),\n  icons:           rgba(black, 0.54),\n  text:            rgba(black, 0.87)\n);\n\n// Foreground palette for dark themes.\n$mat-dark-theme-foreground: (\n  base:            white,\n  divider:         $white-12-opacity,\n  dividers:        $white-12-opacity,\n  disabled:        rgba(white, 0.3),\n  disabled-button: rgba(white, 0.3),\n  disabled-text:   rgba(white, 0.3),\n  hint-text:       rgba(white, 0.3),\n  secondary-text:  rgba(white, 0.7),\n  icon:            white,\n  icons:           white,\n  text:            white\n);","@import './styles/theme-functions';\n\n@mixin td-common-theme($theme) {\n  $warn: map-get($theme, warn);\n  $foreground: map-get($theme, foreground);\n  $background: map-get($theme, background);\n\n  md-list-item,\n  .mat-list-item-content {\n        md-icon {\n        color: mat-color($foreground, icon);\n        &[md-list-avatar] {\n            background-color: mat-color($background, hover);\n        }\n    }\n  }\n  .mat-list-text {\n      p {\n          color:  mat-color($foreground, disabled);\n      }\n  }\n}","@import '../common/styles/elevation';\n@import '../common/styles/theme-functions';\n\n@mixin td-layout-theme($theme) {\n  $background: map-get($theme, background);\n  $foreground: map-get($theme, foreground);\n\n  .mat-sidenav-container {\n    background-color: mat-color($background, status-bar);\n  }\n\n  td-layout-nav,\n  td-layout-nav-list,\n  td-layout-manage-list,\n  td-layout-card-over,\n  td-navigation-drawer,\n  td-layout {\n    md-toolbar {\n      @include mat-elevation(1);\n      z-index: 1;\n    }\n  }\n  .td-layout-footer {\n    background: mat-color($background, app-bar);\n    color: mat-color($foreground, text);\n    @include mat-elevation(2);\n  }\n}","@import '../common/styles/variables';\n@import '../common/styles/elevation';\n@import '../common/styles/theme-functions';\n\n@mixin td-steps-theme($theme) {\n  $accent: map-get($theme, accent);\n  $warn: map-get($theme, warn);\n  $foreground: map-get($theme, foreground);\n  $background: map-get($theme, background);\n  td-steps {\n    .td-steps-header {\n      @include mat-elevation(1);\n    }\n    .td-step-content,\n    .td-step-summary,\n    .td-step-actions {\n      margin: $margin;\n    }\n    // steps\n    .td-horizontal-line {\n      border-bottom-color: mat-color($foreground, divider);\n    }\n    .td-vertical-line {\n      border-left-color: mat-color($foreground, divider);\n    }\n    // header\n    .td-step-header {\n      &:focus,\n      &:hover {\n        background: mat-color($background, 'hover');\n      }\n      .td-step-label-wrapper {\n        .md-caption {\n          color: mat-color($foreground, secondary-text);\n        }\n        &.mat-disabled {\n          &, & * {\n            color: mat-color($foreground, disabled);\n          }\n        }\n        &.mat-warn {\n          &, & * {\n            color: mat-color($warn);\n          }\n        }\n      }\n      .mat-complete {\n        color: mat-color($accent);\n      }\n    }\n    .td-circle {\n      color: mat-color($background, card);\n      &.mat-active {\n        background-color: mat-color($accent);\n      }\n      &.mat-inactive {\n        background-color: mat-color($foreground, disabled);\n      }\n      & md-icon {\n        fill: mat-color($foreground, text);\n      }\n    }\n    .td-triangle {\n      color: mat-color($warn);\n    }\n    .td-edit-icon {\n      color: mat-color($foreground, icon);\n    }\n  }\n}","@import 'theme-functions';\n\n// Teradata UI Platform\n// ------------------------------\n$navigation-drawer-width: 320px !default;\n$padding: 16px;\n$margin: $padding;\n$step-circle: 24px;\n\n// Typography\n// ------------------------------\n$font-family: RobotoDraft, Roboto, 'Helvetica Neue', sans-serif !default;\n$font-size: 10px;\n\n$display-4-font-size-base: rem(11.20) !default;\n$display-3-font-size-base: rem(5.600) !default;\n$display-2-font-size-base: rem(4.500) !default;\n$display-1-font-size-base: rem(3.400) !default;\n$headline-font-size-base: rem(2.400) !default;\n$title-font-size-base: rem(2.000) !default;\n$subhead-font-size-base: rem(1.600) !default;\n\n$body-font-size-base: rem(1.400) !default;\n$caption-font-size-base: rem(1.200) !default;\n\n// Layout\n$baseline-grid: 8px !default;\n$layout-breakpoint-xs: 600px !default;\n$layout-breakpoint-sm: 600px !default;\n$layout-breakpoint-md: 960px !default;\n$layout-breakpoint-lg: 1280px !default;\n$layout-gutter-width: ($baseline-grid * 2) !default;\n\n// Typography\n$md-body-font-size-base: rem(1.400) !default;\n\n// App bar variables\n$app-bar-height: 64px;\n\n// card header variables\n$md-card-header-size: 40px;\n\n// Icons\n$icon-size: rem(2.4);\n\n// Toast\n$toast-height: $baseline-grid * 3 !default;\n$toast-margin: $baseline-grid * 1 !default;\n\n// Whiteframes\n$whiteframe-shadow-z1: 0px 2px 5px 0 rgba(0, 0, 0, 0.26) !default;\n$whiteframe-zindex-z1: 1 !default;\n$whiteframe-shadow-z2: 0px 8px 17px rgba(0, 0, 0, 0.2) !default;\n$whiteframe-zindex-z2: 2 !default;\n$whiteframe-shadow-z3: 0px 17px 50px rgba(0, 0, 0, 0.19) !default;\n$whiteframe-zindex-z3: 3 !default;\n$whiteframe-shadow-z4: 0px 16px 28px 0 rgba(0, 0, 0, 0.22) !default;\n$whiteframe-zindex-z4: 4 !default;\n$whiteframe-shadow-z5: 0px 27px 24px 0 rgba(0, 0, 0, 0.2) !default;\n$whiteframe-zindex-z5: 5 !default;\n\n// Z-indexes\n$z-index-tooltip: 100 !default;\n$z-index-dialog: 80 !default;\n$z-index-toast: 90 !default;\n$z-index-bottom-sheet: 70 !default;\n$z-index-scroll-mask: 65 !default;\n$z-index-sidenav: 60 !default;\n$z-index-backdrop: 50 !default;\n$z-index-toolbar: 30 !default;\n$z-index-fab: 20 !default;\n$z-index-progress-circular: 2 !default; // Used to fix animation bug in Chrome\n\n// Easing Curves\n\n// The default animation curves used by material design.\n$md-linear-out-slow-in-timing-function: cubic-bezier(0.0, 0.0, 0.2, 0.1) !default;\n$md-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0.0, 0.2, 1) !default;\n$md-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0.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: 0.4s !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: 0.3s !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: 0.5s !default;\n$swift-ease-in-out-timing-function: cubic-bezier(0.35, 0, 0.25, 1) !default;\n$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;\n\n$swift-linear-duration: 0.08s !default;\n$swift-linear-timing-function: linear !default;\n$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;\n","@import '../common/styles/variables';\n@import '../common/styles/elevation';\n@import '../common/styles/theme-functions';\n\n@mixin td-expansion-panel-theme($theme) {\n  $accent: map-get($theme, accent);\n  $warn: map-get($theme, warn);\n  $foreground: map-get($theme, foreground);\n  $background: map-get($theme, background);\n  // panel\n  td-expansion-panel {\n    @include mat-elevation(1);\n    background-color: mat-color($background, card);\n    &:not(:last-of-type) {\n      & .td-expanded {\n        margin-bottom: $margin;\n      }\n    }\n    &:not(:first-of-type) {\n      & .td-expanded {\n        margin-top: $margin;\n      }\n    }\n    .td-expansion-panel-header {\n      &:focus,\n      &:hover {\n        background: mat-color($background, 'hover');\n      }\n      .td-expansion-panel-header-content {\n        md-icon.td-expand-icon {\n          color: mat-color($foreground, icon);\n        }\n        &.mat-disabled {\n          &, & * {\n            color: mat-color($foreground, disabled);\n          }\n        }\n      }\n    }\n    md-icon.td-expand-icon {\n      color: mat-color($foreground, icon);\n    }\n    .td-expansion-label,\n    .td-expansion-sublabel {\n      &, & * {\n        vertical-align: middle;\n      }\n    }\n    .td-expansion-sublabel {\n      color: mat-color($foreground, secondary-text);\n    }\n  }\n}","@import '../common/styles/theme-functions';\n\n@mixin td-chips-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  // chips\n  td-chips {\n    // chip\n    .mat-basic-chip {\n      background: mat-color($background, status-bar);\n      color: mat-color($foreground, text);\n      &:focus:not(.td-chip-disabled) {\n        background: mat-color($primary);\n        &, md-icon {\n          color: mat-color($primary, default-contrast);\n          md-icon:hover {\n            color: mat-color($foreground, icon);\n          }\n        }\n      }\n      md-icon {\n        color: mat-color($foreground, hint-text);\n        &:hover {\n          color: mat-color($foreground, icon);\n        }\n      }\n    }\n  }\n}","@import '../common/styles/variables';\n@import '../common/styles/elevation';\n@import '../common/styles/theme-functions';\n\n@mixin td-file-theme($theme) {\n  $background: map-get($theme, background);\n\n  td-file-upload {\n    .td-file-upload-cancel {\n      md-icon {\n        background-color: mat-color($background, background);\n      }\n    }\n  }\n  td-file-input {\n    /**\n    * Class that is added ondragenter by the [TdFileDrop] directive.\n    */\n    .drop-zone {\n      transition: background $swift-ease-out-duration $swift-ease-out-timing-function,\n                mat-elevation-transition-property-value();\n      @include mat-elevation(8);\n    }\n  }\n}","@import '../common/styles/theme-functions';\n\n@mixin td-json-formatter-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  $background: map-get($theme, background);\n  .td-json-formatter-wrapper {\n    .td-key {\n      &.td-key-node {\n        &:focus,\n        &:hover {\n          background-color: mat-color($background, hover);\n        }\n      }\n    }\n    .key {\n      color: mat-color($primary);\n    }\n    .value {\n      .string {\n        color: mat-color($warn);\n      }\n      .number { \n        color: mat-color($accent);\n      }\n      .boolean { \n        color: mat-color($accent);\n      }\n      .null,\n      .undefined { \n        color: mat-color($foreground, disabled-text);\n      }\n      .function { \n        color: mat-color($primary);\n      }\n      .date { \n        color: mat-color($foreground, text);\n      }\n    }\n  }\n}","@import '../common/styles/theme-functions';\n\n@mixin td-paging-bar-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  td-paging-bar {\n    &, & md-select .mat-select-value { \n      color: mat-color($foreground, secondary-text);\n    }\n  }\n}","@import '../common/styles/theme-functions';\n\n@mixin td-loading-theme($theme) {\n  $background: map-get($theme, background);\n  .td-loading-wrapper {\n    &.td-overlay .td-loading {\n      background: rgba(mat-color($background, dialog), 0.8);\n    }\n  }\n}","@import '../common/styles/theme-functions';\n\n@mixin td-data-table-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  table[td-data-table] {\n    .td-data-table-row {\n      border-bottom-color: mat-color($foreground, divider);\n    }\n    .mat-checkbox-cell,\n    .mat-checkbox-column {\n      color: mat-color($foreground, secondary-text);\n      md-pseudo-checkbox.mat-pseudo-checkbox-checked {\n        color: mat-color($accent, 500);\n      }\n    }\n    .td-data-table-cell {\n      font-size: 14px;\n      font-weight: 400;\n      letter-spacing: 0.010em;\n      line-height: 20px;\n      md-input-container {\n        .mat-input-underline {\n          display: none;\n        }\n      }\n    }\n    .td-data-table-column {\n      font-size: 12px;\n      color: mat-color($foreground, secondary-text);\n      * {\n        vertical-align: middle;\n      }\n      md-icon {\n        &.td-data-table-sort-icon {\n          color: mat-color($foreground, disabled);\n        }\n      }\n      &.mat-active,\n      &.mat-active md-icon {\n        color: mat-color($foreground, base);\n      }\n    }\n    &.mat-selectable tbody > tr.td-data-table-row {\n      &:not([disabled]):not(.mat-selected):focus {\n        background-color: mat-color($background, 'hover');\n      }\n      &.mat-selected {\n        background-color: mat-color($accent, 0.12);\n      }\n    }\n    &.mat-clickable tbody > tr.td-data-table-row {\n      &:not([disabled]){\n        &:hover {\n          background-color: mat-color($background, 'hover');\n        }\n        &:active {\n          background-color: mat-color($accent, 0.12);\n        }\n      }\n    }\n  }\n  .mat-selected-title {\n    background-color: mat-color($accent, 0.12);\n    color: mat-color($accent);\n  }\n}\n","@import '../common/styles/variables';\n@import '../common/styles/elevation';\n@import '../common/styles/theme-functions';\n\n@mixin td-notification-count-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  $background: map-get($theme, background);\n\n  .td-notification-count {\n    @include mat-elevation(1);\n    &.mat-warn {\n      background-color: mat-color($warn);\n      color: mat-color($warn, default-contrast);\n    }\n    &.mat-primary {\n      background-color: mat-color($primary);\n      color: mat-color($primary, default-contrast);\n    }\n    &.mat-accent {\n      background-color: mat-color($accent);\n      color: mat-color($accent, default-contrast);\n    }\n  }\n}","@import '../common/styles/theme-functions';\n\n@mixin td-message-theme($theme) {\n  $primary: map-get($theme, primary);\n  $accent: map-get($theme, accent);\n  $warn: map-get($theme, warn);\n\n  .td-message {\n    &.mat-primary {\n      color: mat-color($primary);\n      background-color: mat-color($primary, 0.15);\n    }\n    &.mat-accent {\n      color: mat-color($accent);\n      background-color: mat-color($accent, 0.15);\n    }\n    &.mat-warn {\n      color: mat-color($warn);\n      background-color: mat-color($warn, 0.15);\n    }\n  }\n}"]}