styles.26c7acdc1e2d44a6f9e6.css.map

{"version":3,"sources":["./node_modules/@angular/material/badge/_badge-theme.scss","./src/styles/main.scss","./node_modules/@angular/material/core/typography/_typography.scss","./node_modules/@angular/material/core/typography/_typography-utils.scss","./node_modules/@angular/material/bottom-sheet/_bottom-sheet-theme.scss","./node_modules/@angular/material/button/_button-theme.scss","./node_modules/@angular/material/card/_card-theme.scss","./node_modules/@angular/material/checkbox/_checkbox-theme.scss","./node_modules/@angular/material/chips/_chips-theme.scss","./node_modules/@angular/material/table/_table-theme.scss","./node_modules/@angular/material/datepicker/_datepicker-theme.scss","./node_modules/@angular/material/dialog/_dialog-theme.scss","./node_modules/@angular/material/expansion/_expansion-theme.scss","./node_modules/@angular/material/form-field/_form-field-theme.scss","./node_modules/@angular/material/form-field/_form-field-legacy-theme.scss","./node_modules/@angular/material/form-field/_form-field-fill-theme.scss","./node_modules/@angular/material/form-field/_form-field-outline-theme.scss","./node_modules/@angular/material/grid-list/_grid-list-theme.scss","./node_modules/@angular/material/core/style/_list-common.scss","./node_modules/@angular/material/input/_input-theme.scss","./node_modules/@angular/material/menu/_menu-theme.scss","./node_modules/@angular/material/paginator/_paginator-theme.scss","./node_modules/@angular/material/select/_select-theme.scss","./node_modules/@angular/material/slider/_slider-theme.scss","./node_modules/@angular/material/slide-toggle/_slide-toggle-theme.scss","./node_modules/@angular/material/stepper/_stepper-theme.scss","./node_modules/@angular/material/tabs/_tabs-theme.scss","./node_modules/@angular/material/toolbar/_toolbar-theme.scss","./node_modules/@angular/material/tooltip/_tooltip-theme.scss","./node_modules/@angular/material/list/_list-theme.scss","./node_modules/@angular/material/core/option/_option-theme.scss","./node_modules/@angular/material/core/option/_optgroup-theme.scss","./node_modules/@angular/material/snack-bar/_snack-bar-theme.scss","./node_modules/@angular/material/tree/_tree-theme.scss","./node_modules/@angular/material/core/ripple/_ripple.scss","./node_modules/@angular/cdk/a11y/_index.scss","./node_modules/@angular/cdk/overlay/_index.scss","./node_modules/@angular/cdk/text-field/_index.scss","./node_modules/@angular/material/core/_core.scss","./node_modules/@angular/material/core/ripple/_ripple-theme.scss","./node_modules/@angular/material/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss","./node_modules/@angular/material/core/_core-theme.scss","./node_modules/@angular/material/core/style/_elevation.scss","./node_modules/@angular/material/autocomplete/_autocomplete-theme.scss","./node_modules/@angular/material/button-toggle/_button-toggle-theme.scss","./node_modules/@angular/material/divider/_divider-theme.scss","./node_modules/@angular/material/expansion/_expansion-mixins.scss","./node_modules/@angular/material/core/style/_form-common.scss","./node_modules/@angular/material/form-field/_form-field-standard-theme.scss","./node_modules/@angular/material/icon/_icon-theme.scss","./node_modules/@angular/material/core/style/_vendor-prefixes.scss","./node_modules/@angular/material/progress-bar/_progress-bar-theme.scss","./node_modules/@angular/material/progress-spinner/_progress-spinner-theme.scss","./node_modules/@angular/material/radio/_radio-theme.scss","./node_modules/@angular/material/sidenav/_sidenav-theme.scss","./node_modules/@angular/material/sort/_sort-theme.scss","./src/styles/0-base/_typography.scss","./src/styles/_constants.scss","./src/styles/_mixins.scss","./src/styles/1-layouts/_content-layout.scss","./src/styles/1-layouts/_doc-viewer.scss","./src/styles/1-layouts/_footer.scss","./src/styles/1-layouts/_layout-global.scss","./src/styles/1-layouts/_marketing-layout.scss","./src/styles/1-layouts/_not-found.scss","./src/styles/1-layouts/_sidenav.scss","./src/styles/1-layouts/_top-menu.scss","./src/styles/2-modules/_alert.scss","./src/styles/2-modules/_api-list.scss","./src/styles/2-modules/_api-pages.scss","./src/styles/2-modules/_api-symbols.scss","./src/styles/2-modules/_buttons.scss","./src/styles/2-modules/_callout.scss","./src/styles/2-modules/_card.scss","./src/styles/2-modules/_cli-pages.scss","./src/styles/2-modules/_code.scss","./src/styles/2-modules/_contribute.scss","./src/styles/2-modules/_contributor.scss","./src/styles/2-modules/_details.scss","./src/styles/2-modules/_errors.scss","./src/styles/2-modules/_features.scss","./src/styles/2-modules/_filetree.scss","./src/styles/2-modules/_guides.scss","./src/styles/2-modules/_heading-anchors.scss","./src/styles/2-modules/_hr.scss","./src/styles/2-modules/_images.scss","./src/styles/2-modules/_label.scss","./src/styles/2-modules/_notification.scss","./src/styles/2-modules/_progress-bar.scss","./src/styles/2-modules/_presskit.scss","./src/styles/2-modules/_resources.scss","./src/styles/2-modules/_roadmap.scss","./src/styles/2-modules/_search-results.scss","./src/styles/2-modules/_select-menu.scss","./src/styles/2-modules/_table.scss","./src/styles/2-modules/_toc.scss","./src/styles/_translator.scss","./src/styles/_print.scss"],"names":[],"mappings":"AAmME,mBACE,eAxLU,CAyLV,cA1LQ,CA2LR,4CClMJ,CDqME,oCAEE,aCnMJ,CDsME,oCACE,cCnMJ,CC+IE,yCC5FE,oDAYF,sBDkFE,eD3IJ,CC8IE,sCCjGE,oDAYF,sBDuFE,eD1IJ,CC6IE,6CCtGE,oDAYF,sBD4FE,eDzIJ,CC4IE,6CC3GE,oDAYF,sBDiGE,eDxIJ,CC8IE,2BCnHE,gED4HA,eDlJJ,CCqJE,2BC/HE,gEDwIA,eDzJJ,CC4JE,6BC3IE,oDAYF,qBFxBF,CC2JE,sCC/IE,oDAYF,qBFnBF,CCyJI,4CACE,eDvJN,CC2JE,wBCvJE,oDAYF,qBFXF,CC0JE,8CC3JE,sDAYF,sBDiJE,eDtJJ,CCyJE,8CChKE,oDAYF,sBDsJE,eDrJJ,CCwJE,8CCrKE,oDAYF,uBD2JE,eDpJJ,CCuJE,8CC1KE,oDAYF,sBDgKE,eDnJJ,CGnEE,4BD0CE,oDAYF,qBFkBF,CI2EE,4GAGI,6CACA,eACA,eJzEN,CKrEE,6BACE,4CL4EJ,CKzEE,gBAEI,eACA,eL2EN,CKvEE,iCACE,cL0EJ,CKvEE,qCAEE,cL0EJ,CMpBE,cACE,4CNuBJ,CMnBE,yCACE,gBNsBJ,COpCE,UACE,eACA,ePuCJ,COrCI,+EAEE,cPuCN,CQrGE,WACE,4CRwGJ,CQrGE,iBACE,eACA,eRwGJ,CQrGE,2BACE,cRwGJ,CSmCE,cACE,4CThCJ,CSmCE,mBACE,cThCJ,CSmCE,qDAGI,eACA,eTjCN,CSqCE,8BAEI,cA9L6B,CA+L7B,eTnCN,CUrJE,kBRyCE,oDAYF,qBFqGF,CWrHE,4BAEI,6CACA,eACA,eXuHN,CWnHE,6BTJE,oDAYF,qBFgHF,CYzBE,gBV5GE,iBAeU,CAdV,eAeY,CAdZ,iBAeY,CAdZ,4CAeY,CAGd,qBFwHF,CY7BE,wBACE,wBZgCJ,CY1BI,kEACE,cAvB2B,CAwB3B,iBZ8BN,CY1BI,gFACE,aACA,WZ6BN,CY3BM,oGACE,eACA,iBZ8BR,CYzBE,sBACE,eAEA,qCZ2BJ,CYvBI,kLAvEF,4CAEA,qBZkGF,CYrBI,yHA/EF,4CAEA,qBZsGF,CYlBE,8BACE,cACA,oBZqBJ,CYlBE,sBACE,aZqBJ,CYlBE,0BAGE,gBZmBJ,CYhBE,kCACE,aA/EoB,CAgFpB,wBAzEqB,CA6ErB,+BZgBJ,CatJI,0DACE,qBbyJN,CatJI,wDACE,iBbwJN,CapJM,oPA3DJ,kFAIA,gDAGA,qBb8MF,CanJM,iKAlEJ,oFAIA,gDAGA,qBbmNF,CahJM,0JA1EJ,oFAIA,gDAGA,qBbwNF,Ca9II,wDACE,abgJN,Ca7II,4DAGE,ab6IN,Ca1II,oEACE,wBAjDmB,CAqDnB,+BbyIN,CanIE,aAGM,oPAzFN,2Cb+NA,Ca/HM,iKAhGN,2CbkOA,Ca1HM,0JAxGN,0CbqOA,CACF,CczNI,sDACE,qBd2NN,CcxNI,sDACE,cACA,gBd0NN,CctNM,gPAlCJ,2CAEA,qBd2PF,CclNM,wJA3CJ,2CAEA,qBd+PF,Ce3MI,yDACE,af8MN,Ce3MI,yDACE,cACA,iBf6MN,CezMM,sPAzCJ,4CAEA,qBfqPF,CerMM,2JAlDJ,4CAEA,qBfyPF,CgB5TE,4CAGE,chB8TJ,CiBlUE,gEARA,mBACA,gBACA,uBAQE,cACA,qBjBuUJ,CiBpUI,8FACE,cjBuUN,CkB/QE,wBACE,mBlBkRJ,CmB7SE,eAEI,6CACA,eACA,enB+SN,CoBtTE,4DAGI,6CACA,cpBwTN,CqBjSE,8BACE,4CrBwSJ,CqBrSE,oBACE,crBwSJ,CsBxME,uDC7FE,4CvB+SJ,CsBlNE,6BAGI,eACA,etB8MN,CwBjRE,8CACE,4CxBoRJ,CwBjRE,gBAEI,eACA,exBmRN,CwB/QE,0BACE,exBkRJ,CwB/QE,sBACE,cxBkRJ,CwB/QE,yBAEI,eACA,exBiRN,CyBlQE,4CAHE,4CzB+QJ,CyB5QE,6BAGI,eACA,ezBwQN,C0BtVE,6GxBVE,oDAYF,sBwBME,Q1B0VJ,C2BjZE,aACE,6CACA,cAtBQ,CAuBR,eAtBe,CAuBf,kB3BoZJ,C2BjZE,qBACE,cAxBgB,CAyBhB,eAvBA,CAwBA,kB3BoZJ,C4BlYE,gCACE,4C5ByYJ,C4BpYI,8BACE,c5BuYN,CiBzbE,wCARA,mBACA,gBACA,uBAQE,cACA,qBjB6bJ,CiB1bI,uDACE,cjB4bN,C4B7YI,gCACE,c5B+YN,CiBtcE,0CARA,mBACA,gBACA,uBAQE,cACA,qBjB0cJ,CiBvcI,yDACE,cjBycN,C4BrZI,8BACE,6CACA,eACA,e5BuZN,C4BjZI,qCACE,c5BoZN,CiBzdE,+CARA,mBACA,gBACA,uBAQE,cACA,qBjB6dJ,C4BvZI,qGACE,c5B4ZN,CiBteE,iDARA,mBACA,gBACA,uBAQE,cACA,qBjB0eJ,CiBveI,gEACE,cjByeN,C4BlaI,qCACE,4CA1CU,CA2CV,eACA,e5BoaN,C6B5cE,YAEI,6CACA,c7B8cN,C8BhfE,oB5B0CE,oDAYF,qBF+bF,C+B7eE,qBAEI,6CACA,c/B+eN,C+B3eE,4BACE,cAEE,oBACA,kBACA,e/B6eN,CgC7fE,UACE,4ChCggBJ,CgC7fE,qCAEE,gBACA,chCggBJ,CiC3hBE,YACE,gBAIA,iBjC2hBJ,CiCphBI,wBACE,uBjCshBN,CiClhBE,iCACE,gBjCqhBJ,CiClhBE,oBACE,kBACA,kBACA,oBAEA,wDACA,kBjCohBJ,CkC/gBI,8CDDE,YjCmhBN,CkCtjBE,qBACE,SACA,mBACA,WACA,YACA,gBACA,UACA,kBACA,UAIA,mBAGA,UAGA,wBACA,oBlCkjBJ,CmCtjBE,mDAEE,oBAGA,MACA,OACA,YACA,UnCsjBJ,CmCljBE,uBACE,eACA,YnCqjBJ,CmCnjBI,6BAGE,YnCmjBN,CmCpiBE,8CANE,aACA,kBACA,YnCwjBJ,CmCpjBE,kBAIE,oBACA,sBAMA,eACA,enCwiBJ,CmCriBE,sBAEE,kBACA,MACA,SACA,OACA,QAEA,YApEuB,CAqEvB,oBACA,wCACA,kDACA,SnCsiBJ,CmCpiBI,mDACE,SnCsiBN,CmCjiBM,6EAGE,UnCiiBR,CmC5hBE,2BACE,0BnC+hBJ,CmCvhBI,iGACE,SnC0hBN,CmCphBE,6CACE,kBACA,YA3Gc,CAgHd,aAIA,sBAGA,cACA,cnC8gBJ,CmC1gBE,wBACE,eAKA,WAKA,iBnCqgBJ,CoC5oBE,+BACE,WpC+oBJ,CoCzoBE,yCAyCA,wBACA,iCAxCE,sBACA,yBpC6oBJ,CoCpoBE,iDA6BA,wBACA,iCA5BE,kBpCwoBJ,CoC9nBE;EAA0C,KpCkoB5C,CoCloBE;EAA0C,KpCkoB5C,CoCjoBE;EAAwC,KpCooB1C,CoCpoBE;EAAwC,KpCooB1C,CoCloBE,oDAEE,qGpCmoBJ,CoChoBE,0DAEE,iGpCkoBJ,CqChpBE,8CACE,iBrCupBJ,CsC5qBE,oBAII,+BtC4qBN,C6B9qBE,YACE,qB7BirBJ,C6BrqBI,4LAHE,0B7BkrBN,C6B/qBI,uBAEE,qB7B6qBN,C6B1qBI,gCACE,qB7B4qBN,C6BxqBE,gEACE,a7B2qBJ,C6BxqBE,+DACE,a7B2qBJ,C6BxqBE,6DACE,a7B2qBJ,C8B/sBE,oBACE,qB9BktBJ,C8B/sBE,2CACE,qB9BktBJ,CuC7sBE,qBACE,qBvCgtBJ,CuC9sBI,2BACE,avCgtBN,CuC5sBE,8BACE,avC+sBJ,CuC5sBE,0FAEE,kBvC+sBJ,CuCvsBE,wJAIE,kBvC0sBJ,CuCvsBE,oFAEE,kBvC0sBJ,CuCrsBI,0HACE,kBvCysBN,CwClvBE,oBAIE,yBACA,qBxCkvBJ,CwC3uBI,kBCkIF,iFzC6mBF,CwC/uBI,kBCkIF,gGzCinBF,CwCnvBI,kBCkIF,gGzCqnBF,CwCvvBI,kBCkIF,gGzCynBF,CwC3vBI,kBCkIF,iGzC6nBF,CwC/vBI,kBCkIF,iGzCioBF,CwCnwBI,kBCkIF,kGzCqoBF,CwCvwBI,kBCkIF,sGzCyoBF,CwC3wBI,kBCkIF,sGzC6oBF,CwC/wBI,kBCkIF,sGzCipBF,CwCnxBI,mBCkIF,uGzCqpBF,CwCvxBI,mBCkIF,uGzCypBF,CwC3xBI,mBCkIF,uGzC6pBF,CwC/xBI,mBCkIF,uGzCiqBF,CwCnyBI,mBCkIF,uGzCqqBF,CwCvyBI,mBCkIF,uGzCyqBF,CwC3yBI,mBCkIF,wGzC6qBF,CwC/yBI,mBCkIF,wGzCirBF,CwCnzBI,mBCkIF,wGzCqrBF,CwCvzBI,mBCkIF,wGzCyrBF,CwC3zBI,mBCkIF,yGzC6rBF,CwC/zBI,mBCkIF,yGzCisBF,CwCn0BI,mBCkIF,yGzCqsBF,CwCv0BI,mBCkIF,yGzCysBF,CwC30BI,mBCkIF,yGzC6sBF,CwCx0BI,yBACE,YxC20BN,C0Cr2BE,wBAEE,gBACA,qB1Cu2BJ,CyC3sBE,sDAXA,iGzCytBF,C0Cn2BI,8EACE,e1Cq2BN,C0Cn2BM,wGACE,qB1Cq2BR,CDxxBE,mBACE,WACA,kBC2xBJ,CkC51BI,6CnCoEE,kBACA,eC2xBN,CDtxBI,qCACE,mBACA,UCyxBN,CDpxBI,mCACE,WACA,kBCuxBN,CDnxBE,WACE,iBCsxBJ,CDlxBI,qCACE,YCqxBN,CDhxBI,uCAWI,mBAMF,qBCowBN,CDhwBE,mBACE,kBACA,kBACA,qBACA,kBACA,qCACA,oBACA,gBACA,mBACA,uBACA,mBCmwBJ,CDhwBE,mFAEE,eCmwBJ,CD9vBE,oCAEE,cCgwBJ,CD/5BE,oCACE,UANS,CAOT,WAPS,CAQT,gBCk6BJ,CD95BI,oDACE,QCg6BN,CD35BI,oDACE,WC65BN,CDx5BI,qDACE,UC05BN,CDr5BI,+DACE,UACA,WCu5BN,CDl5BI,oDACE,WCo5BN,CD/4BI,8DACE,WACA,UCi5BN,CD34BM,uEACE,SC64BR,CDx4BM,iFACE,UACA,UC04BR,CDr4BM,sEACE,UCu4BR,CDl4BM,gFACE,WACA,SCo4BR,CDv8BE,qCACE,UAPW,CAQX,WARW,CASX,gBC08BJ,CDt8BI,qDACE,SCw8BN,CDn8BI,qDACE,YCq8BN,CDh8BI,sDACE,UCk8BN,CD77BI,gEACE,UACA,WC+7BN,CD17BI,qDACE,WC47BN,CDv7BI,+DACE,WACA,UCy7BN,CDn7BM,wEACE,UCq7BR,CDh7BM,kFACE,UACA,WCk7BR,CD76BM,uEACE,WC+6BR,CD16BM,iFACE,WACA,UC46BR,CD/+BE,oCACE,UALS,CAMT,WANS,CAOT,gBCk/BJ,CD9+BI,oDACE,SCg/BN,CD3+BI,oDACE,YC6+BN,CDx+BI,qDACE,UC0+BN,CDr+BI,+DACE,UACA,WCu+BN,CDl+BI,oDACE,WCo+BN,CD/9BI,8DACE,WACA,UCi+BN,CD39BM,uEACE,UC69BR,CDx9BM,iFACE,UACA,WC09BR,CDr9BM,sEACE,WCu9BR,CDl9BM,gFACE,WACA,UCo9BR,CG/hCE,4BsCkJA,yGtChJE,gBACA,qBHkiCJ,CIh9BE,iDAKE,cACA,sBJ+8BJ,CI/+BE,qFACE,aJi/BJ,CI/+BE,kFACE,aJi/BJ,CI/+BE,4EACE,aJi/BJ,CI7+BI,glBAEE,qBJ8+BN,CIjjCE,mKACE,wBJmjCJ,CIhjCE,gKACE,wBJkjCJ,CI/iCE,0JACE,wBJijCJ,CI9iCE,2LACE,4BJgjCJ,CI/9BI,6GACE,UAxGY,CAyGZ,6BJi+BN,CI79BE,0BACE,eJg+BJ,CI39BE,8CACE,4BJ89BJ,CI39BE,2DAEE,sBACA,qBJ69BJ,CIlhCE,iTACE,UJ0hCJ,CIthCI,4vBAEE,qBJuhCN,CIpiCE,2GACE,wBJsiCJ,CIpiCE,uGACE,wBJsiCJ,CIpiCE,+FACE,wBJsiCJ,CIliCI,4vBAEE,gCJmiCN,CI7jCE,iiBAnBA,mCJylCF,CyCv9BE,iGAXA,iFzCs+BF,CyC39BE,iDAXA,gGzC0+BF,CyC/9BE,kFAXA,sGzC6+BF,CyCl+BE,qEAXA,iFzCg/BF,CyCr+BE,mFAXA,kGzCo/BF,CyCz+BE,qJAXA,uGzCu/BF,CyC5+BE,2HAXA,iFzC0/BF,C2CzoCE,uDF+IA,gGzC+/BF,C2CzoCE,iHAEE,e3C4oCJ,C2CzoCE,mBACE,qB3C4oCJ,C2C1oCI,oDACE,gC3C4oCN,C2CxoCE,uCACE,sBACA,e3C2oCJ,C2CzoCI,wEACE,qB3C2oCN,C2CvoCE,mFACE,qC3C0oCJ,C2CvoCE,6FACE,iBACA,sC3C0oCJ,C2CtoCI,8GACE,iBACA,kBACA,oC3CyoCN,C2CroCE,2BACE,yBACA,qB3CwoCJ,C2CtoCI,iEACE,qB3CwoCN,C2CpoCE,4BACE,sBACA,qB3CuoCJ,C2CroCI,kEACE,e3CuoCN,C2CpoCI,sDACE,wB3CsoCN,C2CloCE,iHAEE,gC3CqoCJ,C2CnnCI,wEACE,gB3CsnCN,CK/sCE,UAEE,gBACA,qBLitCJ,CyCxjCE,wCAXA,gGzCskCF,CyC3jCE,sDAXA,iFzCykCF,CK/sCE,mBACE,qBLktCJ,CMhtCE,oBACE,4BNmtCJ,CMhtCE,wBACE,YNmtCJ,CMhtCE,6BAGE,wBNitCJ,CM9sCE,wBACE,wBNitCJ,CM7sCI,4HACE,wBNgtCN,CM7sCI,0HACE,wBN+sCN,CM5sCI,sHACE,wBN8sCN,CMvsCM,gJACE,wBN0sCR,CMrsCM,sEACE,oBNusCR,CMnsCI,2CACE,qBNqsCN,CM/rCE,kCACE,qBNksCJ,CM7rCI,mKACE,kBNisCN,CM9rCI,iKACE,kBNisCN,CM9rCI,6JACE,kBNisCN,COzuCE,4BA5CA,wBAyCwB,CAxCxB,qBPyxCF,COvxCE,6CACE,qBAsCsB,CArCtB,UPyxCJ,CO9uCM,2DkCmGJ,gGzC8oCF,CO7uCM,2EACE,WP+uCR,CO3uCI,8CACE,UP6uCN,CO1uCI,kCACE,eP4uCN,COvuCI,0DAnEF,wBAyBE,CAxBF,UP8yCF,CO5yCE,2EACE,UAoBsB,CAnBtB,UP8yCJ,COxxCE,8EAVA,mCPqyCF,CO/uCI,uDAvEF,wBAyBE,CAxBF,UPyzCF,COvzCE,wEACE,UAoBsB,CAnBtB,UPyzCJ,COnyCE,2EAVA,mCPgzCF,COtvCI,yDA3EF,wBAyBE,CAxBF,UPo0CF,COl0CE,0EACE,UAoBsB,CAnBtB,UPo0CJ,CO9yCE,6EAVA,mCP2zCF,CQ50CE,WACE,eR+0CJ,CQ50CE,uJAIE,kBR+0CJ,CQ50CE,wFAEE,mCR+0CJ,CQ50CE,iBACE,qBR+0CJ,CQ50CE,2BACE,qBR+0CJ,CS1yCE,oBACE,gCT6yCJ,CSxyCE,+HAGE,qBT2yCJ,CSxyCE,2BACE,qBT2yCJ,CSxyCE,yCACE,0BT2yCJ,CSxyCE,yBACE,qBT2yCJ,CSxyCE,gEAEE,sBACA,wBT2yCJ,CSlyCE,mMACE,qBTyyCJ,CStyCE,8BAOI,qBTmyCN,CS71CE,uGAqEI,4BT4xCN,CSj2CE,mIA8EM,4BTuxCR,CSrsCE,mCACE,8BTwsCJ,CSrsCE,sFAEE,6BTwsCJ,CSrsCE,4GAEE,8ETwsCJ,CSrsCE,4GAEE,+ETwsCJ,CSrsCE,4IAEE,kBTwsCJ,CSrsCE,sIAEE,kBTwsCJ,CSt6CE,4BACE,yBACA,UTy6CJ,CSt6CE,wDAII,oCTs6CN,CS75CE,oDACE,+BTg6CJ,CS/4CE,weARM,oCT65CR,CSzzCE,wBgCQA,kGhCNE,sBACA,qBT4zCJ,CS3vCE,sEACE,6BT6vCJ,CS1vCE,4JAEE,6BT4vCJ,CSzvCE,kLAEE,6ET2vCJ,CSxvCE,kLAEE,8ET0vCJ,CSvvCE,kNAEE,kBTyvCJ,CStvCE,4MAEE,kBTwvCJ,CSt9CE,+DACE,yBACA,UTw9CJ,CSr9CE,2FAII,mCTo9CN,CS38CE,uFACE,+BT68CJ,CS57CE,ilBARM,mCTy8CR,CSjyCE,oEACE,6BTmyCJ,CShyCE,wJAEE,6BTkyCJ,CS/xCE,8KAEE,6ETiyCJ,CS9xCE,8KAEE,8ETgyCJ,CS7xCE,8MAEE,kBT+xCJ,CS5xCE,wMAEE,kBT8xCJ,CS5/CE,6DACE,yBACA,UT8/CJ,CS3/CE,yFAII,mCT0/CN,CSj/CE,qFACE,+BTm/CJ,CSl+CE,2kBARM,mCT++CR,CS73CE,8BgCNA,yGzCu4CF,CS73CE,8BACE,aTg4CJ,CS93CI,yCACE,aTg4CN,CS73CI,uCACE,aT+3CN,CS33CE,sCACE,qBT83CJ,CUtiDE,sB+BiJA,0G/B/IE,gBACA,qBVyiDJ,C4CjjDE,aACE,gC5CojDJ,C4CjjDE,sBACE,kC5CojDJ,CWljDE,qBAEE,gBACA,qBXojDJ,CyC75CE,mDAXA,gGzC26CF,CWpjDE,gBACE,gCXujDJ,C6CvkDM,mSlCoBF,0BXujDJ,CWljDE,oBACE,oGAEE,eXojDJ,CACF,CWjjDE,kCACE,qBXmjDJ,CWhjDE,uEAEE,qBXmjDJ,CWhjDE,gDACE,qBXmjDJ,CWjjDI,0KAEE,aXmjDN,CWthDI,4BACE,WXyhDN,CWvhDM,yCACE,WXyhDR,CYxkDE,gCACE,oBZ+kDJ,CY5kDE,kDACE,aZ+kDJ,CY7kDI,6DACE,aZ+kDN,CY5kDI,2DACE,aZ8kDN,CY1kDE,6CACE,aZ6kDJ,CY1kDE,uBACE,gCZ6kDJ,CYzkDI,mDACE,wBZ4kDN,CY1kDM,8DACE,wBZ4kDR,CYzkDM,4DACE,wBZ2kDR,CYrkDI,4GACE,aZwkDN,CYrkDI,uHACE,aZukDN,CYxjDM,uVAEE,aZikDR,CY7jDI,uIAEE,wBZ+jDN,CY3jDE,WACE,aZ8jDJ,CappDI,oGACE,qBb0pDN,CavpDI,4DACE,gCbypDN,CatpDI,oFiCxBF,4FACA,yBACA,0B9CirDF,C+C3qDI,8DACE,gC/C8qDN,C+C3qDI,sFDZF,4FACA,yBACA,0B9C0rDF,Cc7qDI,qDACE,gCdgrDN,Cc7qDI,6EACE,gCd+qDN,Cc5qDI,iEACE,gCd8qDN,Cc1qDM,8EACE,qBd4qDR,CczqDM,yFACE,4Bd2qDR,CevrDI,2DACE,qBf0rDN,CevrDI,iEACE,qBfyrDN,CerrDM,6EACE,afurDR,CeprDM,wFACE,afsrDR,Ce5qDM,qMACE,afirDR,Ce5qDM,iFACE,qBf8qDR,Ce3qDM,mFACE,qBf6qDR,CgDhuDI,sBACE,ahDmuDN,CgDhuDI,qBACE,ahDkuDN,CgD/tDI,mBACE,ahDiuDN,CkBtuDE,mEACE,qBlByuDJ,CkBtuDE,uHAEE,qBlByuDJ,CkBtuDE,mBACE,mBlByuDJ,CiD1vDE,gC/BoBI,qBlByuDN,CiDzvDE,qC/BgBI,qBlB4uDN,CiDxvDE,8C/BYI,qBlB+uDN,CiDvvDE,yC/BQI,qBlBkvDN,CkB/tDE,8CACE,mBlBkuDJ,CkB/tDE,uFAEE,mBlBkuDJ,CkB/tDE,0FACE,alBkuDJ,C4B3wDI,8DACE,qB5BixDN,C4B9wDI,8BACE,qB5BgxDN,C4B5wDE,wBACE,qB5B+wDJ,C4BzwDI,gMACE,0B5BgxDN,C4B3wDI,+GACE,0B5B8wDN,CmB1yDE,gBAEE,enB4yDJ,CyClpDE,8CAXA,iGzCgqDF,CmB5yDE,eACE,uBACA,qBnB+yDJ,CmB5yDM,oGAGE,qBnB6yDR,CmBxyDE,uEAEE,qBnB2yDJ,CmBpyDI,uLACE,0BnB0yDN,CoBt0DE,eACE,epBy0DJ,CoBt0DE,4DAEE,qBpBy0DJ,CoBt0DE,kDAEE,qCACA,sCpBy0DJ,CoBt0DE,yCAEE,oCpBy0DJ,CoBr0DI,uMAIE,4BpBw0DN,CoBjzDI,yBACE,epBozDN,CkD11DE,6BACE,YlD61DJ,CkD11DE,yBACE,wBlD61DJ,CkD11DE,6BACE,wBlD61DJ,CkDz1DI,0DACE,YlD41DN,CkDz1DI,sDACE,wBlD21DN,CkDx1DI,0DACE,wBlD01DN,CkDr1DI,wDACE,YlDw1DN,CkDr1DI,oDACE,wBlDu1DN,CkDp1DI,wDACE,wBlDs1DN,CmDv4DI,iDACE,cnD04DN,CmDv4DI,uEACE,cnDy4DN,CmDt4DI,mEACE,cnDw4DN,CoDj4DE,wBACE,4BpDo4DJ,CoDz5DE,wEACE,oBpD45DJ,CoDz5DE,2SAIE,wBpDy5DJ,CoDj6DE,uEACE,oBpDm6DJ,CoDh6DE,uSAIE,wBpDg6DJ,CoDx6DE,qEACE,oBpD06DJ,CoDv6DE,+RAIE,wBpDu6DJ,CoDt4DM,4IAEE,4BpDw4DR,CoDr4DM,wIAEE,gCpDu4DR,CoDp4DM,8DACE,qBpDs4DR,CoDh4DI,sCACE,qBpDk4DN,CqBn7DE,kBACE,qBrBs7DJ,CqBn7DE,wBACE,qBrBs7DJ,CqBn7DE,uCACE,qBrBs7DJ,CqBn7DE,kBACE,qBrBs7DJ,CqBn7DE,kBACE,erBs7DJ,CyC/yDE,gDAXA,iGzC6zDF,CqBt7DI,qEACE,0BrBw7DN,CqBl7DM,0DACE,arBq7DR,CqBl7DM,yDACE,arBo7DR,CqB56DI,wHACE,arBi7DN,CqB96DI,kEACE,qBrBg7DN,CqD19DE,sBACE,wBALmC,CAMnC,qBrD69DJ,CqD19DE,YAEE,qBrD69DJ,CqD39DI,wCAHA,qBrDi+DJ,CqD19DI,kCZ6HF,wGzCg2DF,CqDt9DE,iBACE,sCrDy9DJ,CqDj9DE,2DACE,qCAhCmB,CAiCnB,iBrDw9DJ,CqDt9DI,0CACE,iBACA,sCrDw9DN,CqDp9DE,sCAQI,+BrDg9DN,CuBzgEI,sDACE,wBvB4gEN,CuBzgEI,oDAGE,oCvBygEN,CuBtgEI,kDAGE,wBvBsgEN,CuBnhEI,kEACE,wBvBqhEN,CuBlhEI,gEAGE,qCvBkhEN,CuB/gEI,8DAGE,wBvB+gEN,CuB5hEI,+DACE,wBvB8hEN,CuB3hEI,6DAGE,oCvB2hEN,CuBxhEI,2DAGE,wBvBwhEN,CuBn/DI,wDAGE,qBvBm/DN,CuB/+DE,wBkB2FA,iGlBzFE,wBvBk/DJ,CuB/+DE,sBACE,gCvBk/DJ,CsBxgEE,6BACE,gCtB2gEJ,CsBvjEE,wGAGE,wBtB0jEJ,CsBvjEE,0CACE,UtByjEJ,CsBtjEE,oCAGE,oCtBsjEJ,CsBnkEE,qGAGE,wBtBskEJ,CsBnkEE,yCACE,UtBqkEJ,CsBlkEE,mCAGE,mCtBkkEJ,CsB/kEE,+FAGE,wBtBklEJ,CsB/kEE,uCACE,UtBilEJ,CsB9kEE,iCAGE,mCtB8kEJ,CsB9hEI,yFACE,gCtBkiEN,CsBthEM,6LACE,gCtB8hER,CsBxhEI,6CAGE,gCtByhEN,CsB/gEM,oJAEE,gCtBihER,CsB7gEQ,4KAEE,gCtB+gEV,CsBzgEM,6EACE,4BA9EiB,CA+EjB,4BtB2gER,CsBtgEQ,4KACE,4BtBwgEV,CsBrgEQ,oNACE,4BtBugEV,CsBjgEE,gDACE,2BtBogEJ,CsB3/DE,yCACE,8GAIA,qHtB2/DJ,CsBj/DE,uCACE,8GtBo/DJ,CwBnoEI,kGAGE,gCxBooEN,CwB9nEI,oBACE,uBACE,exBgoEN,CACF,CwB7nEI,qEAIE,qBxB6nEN,CwB1nEI,gCAGE,iCACA,UxB0nEN,CwBvnEI,+HAGE,yBACA,UxBynEN,CwBrnEM,2CACE,UxBunER,CwBpnEM,gKAGE,yBACA,UxBsnER,CwBjnEM,yCACE,UxBmnER,CwBhnEM,0JAGE,yBACA,UxBknER,CwB9mEI,4CACE,6BACA,axBgnEN,CwB7mEI,uDACE,qBxB+mEN,CwB5mEI,sDACE,axB8mEN,CwB1mEE,8CACE,qBxB6mEJ,CwB1mEE,kCACE,iCxB6mEJ,CwB1mEE,wGAGE,gCxB6mEJ,CwBpkEI,+BACE,WxBukEN,CwBpkEI,+FAEE,YxBukEN,CwBlkEI,kCACE,UACA,YxBqkEN,CwB1jEI,iNACE,QxBikEN,CsDhuEE,uBAYI,atDwtEN,CyBhuEE,iCAEE,uCzBmuEJ,CyB/tEI,+FAEE,oCAVY,CAWZ,kBzBkuEN,CyB9tEE,6BACE,qBzBiuEJ,CyB/tEI,+DACE,qBzBiuEN,CyB7tEE,mCACE,4BzBguEJ,CyB7tEE,uEACE,4BzBguEJ,CyB5tEE,gGAEE,mBACA,ezB+tEJ,CyBjrEM,grBACE,oCzBwrER,CyBnsEE,kFACE,wBzBqsEJ,CyBtsEE,gVACE,qBzBwsEJ,CyB/rEM,wqBACE,mCzBqsER,CyBhtEE,gFACE,wBzBktEJ,CyBntEE,wUACE,qBzBqtEJ,CyB5sEM,wpBACE,qCzBktER,CyB7tEE,4EACE,wBzB+tEJ,CyBhuEE,wTACE,qBzBkuEJ,CyBztEM,wwBACE,oCzB+tER,CyBptEE,gXACE,wBzBstEJ,CyBltEE,sSACE,UzBotEJ,CyBltEI,0WACE,wBzBotEN,CyB/sEE,0tBAIE,iBzBotEJ,CyBjtEE,wdAEE,+BzBotEJ,CyB/sEE,weAGE,oCzBmtEJ,CyB9vEM,gwBACE,mCzBowER,CyBzvEE,0WACE,wBzB2vEJ,CyBvvEE,kSACE,UzByvEJ,CyBvvEI,sWACE,wBzByvEN,CyBpvEE,ktBAIE,iBzByvEJ,CyBtvEE,odAEE,+BzByvEJ,CyBpvEE,keAGE,oCzBwvEJ,CyBnyEM,gvBACE,qCzByyER,CyB9xEE,8VACE,wBzBgyEJ,CyB5xEE,0RACE,UzB8xEJ,CyB5xEI,8VACE,wBzB8xEN,CyBzxEE,ksBAIE,iBzB8xEJ,CyB3xEE,4cAEE,+BzB8xEJ,CyBzxEE,sdAGE,oCzB6xEJ,C0Bn3EE,aACE,mBACA,qB1Bs3EJ,C0Bp3EI,yBApCF,mBACA,U1B25EF,C0Bp3EI,wBAxCF,mBACA,U1B+5EF,C0Bp3EI,sBA5CF,mBACA,U1Bm6EF,C0B/5EE,4HAGE,6B1Bi6EJ,C0B95EE,4MAKE,a1Bg6EJ,C0B75EE,gCACE,wB1B+5EJ,C0B57EE,2BACE,e1B+7EJ,C0B77EE,yCACE,W1Bg8EJ,C0B12EI,yBA1FF,2BACE,e1Bw8EF,C0Bt8EA,yCACE,W1By8EF,CACF,C2Br8EE,aACE,4B3Bu8EJ,CgC98EE,UACE,ehCi9EJ,CgC98EE,qCAEE,qBhCi9EJ,CgCz7EI,eACE,ehC47EN,C+B39EE,yBAGE,yBACA,mBU6IF,kGzCg1EF,C+Bx9EE,4BACE,a/B29EJ,CuDj/EA,KACE,evDu/EF,CuDp/EA,KACE,+FCJU,CDKV,SACA,UCoBS,CCzBT,eACA,iBFMA,mCACA,iCvDw/EF,CuDr/EA,kBACE,UCcS,CDbT,gBACA,evDw/EF,CuDr/EA,GEjBE,eACA,eFkBA,qBACA,evDy/EF,CuDv/EE,oCALF,GAMI,YvD0/EF,CACF,CuDv/EA,GACE,6BACA,WE7BA,eACA,iBF8BA,gBACA,gBvD2/EF,CyDt2Ea,qIFlJT,aACA,gBACA,avD2/EJ,CuDv/EA,GEzCE,eACA,gBzDsiFF,CuDx/EA,MAJE,gBACA,UvDkgFF,CuD//EA,GE/CE,eACA,czD6iFF,CuDz/EA,GErDE,eACA,gBzDojFF,CuD1/EA,MAJE,gBACA,UvDqgFF,CuDlgFA,GE3DE,eACA,iBF4DA,avDggFF,CuDt/EE,yBACE,iBvD6/EJ,CuD1/EE,oCATF,eAUI,YvDigFF,CACF,CuD9/EA,yBACE,YvDigFF,CuD9/EA,mBEpFE,eACA,iBASA,iBACA,mBFiFA,oBACA,gBACA,UvDmgFF,CuDjgFE,qCE3FA,oBACA,qBzDomFF,CuDrgFA,EACE,YvDwgFF,CuDrgFA,KACE,cvDwgFF,CuDpgFE,WAEE,YvDugFJ,CuDngFA,MACE,2BvDsgFF,CuDpgFE,SACE,2BvDsgFJ,CuDlgFA,GACE,mBEnHA,iBACA,kBzDynFF,CuDpgFE,KACE,QvDsgFJ,CuDlgFA,EACE,oBvDqgFF,CuDlgFA,eEzIE,eACA,iBF0IA,gBACA,UC7HM,CD8HN,+FC9IU,CD+IV,wBvDsgFF,CuDngFA,OACE,evDsgFF,CuDngFA,MACE,yBAEA,iBACA,kBvDsgFF,CuDngFA,eACE,gBACA,kBACA,evDsgFF,CuDngFA,GACE,gBACA,gBvDsgFF,CuDlgFI,mCACE,YvDqgFN,CuDngFI,iCACE,evDsgFN,CuDjgFA,GEjLE,eACA,iBFkLA,gBACA,kBACA,evDqgFF,CuDlgFA,KACE,iCCzLU,CD0LV,cACA,UvDqgFF,CuDlgFA,mBACE,avDqgFF,CuDngFE,yBACE,yBvDqgFJ,CuDv/EQ,i6BAEE,oBACA,iCACA,iBvDy/EV,CuDv/EU,q/BACE,sBACA,2BACA,kBACA,OvDy/EZ,CuDj/EA,YACE,avDo/EF,C0DztFA,mBACE,WACA,Y1D+tFF,C0D5tFA,iBACE,cAEA,iBACA,uBACA,eACA,a1D8tFF,C0D5tFE,oCARF,iBASI,iBACA,sB1D+tFF,CACF,C0D7tFE,oCAbF,iBAcI,sB1DguFF,CACF,CyD7jFa,mUC9JT,c1D8tFJ,C0D3tFE,wBACE,c1D8tFJ,C0DztFE,yBADF,SAEI,Y1D6tFF,CACF,C2DjwFA,gCAEE,yB3DmwFF,C4DrwFA,OHYE,iBACA,mBGVA,OACA,aAEA,wBJMK,CILL,e5DywFF,C4DvwFE,yBARA,kBAIA,S5D+wFF,C4DvwFI,oBACE,UJGE,CIFF,c5DywFN,C4DtwFI,gCACE,cACA,kB5DwwFN,C4DrwFI,oBACE,UJPE,CIQF,qBACA,WACA,iB5DuwFN,C4DrwFM,0BACE,yB5DuwFR,C4DpwFM,4BACE,oB5DswFR,C4DnwFM,0BAEE,qCACA,kB5DowFR,C4DhwFI,qBH1CF,eACA,iBG2CI,yBACA,gBACA,kBACA,U5DmwFN,C4DjwFM,yBAPF,qBH1CF,eACA,gBzDszFA,CACF,C4DlwFI,oBACE,kBACA,oB5DowFN,C4DlwFM,yBAJF,oBAKI,e5DqwFN,CACF,C4DlwFI,iCAGE,aACA,uBACA,gBACA,kB5DowFN,C4DlwFM,oCACE,2BACA,UACA,Q5DowFR,C4DlwFQ,uCACE,qBACA,cACA,e5DowFV,C4DhwFM,yBApBF,iCAqBI,qB5DmwFN,C4DjwFM,+CACE,e5DmwFR,CACF,C4D9vFE,aACE,WACA,kBACA,WACA,MACA,SACA,OACA,QACA,8MAIA,YACA,0B5D6vFJ,C6Dz2FA,UACE,W7D42FF,C6Dz2FA,cAEE,qB7D42FF,C6Dz2FA,eACE,cACA,gB7D42FF,C6Dz2FA,oBACE,cACA,c7D42FF,C6Dz2FA,0BACE,a7D42FF,C6Dz2FA,OACE,U7D42FF,C6Dz2FA,aACE,aACA,c7D42FF,C6Dz2FA,aACE,aACA,sB7D42FF,C6Dz2FA,QACE,iB7D42FF,C6Dz2FA,iBACE,4BACA,sBACA,sB7D42FF,C8Dx5FA,MACE,aACA,sBACA,uBACA,mBACA,kBACA,WACA,iBACA,YACA,iBACA,sBACA,uBACA,gBACA,sBACA,qB9D25FF,C8Dz5FE,yBAhBF,MAiBI,iBACA,iBACA,c9D45FF,CACF,C8D15FE,kBACE,qBLrBF,eACA,iBKsBE,gBLbF,iBACA,mBKcE,iBACA,wB9D85FJ,C8D55FI,mCACE,mB9D85FN,C8Dz5FA,cACE,aACA,mBACA,kBACA,YACA,aACA,oBACA,iBACA,U9D45FF,C8D15FE,yBAVF,cAWI,sBACA,uBACA,WACA,gBACA,mB9D65FF,C8D35FE,qBACE,SACA,W9D65FJ,CACF,C8D15FE,kCACE,WACA,iBAEA,kBACA,cACA,gB9D45FJ,C8D15FI,yBARF,kCASI,aACA,sBACA,mBACA,WACA,eACA,S9D65FJ,CACF,C8D15FE,6BL3EA,eACA,eASA,iBACA,mBKmEE,gBACA,a9D85FJ,C8D55FI,mCACE,Y9D85FN,C8D35FI,yBAVF,6BAWI,iB9D85FJ,CACF,C8D55FI,yBAdF,6BL3EA,eACA,iBASA,iBACA,gBzDi/FA,CACF,C8D95FE,yBACE,Y9Dg6FJ,C8D95FI,yBAHF,yBAII,sB9Di6FJ,CACF,C8D/5FI,6BACE,YACA,aACA,kBACA,eACA,UACA,gD9Di6FN,C8D/5FM,yBARF,6BASI,YACA,Y9Dk6FN,CACF,C8D75FA,kBACE,aACA,mBACA,eACA,6BACA,mBACA,eACA,cACA,aACA,qBNhHM,CMiHN,kBACA,mEACA,sBACA,0B9Dg6FF,C8D95FE,yBAfF,kBAgBI,sBACA,kBACA,iB9Di6FF,CACF,C8D/5FE,yBArBF,kBAsBI,WACA,c9Dk6FF,CACF,C8Dh6FE,oBACE,U9Dk6FJ,C8D/5FE,0BACE,aACA,uBACA,mBACA,YACA,gBLzJF,eACA,iBK0JE,UN5II,CM6IJ,wBNlJG,CMmJH,mBACA,uCACA,sBACA,c9Dk6FJ,C8Dh6FI,gCACE,wB9Dk6FN,C8D95FE,kCACE,aACA,QACA,gBACA,2BL3KF,eACA,gBzD4kGF,C8D95FE,oBL/KA,eACA,iBKgLE,WACA,iB9Di6FJ,C8D55FA,gBACE,wBN9KK,CM+KL,kDN1Ha,CM2Hb,U9D+5FF,C8D55FA,gBLjJE,UKkJc,CLjJd,UKiJmB,CLhJnB,qBD/BM,CCgCN,kBACA,mEACA,sBACA,0BK6IA,aACA,mBACA,mBACA,kBACA,UACA,gBACA,YACA,YACA,aACA,mE9Dq6FF,CyDzjGE,sBACE,mEACA,oBzD2jGJ,C8Dv6FE,yBAbF,gBAcI,kB9D06FF,C8Dx6FE,mBACE,Q9D06FJ,C8Dv6FE,oBACE,eACA,W9Dy6FJ,CACF,C8Dt6FE,0BACE,oBACE,YACA,c9Dw6FJ,CACF,C8Dr6FE,oBACE,W9Du6FJ,C8Dp6FE,qCACE,a9Ds6FJ,C8Dp6FI,uCACE,gBACA,UN9MK,CM+ML,SACA,a9Ds6FN,C8Dh6FI,yBACE,a9Dk6FN,C8D75FA,iBACE,mBLtPA,eACA,iBKuPA,gBL9OA,iBACA,iBK+OA,qBN3OM,CM4ON,mBACA,uCACA,sBACA,c9Dk6FF,C8Dh6FE,uBACE,U9Dk6FJ,C8D75FE,0NACE,gB9Dg6FJ,C8D75FE,2JACE,Y9D+5FJ,C8D75FI,yBAHF,2JAII,c9Dg6FJ,CACF,C8D35FE,4BACE,gB9D85FJ,C8Dz5FE,0BACE,gBACA,e9D45FJ,C8Dz5FE,mBACE,a9D25FJ,C8Dv5FA,eLpSE,eACA,eKqSA,gBACA,aN7RK,CM8RL,gBACA,wB9D25FF,C8Dv5FE,qEACE,c9D05FJ,C8Dt5FA,gBACI,aACA,uBACA,mBACA,qB9Dy5FJ,C8Dv5FI,yBANJ,gBAOM,a9D05FJ,CACF,C8Dv5FA,YACI,kB9D05FJ,C8Dv5FA,WACI,e9D05FJ,C8Dz5FI,yBAFJ,WAGM,Q9D45FJ,CACF,C8Dz5FA,4BACI,qBACA,8B9D45FJ,C8Dz5FA,UACE,gBACA,gB9D45FF,C8D15FE,yDACE,a9D45FJ,C8D15FI,yBAHF,yDAII,eACA,iB9D65FJ,C8D35FI,qFACE,6B9D65FN,CACF,C8Dz5FE,sBACE,iB9D25FJ,C8Dz5FI,yBAHF,sBAII,S9D45FJ,CACF,C8Dx5FI,iCACE,a9D05FN,C8Dv5FI,mCACE,uB9Dy5FN,C8Dp5FA,kBACE,yBACA,gBACA,Y9Du5FF,C8Dr5FE,yBALF,kBAMI,gBACA,Y9Dw5FF,CACF,C8Dt5FE,mCACE,yBL5XF,eACA,iBK6XE,gBACA,UNhXI,CMiXJ,SACA,wBACA,sB9Dy5FJ,C8Dv5FI,yBATF,mCL3XA,eACA,iBKqYI,e9D25FJ,CACF,C8Dz5FI,yCACE,Y9D25FN,C8Dv5FE,iCACE,kB9Dy5FJ,C+D1yGA,cACI,mBACA,Y/D6yGJ,C+D1yGA,aACI,YACA,YACA,qB/D6yGJ,C+D3yGI,gBNRF,eACA,iBMSI,cACE,yBACA,Y/D8yGR,C+D1yGA,wBACI,aPPG,CCVL,gBACA,gBMkBE,e/D8yGJ,CgEl0GA,oDACE,ehEq0GF,CgEl0GA,wCACE,qBRWM,CQVN,gBACA,sBACA,eACA,SACA,chEq0GF,CgEn0GE,yDACE,ahEq0GJ,CgEl0GE,yDACE,WhEo0GJ,CgEj0GE,4DACE,eACA,SACA,SACA,OACA,gBACA,wBRLa,CQMb,8BhEm0GJ,CgEj0GI,yBATF,4DAUI,QhEo0GJ,CACF,CgEj0GI,yEACE,YACA,4BhEm0GN,CgE9zGA,aACE,cACA,cACA,ehEi0GF,CgE/zGE,2BACE,ehEi0GJ,CgE9zGE,0BACE,kBhEg0GJ,CgE7zGE,+BACE,QhE+zGJ,CgE3zGI,8CACE,sBACA,URnCK,CQoCL,eACA,aACA,mBACA,8BACA,yBACA,YACA,qBACA,gBACA,WACA,oBhE6zGN,CgE3zGM,oDACE,wBRpDI,CQqDJ,aRhED,CQiEC,wBhE6zGR,CgE1zGM,oDACE,wBhE4zGR,CgEzzGM,uDACE,ahE2zGR,CgExzGM,mDACE,kBhE0zGR,CgEtzGM,wDACE,YACA,UhEwzGR,CgEpzGI,oDACE,YACA,6BACA,SACA,UhEszGN,CgElzGM,qDACE,mBACA,UACA,eACA,kBACA,qDACA,sChEozGR,CgEjzGM,sDACE,gBACA,kBACA,eACA,UACA,eACA,0DACA,mChEmzGR,CgEhzGM,yIAEE,yBhEizGR,CgE7yGI,mCPlIF,eACA,iBASA,iBACA,mBO0HI,gBACA,kBACA,SACA,+BhEizGN,CgE9yGI,mCAGE,gBAEA,iBhEkzGN,CgE/yGI,sEPnJF,eACA,iBASA,iBACA,mBOoII,QhE2zGN,CgEvzGI,mCAIE,iBhEmzGN,CgEhzGI,mCP1JF,eACA,iBASA,iBACA,mBOkJI,SACA,iBhEozGN,CgEhzGM,qKPrIJ,uBACA,0BACA,sCzD47GF,CgErzGM,kKPzIJ,wBACA,0BACA,sCzDq8GF,CiE/9GA,wBACE,eACA,MACA,QACA,OACA,WACA,qCjEk+GF,CiE/9GE,mCACE,wBjEi+GJ,CiE/9GI,yBACE,uDACE,6BACA,gBACA,kBACA,sCjEi+GN,CACF,CiE39GI,0BACE,sVAEE,gBjE49GN,CACF,CiEx9GE,wCACE,kBjE29GJ,CiEx9GE,iCACE,UjE09GJ,CiEt9GE,mCACE,YACA,gBA/CmB,CAgDnB,SjEw9GJ,CiEt9GI,0BALF,mCAQI,qBjEu9GJ,CACF,CiEr9GI,yBAXF,mCAYI,ajEw9GJ,CACF,CiEt9GI,kDACE,wBACA,iCACA,qDjEw9GN,CiEr9GI,yCACE,ajEu9GN,CiEp9GI,6CACE,UTzDE,CS0DF,gBjEs9GN,CiEj9GE,uCACE,eACA,kBACA,ajEm9GJ,CiEj9GI,6CAEE,qCACA,kBjEk9GN,CiE/8GI,qCAXF,uCAYI,ajEk9GJ,CACF,CiEh9GI,oCAfF,uCAgBI,gBjEm9GJ,CACF,CiEj9GI,2CACE,kBACA,iBACA,SACA,WjEm9GN,CiEj9GM,0BACE,iDACE,oBjEm9GR,CACF,CiE78GE,qCACE,aACA,mBACA,mBACA,SjE+8GJ,CiE78GI,wCACE,aACA,mBACA,mBACA,2BACA,UACA,QjE+8GN,CiE78GM,2CACE,mBACA,qBACA,cjE+8GR,CiE78GQ,iDACE,YjE+8GV,CiE58GQ,sDACE,aACA,UACA,cjE88GV,CiE58GU,sEACE,kBACA,gBjE88GZ,CiE58GY,4EACE,8BjE88Gd,CiE18GU,4DACE,YjE48GZ,CiE18GY,4EACE,+BACA,kBACA,yCjE48Gd,CiE/7GY,4JACE,8BjEo8Gd,CiE37GE,wDACE,aACA,yBACA,mBACA,WACA,gBACA,YACA,iBjE67GJ,CiE37GI,8DACE,UTnKK,CSoKL,YACA,oBACA,qBThLE,CSiLF,iBACA,gBACA,YACA,gBACA,WACA,uBjE67GN,CiE37GM,oEACE,YjE67GR,CyDnnHE,oFAlBA,eACA,iBQ4MM,ajE67GR,CyDrnHE,gFArBA,eACA,iBQ4MM,ajE48GR,CyDpoHE,2EArBA,eACA,iBQ4MM,ajE48GR,CiEz8GM,0BArBF,8DAsBI,gCjE48GN,CiE18GM,oEACE,SjE48GR,CACF,CiEz8GM,yBA7BF,8DA8BI,WjE48GN,CACF,CiEv8GE,0DACE,aACA,mBACA,cACA,WjEy8GJ,CiEv8GI,4DACE,aACA,mBACA,aACA,cjEy8GN,CiEv8GM,kEAEE,qCACA,oBjEw8GR,CiEr8GM,oCAZF,4DAaI,iBACA,SjEw8GN,CACF,CiEt8GM,kEACE,UjEw8GR,CiEr8GM,gEACE,WjEu8GR,CkEpsHA,gBACI,aACA,cTAF,eACA,iBSCE,UVuBO,CUtBP,WACA,sBACA,UlE2sHJ,CkEzsHI,oIACE,elE2sHN,CkExsHI,wCACI,8BACA,mClE0sHR,CkExsHQ,oRACI,alE0sHZ,CkEtsHI,0CACI,8BACA,oClEwsHR,CkEtsHQ,gSACI,alEwsHZ,CkEpsHI,sCACI,8BACA,qClEssHR,CkEpsHQ,wQACI,alEssHZ,CkElsHI,gDACE,wBVzBI,CU0BJ,kBACA,kBlEosHN,CkElsHM,oDACE,UlEosHR,CkEjsHM,oDACE,UVjCA,CUkCA,gBACA,yBlEmsHR,CkEjsHQ,gEACE,UlEmsHV,CkE9rHI,oBACI,elEgsHR,CmE1vHE,yBACE,aACA,anEmwHJ,CmEjwHI,yBAJF,yBAKI,sBACA,gBnEowHJ,CACF,CmEjwHI,oCACE,WnEmwHN,CmEjwHM,oCAHF,oCAII,UnEowHN,CACF,CmEjwHI,iFAEE,UnEmwHN,CmEjwHM,oCAJF,iFAKI,anEqwHN,CACF,CmEjwHM,kEACE,anEmwHR,CmE/vHI,sCACE,kBACA,UnEiwHN,CmE/vHM,4CACE,mEACA,sBACA,sBACA,kBACA,UXlBG,CCzBT,eACA,iBASA,iBACA,mBUmCM,aACA,0BACA,mBACA,WnEmwHR,CyDlyHE,kEAlBA,eACA,iBUoDQ,anEowHV,CyDpyHE,8DArBA,eACA,iBUoDQ,anEmxHV,CyDnzHE,yDArBA,eACA,iBUoDQ,anEmxHV,CmEhxHQ,kDACE,yBACA,sEnEkxHV,CmE/wHQ,oCAvBF,4CAwBI,UnEkxHR,CACF,CmE/wHM,sDACE,aXtBQ,CC7Cd,eACA,eUoEM,SACA,oBACA,kBACA,SACA,WACA,SnEkxHR,CmE7wHI,yCACE,UnE+wHN,CmEzwHE,iCACE,aACA,sBACA,eACA,iBnE4wHJ,CmE1wHI,uGANF,iCASI,gBnE2wHJ,CACF,CmEzwHI,oCACE,gBACA,kBnE2wHN,CmEvwHI,2CACE,gBACA,qBACA,UACA,enEywHN,CmEvwHM,oCANF,2CAOI,iBnE0wHN,CACF,CmExwHM,8CVlHJ,eACA,iBUmHM,aV1GN,iBACA,mBU2GM,UACA,WACA,UACA,gBACA,gBACA,uBACA,kBnE4wHR,CmE1wHQ,gDACE,aXlFM,CCnCd,iBACA,mBUsHQ,eACA,qBACA,kBnE6wHV,CmE3wHU,sDACE,kBX/FG,CWgGH,anE6wHZ,CmE1wHU,oEACE,4BnE4wHZ,CoEz5HA,UACE,gBpE45HF,CoE15HE,aACE,epE45HJ,CoEz5HE,4BACE,epE25HJ,CoEz5HI,gDACE,aACA,mBACA,mBACA,6BpE25HN,CoEz5HM,kDACE,YpE25HR,CoEv5HI,6CACE,UACA,yBACA,kBACA,epEy5HN,CoEv5HM,sDACE,gBpEy5HR,CoEr5HI,oCACE,eACA,SpEu5HN,CoEr5HM,uCACE,SACA,UpEu5HR,CoEr5HM,6CACE,aACA,aZ9BD,CCVL,eACA,gBzDg8HF,CoEt5HM,8CACE,8BpEw5HR,CoEh5HM,sGACE,YpEq5HR,CoEn5HM,wDACE,8BpEq5HR,CoEh5HE,2BACE,gBACA,QpEk5HJ,CoE/4HE,gBACE,kBpEi5HJ,CoE94HM,8BACE,YpEg5HR,CoE34HM,8BACE,iBpE64HR,CoEz4HI,iCACE,aXlFJ,eACA,iBWmFI,epE44HN,CoEz4HQ,oCADF,oCAEI,aACA,qBpE44HR,CACF,CoE14HQ,mDACE,gBACA,kBACA,SpE44HV,CoEx4HM,oCACE,sBACA,SACA,kBpE04HR,CoEr4HM,kCACE,kBpEu4HR,CoEh4HM,6GACE,yBACA,oBpEk4HR,CoE/3HM,8IACE,mBACA,aACA,6BpEi4HR,CoE93HQ,8LACE,apEg4HV,CoE93HU,gQACE,gBACA,apEg4HZ,CoE13HM,8FACE,aACA,gBACA,UpE43HR,CoEz3HM,8FX/IJ,eACA,iBWgJM,gBACA,epE43HR,CoEx3HI,mBACE,oBXvJJ,eACA,iBWwJI,epE23HN,CoEx3HI,mBACE,+BpE03HN,CoEx3HM,8BACE,kBpE03HR,CoEt3HI,mBACE,qBpEw3HN,CoEl3HM,oCADF,8CAEI,wBpEq3HN,CACF,CoEl3HI,mBACE,apEo3HN,CoEj3HI,mCACE,apEm3HN,CoE/2HE,0BACE,iBpEi3HJ,CoE/2HI,uCACE,UpEi3HN,CoE72HE,4BACE,epE+2HJ,CoE52HE,6BACE,cpE82HJ,CoE32HE,uBXzMA,eACA,iBW0ME,WpE82HJ,CoE32HE,yFX9MA,eACA,iBWiNE,gBX7MF,oBACA,sBW8ME,kBACA,wBZhMQ,CYiMR,kBACA,epE+2HJ,CoE12HI,iEACE,SpE62HN,CoE32HM,uEACE,gBACA,kBpE82HR,CoEx2HI,uDAEE,epE02HN,CoEx2HM,2DACE,epE22HR,CoEr2HA,cACE,WpEw2HF,CoEt2HE,8BACE,kBACA,YXvPF,eACA,czDgmIF,CoEv2HI,oCACE,wBpEy2HN,CoEp2HA,sBACE,aACA,mBACA,6BpEu2HF,CoEp2HA,YACE,aACA,mBACA,epEu2HF,CoEr2HE,oCALF,YAMI,sBACA,sBpEw2HF,CACF,CoEt2HE,eXhRA,eACA,iBWiRE,QpEy2HJ,CoEr2HA,qBACE,4BpEw2HF,CqE7nIA,QACE,kBACA,wCACA,UbUM,CaTN,qBZNA,eACA,eYOA,gBZEA,iBACA,mBYDA,iBACA,kBACA,UrEooIF,CqE/nII,YACE,erEioIN,CqE/nIM,mBACE,WrEioIR,CqEroII,cACE,kBrEuoIN,CqEroIM,qBACE,WrEuoIR,CqE3oII,cACE,kBrE6oIN,CqE3oIM,qBACE,WrE6oIR,CqEjpII,kBACE,kBrEmpIN,CqEjpIM,yBACE,WrEmpIR,CqEvpII,kBACE,kBrEypIN,CqEvpIM,yBACE,WrEypIR,CqE7pII,aACE,kBrE+pIN,CqE7pIM,oBACE,WrE+pIR,CqEnqII,iBACE,kBrEqqIN,CqEnqIM,wBACE,WrEqqIR,CqEzqII,kBACE,kBrE2qIN,CqEzqIM,yBACE,WrE2qIR,CqE/qII,YACE,kBrEirIN,CqE/qIM,mBACE,WrEirIR,CqErrII,iBACE,erEurIN,CqErrIM,wBACE,WrEurIR,CqE3rII,gBACE,kBrE6rIN,CqE3rIM,uBACE,YrE6rIR,CqEjsII,aACE,kBrEmsIN,CqEjsIM,oBACE,WrEmsIR,CqEvsII,mBACE,kBrEysIN,CqEvsIM,0BACE,WrEysIR,CqE7sII,YACE,kBrE+sIN,CqE7sIM,mBACE,WrE+sIR,CsEpuIA,OACE,mBtEwuIF,CsEnuIA,4BAEE,cACA,qBbCA,iBACA,mBaAA,ebXA,eACA,iBaYA,gBACA,kBACA,qBACA,yBACA,gBACA,WtEwuIF,CsEruIE,sDbrBA,eACA,iBASA,iBACA,mBaaE,atE0uIJ,CsEvuIE,sDb3BA,eACA,iBASA,iBACA,mBamBE,ctE4uIJ,CsEzuIE,0DbjCA,eACA,iBASA,iBACA,mBayBE,ctE8uIJ,CsExuIE,8DACE,kBdnBS,CcoBT,yBtE2uIJ,CsExuIE,sDACE,edjCI,CckCJ,wBtE2uIJ,CsExuIE,wDACE,kBd7BS,Cc8BT,atE2uIJ,CsEzuII,oEACE,wBtE4uIN,CsExuIE,oDACE,kBdpDG,CcqDH,yBtE2uIJ,CsEzuII,gEACE,wBtE4uIN,CsExuIE,wDACE,ed9CO,Cc+CP,yBtE2uIJ,CsEvuIA,SACE,iBtE0uIF,CsExuIE,iBACE,aACA,uCACA,8BtE0uIJ,CsEzuII,uBACI,qBACA,atE2uIR,CsEruIA,eACE,qBtEwuIF,CsEpuIE,iDACE,qCACA,kBblGF,eACA,iBASA,iBACA,mBa0FE,WACA,eACA,WtEwuIJ,CsEtuII,iHAEE,wBdjGC,CckGD,UtEuuIN,CsEpuII,yBAfF,iDbhGA,eACA,iBagHI,UtEwuIJ,CACF,CsEpuIA,iCACE,wBtEuuIF,CuEh2IA,SAEE,UACA,2BACA,iBvEk2IF,CuEh2IE,gBACE,UfUI,CCLN,iBACA,mBcJE,gBACA,iBACA,SACA,yBACA,yBvEm2IJ,CuEh2IE,WACE,aACA,SdhBF,eACA,gBzDm3IF,CuEh2IE,4BACE,iBvEk2IJ,CuE/1IE,qBACE,oBfZQ,CeaR,6BvEi2IJ,CuE/1II,4BACE,kBvEi2IN,CuE71IE,sBACE,oBfNK,CeOL,8BvE+1IJ,CuE71II,6BACE,kBvE+1IN,CuE31IE,oBACE,oBfjCG,CekCH,+BvE61IJ,CuE31II,2BACE,kBvE61IN,CwE94IA,gBACE,aACA,mBACA,eACA,uBACA,axEi5IF,CwE/4IE,2BfuCA,YetCgB,CfuChB,SevCuB,CfwCvB,qBD/BM,CCgCN,kBACA,mEACA,sBACA,0Be3CE,gBACA,gBACA,iBACA,oBACA,iBxEu5IJ,CyD92IE,iCACE,mEACA,oBzDg3IJ,CwEz5II,oCARF,2BASI,WACA,gBACA,cxE45IJ,CACF,CwE15II,mCACE,ahBVC,CCVL,eACA,eASA,iBACA,mBeYI,SACA,oBACA,oBACA,iBxE85IN,CwE35II,6BACE,UhBLK,CCzBT,eACA,iBASA,iBACA,mBesBI,eACA,SACA,iBxE+5IN,CwE55II,wCACE,ahB5BK,CgB6BL,qCACA,SACA,8BACA,sBfjCJ,iBACA,mBekCI,OACA,kBACA,QACA,gBxE+5IN,CwE75IM,0CACE,ahB3BK,CCxBX,eACA,gBzDm9IF,CwE15IA,cfdE,Weec,Cfdd,SecoB,CfbpB,qBD/BM,CCgCN,kBACA,mEACA,sBACA,0BeUA,kBACA,cACA,aACA,mBACA,kBxEm6IF,CyD/6IE,oBACE,mEACA,qBecA,kExEm6IJ,CwEh6IE,sGAME,YxEq6IJ,CwEl6IE,2DAGE,iBxEo6IJ,CyEz/IA,UACE,ezE6/IF,CyE3/IE,eAAO,wBzE8/IT,CyE3/IA,mBACE,ezE8/IF,C0ErgJA,uBAEE,WACA,a1EwgJF,C0EtgJE,iCACE,a1EygJJ,C0EtgJE,6BACE,kB1EygJJ,C0EtgJE,2CACE,UACA,iB1EygJJ,C0EpgJE,0BACE,qCACA,0BACA,kBACA,UlBGO,CkBFP,gB1EugJJ,C0EngJI,oCACE,Q1EqgJN,C0ElgJI,yBACE,4B1EogJN,C0EhgJE,kBACE,a1EkgJJ,C0E9/IE,sDACE,qB1EggJJ,C0E7/IE,oBACE,wBlBlCS,CkBmCT,0BACA,alBhCO,CChBT,eACA,iBiBiDE,gB1EggJJ,C0E5/IA,UACE,a1E+/IF,C0E3/IM,+CACE,0B1E6/IR,C0Ez/II,wCACE,iB1E2/IN,C0Ez/IM,8DACE,YACA,c1E2/IR,C0Ez/IQ,sEACE,iE1E2/IV,C0Ep/IA,wDAEE,yBACA,kB1Eu/IF,C0Ep/IA,wGAIE,yB1Eu/IF,C0En/IE,yBACE,kBACA,aACA,gBACA,iBACA,qBACA,kB1Es/IJ,C0En/IM,gCACE,a1Eq/IR,C0El/IM,mCjBhGJ,iBACA,kBzDqlJF,C0El/IM,0CACE,SACA,a1Eo/IR,C0El/IQ,6CACE,SACA,iClBpHE,CkBqHF,cjB3GR,iBACA,kBzDgmJF,C0En/IU,qDACE,a1Eq/IZ,C0Eh/IM,4CACE,a1Ek/IR,C0E9+II,sCACE,kBACA,SACA,YACA,UACA,iBAEA,alBjGU,CkBkGV,6BACA,YACA,c1E++IN,C0Ev+IM,0IACE,a1E4+IR,C0E1+IQ,0GACE,a1E4+IV,C0En+II,wBACE,alBxJK,CkByJL,kBACA,mB1Es+IN,C0Ej+II,gFACE,qCACA,kBACA,UlBnJK,CkBoJL,a1Em+IN,C0Eh+II,uFACE,W1Ek+IN,C0E39IM,8GACE,yBACA,UACA,oB1E89IR,C0Ez9IE,8BACE,eACA,qBACA,iB1E29IJ,C0Ez9II,oCACE,yB1E29IN,C0Ej9IA,KAAO,U1Ew9IP,C0Et9IA,cACE,KAAO,U1E29IP,C0E19IA,KAAO,U1E+9IP,C0E99IA,KAAO,U1Em+IP,C0El+IA,KAAO,S1Eu+IP,C0Et+IA,KAAO,U1E2+IP,C0Ez+IA,eAAmB,U1E++InB,C0E9+IA,KAAO,U1Ek/IP,C0Ej/IA,KAAO,U1Es/IP,C0Er/IA,KAAO,U1E0/IP,C0Ez/IA,UAAa,U1E8/Ib,C0E7/IA,KAAO,S1EkgJP,CAGF,C0EjgJA,wBACE,KAAO,U1EqgJP,C0EpgJA,KAAO,WAAa,e1EygJpB,C0ExgJA,KAAO,WAAa,iB1E6gJpB,C0E5gJA,KAAO,WAAa,e1EihJpB,C0EhhJA,KAAO,U1EohJP,C0EnhJA,eAAmB,U1EuhJnB,C0EthJA,KAAO,WAAa,e1E2hJpB,C0E1hJA,KAAO,U1E8hJP,C0E7hJA,KAAO,U1EiiJP,CACF,C0E3hJI,g4BACE,a1E8hJN,C2EnxJE,yBACE,Q3EsxJJ,C2EnxJE,oCACE,6B3EqxJJ,C2EnxJI,yBAHF,oCAII,qB3EsxJJ,CACF,C2EpxJI,iDACE,kBACA,S3EsxJN,C2EpxJM,yBAJF,iDAKI,U3EuxJN,CACF,C2EpxJI,+CACE,e3EsxJN,C2ElxJM,yBADF,4CAEI,e3EqxJN,CACF,C4EhzJE,wCACE,aACA,mBACA,eACA,sB5EmzJJ,C4EhzJE,mEACE,iCACE,iBACA,kBACA,WACA,cACA,U5EkzJJ,CACF,C4E9yJA,gBACE,epBHM,CoBIN,WACA,kBACA,eACA,kBACA,mEACA,mBACA,iB5EizJF,C4E/yJE,eACE,sBACE,gCACA,kE5EizJJ,C4E/yJI,yCACE,qB5EizJN,C4E9yJI,wCACE,S5EgzJN,CACF,C4E5yJE,kCACE,6BACA,aACA,YACA,aACA,mBACA,uBACA,mBACA,kBAGA,iB5E6yJJ,C4E9yJI,eAVF,kCAUmB,S5EkzJnB,CACF,C4EhzJI,6CACE,UpBzCE,CoB0CF,anBzDJ,eACA,iBmB0DI,gBACA,WACA,S5EmzJN,C4EjzJM,mDACE,apB3CI,CoB4CJ,oB5EmzJR,C4EhzJM,kDACE,eACA,U5EkzJR,C4EhzJQ,2DACE,YACA,U5EkzJV,C4EhzJU,qEACE,gBACA,uB5EkzJZ,C4E3yJE,kCACE,YACA,aACA,aACA,sBACA,mBACA,8BACA,kBACA,gBACA,kBACA,4BACA,6B5E6yJJ,C4E3yJI,qCACE,Y5E6yJN,C4E1yJI,2FACE,WACA,YACA,kBACA,aACA,sBACA,qB5E4yJN,C4EzyJI,8CACE,sB5E2yJN,C4ExyJI,6CACE,YACA,aACA,sBACA,uBACA,kBACA,yB5E0yJN,C4ExyJM,qDACE,Y5E0yJR,C4EvyJM,+CACE,anBhIN,eACA,iBASA,iBACA,mBmBwHM,e5E2yJR,C4EvyJI,0CACE,yB5EyyJN,C4EvyJM,sDACE,Y5EyyJR,C4EpyJE,mCACE,aACA,uBACA,kBACA,mBACA,aACA,YACA,sBACA,wBACA,gBACA,yBACA,8B5EsyJJ,C4EnyJE,kBACE,enB/JF,eACA,iBASA,iBACA,mBmBuJE,gBACA,uBACA,gBACA,e5EuyJJ,CyDj5JE,8EACE,kDzDo5JJ,CyD14JI,+JACE,azD+4JN,CyD74JM,iEACE,wBzD+4JR,CyD34JI,yDACE,azD64JN,CyDj6JE,wEACE,kDzDo6JJ,CyD15JI,sJACE,azD+5JN,CyD75JM,8DACE,wBzD+5JR,CyD35JI,sDACE,azD65JN,CyDj7JE,oEACE,kDzDo7JJ,CyD16JI,gJACE,azD+6JN,CyD76JM,4DACE,wBzD+6JR,CyD36JI,oDACE,azD66JN,C6Eh/JA,QACE,yC7EggKF,C6E9/JE,gBACE,epBhBF,eACA,iBoBiBE,kBACA,kBACA,arBOI,CqBNJ,YACA,cACA,e7EigKJ,C6E//JI,wCACE,Y7EigKN,C6E7/JI,wCpBDF,uBACA,0BACA,sCzDqgKF,C6EngKe,8CpBJb,yBACA,0BACA,sCzD8gKF,C6EvgKI,mBACE,SACA,UACA,YACA,c7E0gKN,C6EtgKE,yBACE,iB7EwgKJ,C8ExjKA,YACE,aACA,gBACA,UACA,e9E2jKF,C8EzjKE,oCANF,YAOI,iB9E4jKF,CACF,C8E1jKE,erBTA,eACA,iBqBUE,arBDF,iBACA,mBqBEE,UACA,WACA,gBACA,gBACA,uBACA,kB9E8jKJ,C8E3jKM,+BACE,kB9E6jKR,C8E1jKM,gCACE,kB9E4jKR,C8ExjKI,sCACE,W9E0jKN,C8EvjKI,uCACE,W9EyjKN,C8EtjKI,iBACE,atBMU,CsBLV,qBrB9BJ,iBACA,mBqB+BI,eACA,qBACA,mBACA,gBACA,sB9EyjKN,C8EvjKM,uBACE,kBtBVO,CsBWP,a9EyjKR,C8EnjKA,uBACE,kBACA,sBACA,Q9EujKF,C8ErjKE,8BACE,kBACA,MACA,OACA,WACA,W9EujKJ,C+EznKA,iBACE,e/E4nKF,C+E1nKE,iEACE,iB/E4nKJ,C+EznKE,qCACE,YACA,c/E2nKJ,C+ExnKE,gCtBZA,eACA,iBsBaE,gBACA,aACA,U/E2nKJ,C+ExnKE,8BACE,aACA,eACA,6BAEA,4B/EynKJ,C+EvnKI,0BAPF,8BAQI,qB/E0nKJ,CACF,C+ExnKI,uCACE,gBACA,a/E0nKN,C+ExnKM,0BAJF,uCAKI,eACA,e/E2nKN,CACF,C+EznKM,yBATF,uCAUI,a/E4nKN,CACF,CgFvqKA,UACE,exBgBM,CwBfN,yBACA,kBACA,gBACA,iBhF0qKF,CgFxqKE,gBACE,cvBDF,oBACA,sBAIA,iBACA,mBuBFE,UhF4qKJ,CgFzqKE,oBACE,kBACA,kBACA,ehF2qKJ,CgFzqKI,0BACE,iBhF2qKN,CgFzqKM,iCACE,WACA,WACA,YACA,WACA,cACA,kBAGA,oBxBRI,CwBQJ,kBxBRI,CwBQJ,wBxBRI,CwBSJ,uBhF2qKR,CiF3sKA,UACE,cxBCA,eACA,iBwBAA,kBACA,gBjF+sKF,CkFhtKI,sMACE,a1BsBO,C0BrBP,aACA,qBACA,qFACA,kBACA,oBACA,qBlFmtKN,CkFhtKI,0OACE,kBlFktKN,CmFhuKA,GACI,YACA,kB3BqBQ,C2BpBR,UnFmuKJ,CoFnuKI,mBACE,WACA,YACA,iBACA,kBpFsuKN,CoFnuKI,kBACE,WACA,WACA,kBACA,kBpFquKN,CoFluKI,0BAhBF,aAiBI,eACA,YACA,WpFquKJ,CACF,CoFnuKI,yBAtBF,aAuBI,oBpFsuKJ,CoFruKI,mBACE,apFuuKN,CoFruKI,kBACE,cpFuuKN,CACF,CoFnuKE,mBAIE,kBACA,e5BtBI,C4BuBJ,yBACA,aACA,sBAGA,wCACA,cACA,wB5BvBW,C4BwBX,WACA,aACA,sBpFquKJ,CoFnuKI,uBACE,eACA,YACA,YACA,YACA,mEACA,kBACA,qBpFquKN,CqFhyKA,kBACE,kBACA,iBACA,e5BDA,eACA,iB4BEA,U7BYM,C6BXN,iBACA,gBACA,wBrFoyKF,CqFlyKE,oCAVF,kBAWI,cACA,YrFqyKF,CACF,CqFnyKE,mCACE,wBrFqyKJ,CqFnyKI,yIACE,wBrFqyKN,CqFjyKE,iCACE,wBrFmyKJ,CqFhyKM,qCACE,erFkyKR,CqFnyKM,uCACE,kBrFqyKR,CqFtyKM,uCACE,kBrFwyKR,CqFzyKM,2CACE,kBrF2yKR,CqF5yKM,2CACE,kBrF8yKR,CqF/yKM,sCACE,kBrFizKR,CqFlzKM,0CACE,kBrFozKR,CqFrzKM,2CACE,kBrFuzKR,CqFxzKM,qCACE,kBrF0zKR,CqF3zKM,0CACE,erF6zKR,CqF9zKM,yCACE,kBrFg0KR,CqFj0KM,sCACE,kBrFm0KR,CqFp0KM,4CACE,kBrFs0KR,CqFv0KM,qCACE,kBrFy0KR,CqFp0KE,6BACE,aACA,mBACA,uBACA,mBACA,wB7BbG,C6BcH,a7BbS,C6BcT,kBACA,WrFs0KJ,CqFp0KI,6CACE,gBrFs0KN,CqFl0KE,sC5B9CA,eACA,iB4B+CE,qB7BvBO,C6BwBP,U7BlCI,C6BmCJ,mBrFq0KJ,CsFt3KA,oDACE,UACA,YACA,etFy3KF,CsFt3KA,iBACE,e9BiBS,C8BhBT,aACA,kBACA,mBACA,WACA,WAfmB,CAgBnB,sBtFy3KF,CsFv3KE,yBATF,iBAUI,2BACA,iBtF03KF,CACF,CsFx3KE,+BACE,kBACA,MACA,QACA,UA3BiB,CA4BjB,WA5BiB,CA6BjB,etF03KJ,CsFv3KE,0BACE,4BACA,e9BPO,C8BQP,oBACA,StFy3KJ,CsFv3KI,4BACE,YtFy3KN,CsFt3KI,gCACE,iBtFw3KN,CsFv3KM,yBAFF,gCAGI,YtF03KN,CACF,CsFv3KI,mCACE,gBACA,uBACA,iBtFy3KN,CsFt3KI,yCACE,kB9BzCM,C8B0CN,mBACA,yBACA,e7BzDJ,eACA,gBzDk7KF,CsFx3KM,yBANF,yCAOI,YtF23KN,CACF,CsFn3KE,sCACE,StFs3KJ,CsFn3KE,uCACE,gBtFq3KJ,CsFj3KI,gFACE,iBtFm3KN,CsFh3KI,mFACE,StFk3KN,CsFh3KM,yBAHF,mFAII,StFm3KN,CACF,CsF32KM,4oBACE,gBtF82KR,CsFn2KE,6CACE,gCtFs2KJ,CsFn2KE,2FACE,wBtFq2KJ,CuFv9KA,wBACE,WACA,gBACA,eACA,MACA,YACA,UvF09KF,CwFh+KA,oBACE,mBxFm+KF,CwFj+KE,wBACE,aACA,UxFm+KJ,CwF/9KI,wDACE,6BACA,gBACA,gBxFi+KN,CwF99KI,2DACE,aACA,cxFg+KN,CwF99KM,+EACE,mBACA,aACA,YACA,sBxFg+KR,CwF99KQ,oCANF,+EAOI,uBACA,sBACA,kBxFi+KR,CACF,CwF/9KQ,yGACE,UACA,iBxFi+KV,CwF/9KU,yBAJF,yGAKI,WACA,cxFk+KV,CACF,CwFh+KU,0HACE,qBhCbD,CgCcC,iBxFk+KZ,CwF99KQ,yGACE,qBACA,gBACA,SxFg+KV,CwF99KU,2GACE,mBACA,iBxFg+KZ,CwF99KY,iHACE,yBACA,2B/BvDZ,eACA,iB+BwDY,kBACA,OxFi+Kd,CyF5hLE,4BACE,mDACA,0CACA,kBACA,kBzF+hLJ,CyF3hLI,oCACE,ShCEJ,iBACA,kBzD4hLF,CyF3hLI,mCACE,QzF6hLN,CyFzhLE,qCACE,kBACA,SACA,wBzF2hLJ,CyFxhLE,qCACE,aACA,sBACA,6BACA,kBACA,kBzF0hLJ,CyFxhLI,2CACE,qBACA,iCACA,kBACA,mGACA,0BzF0hLN,C0F/jLA,sBACE,oBACA,c1FkkLF,C0F/jLA,sBACE,eACA,iBACA,YACA,iBACA,kBACA,oF1FkkLF,C2F7kLA,mBACE,U3FglLF,C2F9kLE,mCACE,aACA,mBACA,cACA,eACA,kCACA,WACA,gBACA,eACA,MACA,OACA,QACA,UACA,qBnCWO,CmCVP,sCACA,qB3FglLJ,C2F9kLI,gDACE,cACA,Y3FglLN,C2F9kLM,uElCtBJ,eACA,iBkCuBM,gBACA,kBACA,yBACA,U3FilLR,C2F9kLM,mDACE,SACA,S3FglLR,C2F9kLQ,sDACE,e3FglLV,C2F7kLQ,uElCtCN,eACA,iBASA,iBACA,mBkC8BQ,anCpBE,CmCqBF,qBACA,gBACA,e3FilLV,C2F/kLU,wEACE,oB3FilLZ,C2F9kLU,6EACE,U3FglLZ,C2F5kLQ,kEACE,e3F8kLV,C2F5kLU,sFACE,e3F8kLZ,C2FxkLI,+CACE,UnCnDE,CmCoDF,kBACA,W3F0kLN,C2FvkLI,qCACE,UnCzDE,CmC0DF,e3FykLN,C2FtkLI,yBA3EF,mCA4EI,a3FykLJ,CACF,C2FrkLI,4CACE,UACA,cACA,gBACA,kBACA,yBACA,e3FukLN,C2FpkLQ,gFACE,U3FskLV,C2FnkLQ,6EACE,a3FqkLV,C2FnkLU,mFACE,a3FqkLZ,C2FhkLM,wDACE,U3FkkLR,C2F/jLM,8CACE,a3FikLR,C4F7qLE,6BACE,iB5FirLJ,C4F9qLE,+BACE,epCSI,CoCRJ,mEACA,sBACA,sBACA,kBACA,apCkCY,CC7Cd,eACA,iBmCYE,gBnCHF,iBACA,mBmCIE,aACA,iBACA,gBACA,WACA,eACA,aACA,mBACA,kB5FkrLJ,C4FhrLI,sCACE,gBACA,iBACA,yB5FkrLN,C4F/qLI,qCACE,yBACA,sE5FirLN,C4F9qLI,yCACE,cACA,kB5FgrLN,C4F5qLE,iCACE,epC3BI,CoC4BJ,sEACA,kBACA,qBACA,SACA,UACA,kBACA,MACA,WACA,S5F8qLJ,C4F5qLI,oCACE,enCtDJ,eACA,iBASA,iBACA,mBmC8CI,SACA,0BACA,kBACA,mBACA,4B5FgrLN,C4F9qLM,gDACE,yB5FgrLR,C4F7qLM,+CACE,yB5F+qLR,C4F5qLM,0CACE,kBpCjCO,CoCkCP,a5F8qLR,C4F3qLM,6CACE,wB5F6qLR,C4F1qLM,4CACE,UACA,kBACA,SACA,S5F4qLR,C6FlwLA,MACE,cACA,mEACA,kBACA,e7FqwLF,C6FnwLE,oBACE,U7FqwLJ,C6FlwLE,sBACE,kB7FowLJ,C6FjwLE,aACE,sBACA,oB7FmwLJ,C6FjwLI,eACE,uBACA,oB7FmwLN,C6FhwLI,kBACE,+BACA,gCACA,UrCCK,CCzBT,eACA,iBoCyBI,gBACA,iBACA,gBACA,yBpCnBJ,iBACA,kBzDuxLF,C6F/vLI,oCAEE,gCACA,aACA,gBpC7BJ,iBACA,mBoC8BI,kB7FkwLN,C6FhwLM,yBACE,kDAEE,oB7FkwLR,CACF,C6F7vLI,kBpC/CF,oBACA,qBzD+yLF,C6F7vLQ,yBADF,oCAEI,wB7FgwLR,CACF,C6F5vLI,kBACE,+BACA,+BACA,gBACA,e7F8vLN,C6FzvLI,6BACE,W7F2vLN,C6FzvLM,yBAHF,6BAII,+B7F4vLN,CACF,C6FrvLE,sCACE,a7FwvLJ,C6FrvLE,yCAGE,kMACE,cACA,kBACA,c7FwvLJ,C6FrvLE,0BACE,iB7FuvLJ,C6FnvLI,sFACE,mBACA,gB7FqvLN,CACF,C6F/uLE,sCACE,S7FkvLJ,C8Fl1LA,eACE,UACA,eACA,SACA,QACA,YACA,gBACA,iB9Fq1LF,C8Fj1LE,mBrC1BA,eACA,iBqC2BE,mBACA,oB9Fq1LJ,C8Fn1LI,iErC/BF,eACA,gBzDs3LF,C8Fn1LI,gCACE,gBACA,oBACA,S9Fq1LN,C8Fn1LM,0CACE,kBACA,Q9Fq1LR,C8Fn1LQ,gDACE,a9Fq1LV,C8F/0LM,+EAEE,eACA,qBACA,aACA,6BACA,YACA,gBACA,UACA,gB9Fg1LR,C8F90LQ,6GACE,aACA,kB9Fg1LV,C8F30LQ,6DACE,YACA,WACA,kBACA,UACA,O9F60LV,C8F10LQ,2DACE,a9F40LV,C8Fx0LM,yCACE,atC5DK,CsC6DL,SACA,iB9F00LR,C8Fx0LQ,+CACE,a9F00LV,C8Fv0LQ,+CACE,qB9Fy0LV,C8Ft0LQ,yDACE,oB9Fw0LV,C8Fl0LM,uCrC1EJ,uBACA,0BACA,sCzDm5LF,C8Fv0LM,6CrC9EJ,wBACA,0BACA,sCzD45LF,C8F30LI,+BACE,qBACA,SACA,iB9F60LN,C8F30LM,yBALF,+BAMI,U9F80LN,CACF,C8F50LM,kCACE,sBrChHN,iBACA,mBqCiHM,uBACA,kBACA,8B9F+0LR,C8F70LQ,2CACE,WACA,cACA,WACA,UACA,iBACA,kBtCjHE,CsCkHF,U9F+0LV,C8F50LQ,qCACE,iB9F80LV,C8F30LQ,oCACE,cACA,iBrChJR,eACA,iBqCiJQ,oBACA,kB9F80LV,C8F10LU,0CACE,a9F40LZ,C8Fv0LU,2CACE,atCpJL,CsCqJK,e9Fy0LZ,C8Ft0LU,kDA9JR,kBtCMK,CsCLL,kBACA,WACA,WACA,YACA,kBACA,2BACA,6BACA,S9Fu+LF,C8F10LQ,wDACE,8BACA,SACA,WACA,OACA,kBACA,K9F40LV,C8Fz0LQ,oEACE,2BACA,4B9F20LV,C8Fx0LQ,mEACE,uCACA,wC9F00LV,C8Ft0LU,6EAzLR,kBtCiBU,CsChBV,kBACA,WACA,WACA,YACA,kBACA,2BACA,6BACA,S9FkgMF,C8Fv0LI,yBADF,iBAEI,Y9F00LJ,CACF,C8Fx0LI,4BACE,gB9F00LN,C8Fx0LM,yCACE,c9F00LR,C+FjhMA,yQACE,Y/F+hMF,C+F5hMA,wBACE,6B/F+hMF,C+F1hMI,gDACE,cACA,gBACA,kBACA,iCACA,6B/F6hMN,C+FxhMA,GACE,kBACA,e/F2hMF,CgG3jMA,aAGI,EACI,yBhG4jMN,CgGzjME,2BACI,yBhG4jMN,CgGzjME,GACI,sBACA,oBhG4jMN,CgGzjME,kBACI,sBhG4jMN,CgGzjME,mEACI,uBhG4jMN,CgGzjME,6BACI,yChG4jMN,CgGzjME,IACI,wBhG4jMN,CgGzjME,EACI,QhG4jMN,CgGzjME,0BACI,uBhG4jMN,CgGnjME,0CACI,sBhG0jMN,CgGtjME,qBACI,kBhGyjMN,CgGtjME,wCACI,ehGyjMN,CgGtjME,iBACI,gBhGyjMN,CgGtjME,UACI,chGyjMN,CgGtjME,cACI,qBhGyjMN,CgGrjMM,sDACI,ehGwjMV,CgGtjMU,g4BACI,UhGwjMd,CgGpjMM,oBACI,gBAEA,UhGsjMV,CgGljME,kCALQ,yBhG2jMV,CgGhjMU,kEACI,iBhGmjMd,CgGhjMU,4DACI,ehGkjMd,CgG7iME,kBACI,qBACA,0BACA,qBACA,oBACA,uBhGgjMN,CgG7iME,qBACI,wBhGgjMN,CACF","file":"styles.26c7acdc1e2d44a6f9e6.css","sourcesContent":["// This contains all of the styles for the badge\n// rather than just the color/theme because of\n// no style sheet support for directives.\n@use 'sass:color';\n@use 'sass:map';\n@use 'sass:meta';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../../cdk/a11y';\n\n$font-size: 12px;\n$font-weight: 600;\n$default-size: 22px !default;\n$small-size: $default-size - 6;\n$large-size: $default-size + 6;\n\n// Mixin for building offset given different sizes\n@mixin _badge-size($size) {\n  .mat-badge-content {\n    width: $size;\n    height: $size;\n    line-height: $size;\n  }\n\n  &.mat-badge-above {\n    .mat-badge-content {\n      top: -$size / 2;\n    }\n  }\n\n  &.mat-badge-below {\n    .mat-badge-content {\n      bottom: -$size / 2;\n    }\n  }\n\n  &.mat-badge-before {\n    .mat-badge-content {\n      left: -$size;\n    }\n  }\n\n  [dir='rtl'] &.mat-badge-before {\n    .mat-badge-content {\n      left: auto;\n      right: -$size;\n    }\n  }\n\n  &.mat-badge-after {\n    .mat-badge-content {\n      right: -$size;\n    }\n  }\n\n  [dir='rtl'] &.mat-badge-after {\n    .mat-badge-content {\n      right: auto;\n      left: -$size;\n    }\n  }\n\n  &.mat-badge-overlap {\n    &.mat-badge-before {\n      .mat-badge-content {\n        left: -$size / 2;\n      }\n    }\n\n    [dir='rtl'] &.mat-badge-before {\n      .mat-badge-content {\n        left: auto;\n        right: -$size / 2;\n      }\n    }\n\n    &.mat-badge-after {\n      .mat-badge-content {\n        right: -$size / 2;\n      }\n    }\n\n    [dir='rtl'] &.mat-badge-after {\n      .mat-badge-content {\n        right: auto;\n        left: -$size / 2;\n      }\n    }\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $primary: map.get($config, primary);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-badge-content {\n    color: theming.get-color-from-palette($primary, default-contrast);\n    background: theming.get-color-from-palette($primary);\n\n    @include a11y.high-contrast(active, off) {\n      outline: solid 1px;\n      border-radius: 0;\n    }\n  }\n\n  .mat-badge-accent {\n    .mat-badge-content {\n      background: theming.get-color-from-palette($accent);\n      color: theming.get-color-from-palette($accent, default-contrast);\n    }\n  }\n\n  .mat-badge-warn {\n    .mat-badge-content {\n      color: theming.get-color-from-palette($warn, default-contrast);\n      background: theming.get-color-from-palette($warn);\n    }\n  }\n\n  .mat-badge {\n    position: relative;\n  }\n\n  .mat-badge-hidden {\n    .mat-badge-content {\n      display: none;\n    }\n  }\n\n  .mat-badge-disabled {\n    .mat-badge-content {\n      $app-background: theming.get-color-from-palette($background, 'background');\n      $badge-color: theming.get-color-from-palette($foreground, disabled-button);\n\n      // The disabled color usually has some kind of opacity, but because the badge is overlayed\n      // on top of something else, it won't look good if it's opaque. If it is a color *type*,\n      // we convert it into a solid color by taking the opacity from the rgba value and using\n      // the value to determine the percentage of the background to put into foreground when\n      // mixing the colors together.\n      @if (meta.type-of($badge-color) == color and meta.type-of($app-background) == color) {\n        $badge-opacity: opacity($badge-color);\n        background: color.mix($app-background, rgba($badge-color, 1), (1 - $badge-opacity) * 100%);\n      }\n      @else {\n        background: $badge-color;\n      }\n\n      color: theming.get-color-from-palette($foreground, disabled-text);\n    }\n  }\n\n  .mat-badge-content {\n    position: absolute;\n    text-align: center;\n    display: inline-block;\n    border-radius: 50%;\n    transition: transform 200ms ease-in-out;\n    transform: scale(0.6);\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    pointer-events: none;\n  }\n\n  .ng-animate-disabled .mat-badge-content,\n  .mat-badge-content._mat-animation-noopable {\n    transition: none;\n  }\n\n  // The active class is added after the element is added\n  // so it can animate scale to default\n  .mat-badge-content.mat-badge-active {\n    // Scale to `none` instead of `1` to avoid blurry text in some browsers.\n    transform: none;\n  }\n\n  .mat-badge-small {\n    @include _badge-size($small-size);\n  }\n  .mat-badge-medium {\n    @include _badge-size($default-size);\n  }\n  .mat-badge-large {\n    @include _badge-size($large-size);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-badge-content {\n    font-weight: $font-weight;\n    font-size: $font-size;\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-badge-small .mat-badge-content {\n    // Set the font size to 75% of the original.\n    font-size: $font-size * 0.75;\n  }\n\n  .mat-badge-large .mat-badge-content {\n    font-size: $font-size * 2;\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-badge') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n",".mat-badge-content {\n  font-weight: 600;\n  font-size: 12px;\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-badge-small .mat-badge-content {\n  font-size: 9px;\n}\n\n.mat-badge-large .mat-badge-content {\n  font-size: 24px;\n}\n\n.mat-h1, .mat-headline, .mat-typography h1 {\n  font: 400 24px/32px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n  margin: 0 0 16px;\n}\n\n.mat-h2, .mat-title, .mat-typography h2 {\n  font: 500 20px/32px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n  margin: 0 0 16px;\n}\n\n.mat-h3, .mat-subheading-2, .mat-typography h3 {\n  font: 400 16px/28px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n  margin: 0 0 16px;\n}\n\n.mat-h4, .mat-subheading-1, .mat-typography h4 {\n  font: 400 15px/24px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n  margin: 0 0 16px;\n}\n\n.mat-h5, .mat-typography h5 {\n  font: 400 calc(14px * 0.83)/20px Roboto, \"Helvetica Neue\", sans-serif;\n  margin: 0 0 12px;\n}\n\n.mat-h6, .mat-typography h6 {\n  font: 400 calc(14px * 0.67)/20px Roboto, \"Helvetica Neue\", sans-serif;\n  margin: 0 0 12px;\n}\n\n.mat-body-strong, .mat-body-2 {\n  font: 500 14px/24px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-body, .mat-body-1, .mat-typography {\n  font: 400 14px/20px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n.mat-body p, .mat-body-1 p, .mat-typography p {\n  margin: 0 0 12px;\n}\n\n.mat-small, .mat-caption {\n  font: 400 12px/20px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-display-4, .mat-typography .mat-display-4 {\n  font: 300 112px/112px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: -0.05em;\n  margin: 0 0 56px;\n}\n\n.mat-display-3, .mat-typography .mat-display-3 {\n  font: 400 56px/56px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: -0.02em;\n  margin: 0 0 64px;\n}\n\n.mat-display-2, .mat-typography .mat-display-2 {\n  font: 400 45px/48px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: -0.005em;\n  margin: 0 0 64px;\n}\n\n.mat-display-1, .mat-typography .mat-display-1 {\n  font: 400 34px/40px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n  margin: 0 0 64px;\n}\n\n.mat-bottom-sheet-container {\n  font: 400 14px/20px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-button, .mat-raised-button, .mat-icon-button, .mat-stroked-button,\n.mat-flat-button, .mat-fab, .mat-mini-fab {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.mat-button-toggle {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-card {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-card-title {\n  font-size: 24px;\n  font-weight: 500;\n}\n\n.mat-card-header .mat-card-title {\n  font-size: 20px;\n}\n\n.mat-card-subtitle,\n.mat-card-content {\n  font-size: 14px;\n}\n\n.mat-checkbox {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-checkbox-layout .mat-checkbox-label {\n  line-height: 24px;\n}\n\n.mat-chip {\n  font-size: 14px;\n  font-weight: 500;\n}\n.mat-chip .mat-chip-trailing-icon.mat-icon,\n.mat-chip .mat-chip-remove.mat-icon {\n  font-size: 18px;\n}\n\n.mat-table {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-header-cell {\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.mat-cell, .mat-footer-cell {\n  font-size: 14px;\n}\n\n.mat-calendar {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-calendar-body {\n  font-size: 13px;\n}\n\n.mat-calendar-body-label,\n.mat-calendar-period-button {\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.mat-calendar-table-header th {\n  font-size: 11px;\n  font-weight: 400;\n}\n\n.mat-dialog-title {\n  font: 500 20px/32px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-expansion-panel-header {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 15px;\n  font-weight: 400;\n}\n\n.mat-expansion-panel-content {\n  font: 400 14px/20px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-form-field {\n  font-size: inherit;\n  font-weight: 400;\n  line-height: 1.125;\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-form-field-wrapper {\n  padding-bottom: 1.34375em;\n}\n\n.mat-form-field-prefix .mat-icon,\n.mat-form-field-suffix .mat-icon {\n  font-size: 150%;\n  line-height: 1.125;\n}\n.mat-form-field-prefix .mat-icon-button,\n.mat-form-field-suffix .mat-icon-button {\n  height: 1.5em;\n  width: 1.5em;\n}\n.mat-form-field-prefix .mat-icon-button .mat-icon,\n.mat-form-field-suffix .mat-icon-button .mat-icon {\n  height: 1.125em;\n  line-height: 1.125;\n}\n\n.mat-form-field-infix {\n  padding: 0.5em 0;\n  border-top: 0.84375em solid transparent;\n}\n\n.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.34375em) scale(0.75);\n  width: 133.3333333333%;\n}\n.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.34374em) scale(0.75);\n  width: 133.3333433333%;\n}\n\n.mat-form-field-label-wrapper {\n  top: -0.84375em;\n  padding-top: 0.84375em;\n}\n\n.mat-form-field-label {\n  top: 1.34375em;\n}\n\n.mat-form-field-underline {\n  bottom: 1.34375em;\n}\n\n.mat-form-field-subscript-wrapper {\n  font-size: 75%;\n  margin-top: 0.6666666667em;\n  top: calc(100% - 1.7916666667em);\n}\n\n.mat-form-field-appearance-legacy .mat-form-field-wrapper {\n  padding-bottom: 1.25em;\n}\n.mat-form-field-appearance-legacy .mat-form-field-infix {\n  padding: 0.4375em 0;\n}\n.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px);\n  -ms-transform: translateY(-1.28125em) scale(0.75);\n  width: 133.3333333333%;\n}\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.00101px);\n  -ms-transform: translateY(-1.28124em) scale(0.75);\n  width: 133.3333433333%;\n}\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.00102px);\n  -ms-transform: translateY(-1.28123em) scale(0.75);\n  width: 133.3333533333%;\n}\n.mat-form-field-appearance-legacy .mat-form-field-label {\n  top: 1.28125em;\n}\n.mat-form-field-appearance-legacy .mat-form-field-underline {\n  bottom: 1.25em;\n}\n.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {\n  margin-top: 0.5416666667em;\n  top: calc(100% - 1.6666666667em);\n}\n\n@media print {\n  .mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n    transform: translateY(-1.28122em) scale(0.75);\n  }\n  .mat-form-field-appearance-legacy.mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper .mat-form-field-label {\n    transform: translateY(-1.28121em) scale(0.75);\n  }\n  .mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {\n    transform: translateY(-1.2812em) scale(0.75);\n  }\n}\n.mat-form-field-appearance-fill .mat-form-field-infix {\n  padding: 0.25em 0 0.75em 0;\n}\n.mat-form-field-appearance-fill .mat-form-field-label {\n  top: 1.09375em;\n  margin-top: -0.5em;\n}\n.mat-form-field-appearance-fill.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-0.59375em) scale(0.75);\n  width: 133.3333333333%;\n}\n.mat-form-field-appearance-fill.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-0.59374em) scale(0.75);\n  width: 133.3333433333%;\n}\n\n.mat-form-field-appearance-outline .mat-form-field-infix {\n  padding: 1em 0 1em 0;\n}\n.mat-form-field-appearance-outline .mat-form-field-label {\n  top: 1.84375em;\n  margin-top: -0.25em;\n}\n.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label,\n.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.59375em) scale(0.75);\n  width: 133.3333333333%;\n}\n.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {\n  transform: translateY(-1.59374em) scale(0.75);\n  width: 133.3333433333%;\n}\n\n.mat-grid-tile-header,\n.mat-grid-tile-footer {\n  font-size: 14px;\n}\n.mat-grid-tile-header .mat-line,\n.mat-grid-tile-footer .mat-line {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: block;\n  box-sizing: border-box;\n}\n.mat-grid-tile-header .mat-line:nth-child(n+2),\n.mat-grid-tile-footer .mat-line:nth-child(n+2) {\n  font-size: 12px;\n}\n\ninput.mat-input-element {\n  margin-top: -0.0625em;\n}\n\n.mat-menu-item {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n}\n\n.mat-paginator,\n.mat-paginator-page-size .mat-select-trigger {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 12px;\n}\n\n.mat-radio-button {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-select {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-select-trigger {\n  height: 1.125em;\n}\n\n.mat-slide-toggle-content {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-slider-thumb-label-text {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.mat-stepper-vertical, .mat-stepper-horizontal {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-step-label {\n  font-size: 14px;\n  font-weight: 400;\n}\n\n.mat-step-sub-label-error {\n  font-weight: normal;\n}\n\n.mat-step-label-error {\n  font-size: 14px;\n}\n\n.mat-step-label-selected {\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.mat-tab-group {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-tab-label, .mat-tab-link {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.mat-toolbar,\n.mat-toolbar h1,\n.mat-toolbar h2,\n.mat-toolbar h3,\n.mat-toolbar h4,\n.mat-toolbar h5,\n.mat-toolbar h6 {\n  font: 500 20px/32px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n  margin: 0;\n}\n\n.mat-tooltip {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 10px;\n  padding-top: 6px;\n  padding-bottom: 6px;\n}\n\n.mat-tooltip-handset {\n  font-size: 14px;\n  padding-top: 8px;\n  padding-bottom: 8px;\n}\n\n.mat-list-item {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-list-option {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-list-base .mat-list-item {\n  font-size: 16px;\n}\n.mat-list-base .mat-list-item .mat-line {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: block;\n  box-sizing: border-box;\n}\n.mat-list-base .mat-list-item .mat-line:nth-child(n+2) {\n  font-size: 14px;\n}\n.mat-list-base .mat-list-option {\n  font-size: 16px;\n}\n.mat-list-base .mat-list-option .mat-line {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: block;\n  box-sizing: border-box;\n}\n.mat-list-base .mat-list-option .mat-line:nth-child(n+2) {\n  font-size: 14px;\n}\n.mat-list-base .mat-subheader {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n}\n\n.mat-list-base[dense] .mat-list-item {\n  font-size: 12px;\n}\n.mat-list-base[dense] .mat-list-item .mat-line {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: block;\n  box-sizing: border-box;\n}\n.mat-list-base[dense] .mat-list-item .mat-line:nth-child(n+2) {\n  font-size: 12px;\n}\n.mat-list-base[dense] .mat-list-option {\n  font-size: 12px;\n}\n.mat-list-base[dense] .mat-list-option .mat-line {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: block;\n  box-sizing: border-box;\n}\n.mat-list-base[dense] .mat-list-option .mat-line:nth-child(n+2) {\n  font-size: 12px;\n}\n.mat-list-base[dense] .mat-subheader {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 12px;\n  font-weight: 500;\n}\n\n.mat-option {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 16px;\n}\n\n.mat-optgroup-label {\n  font: 500 14px/24px Roboto, \"Helvetica Neue\", sans-serif;\n  letter-spacing: normal;\n}\n\n.mat-simple-snackbar {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n  font-size: 14px;\n}\n\n.mat-simple-snackbar-action {\n  line-height: 1;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: 500;\n}\n\n.mat-tree {\n  font-family: Roboto, \"Helvetica Neue\", sans-serif;\n}\n\n.mat-tree-node,\n.mat-nested-tree-node {\n  font-weight: 400;\n  font-size: 14px;\n}\n\n.mat-ripple {\n  overflow: hidden;\n  position: relative;\n}\n.mat-ripple:not(:empty) {\n  transform: translateZ(0);\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  transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);\n  transform: scale(0);\n}\n.cdk-high-contrast-active .mat-ripple-element {\n  display: none;\n}\n\n.cdk-visually-hidden {\n  border: 0;\n  clip: rect(0 0 0 0);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  width: 1px;\n  white-space: nowrap;\n  outline: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n}\n\n.cdk-overlay-container, .cdk-global-overlay-wrapper {\n  pointer-events: none;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n\n.cdk-overlay-container {\n  position: fixed;\n  z-index: 1000;\n}\n.cdk-overlay-container:empty {\n  display: none;\n}\n\n.cdk-global-overlay-wrapper {\n  display: flex;\n  position: absolute;\n  z-index: 1000;\n}\n\n.cdk-overlay-pane {\n  position: absolute;\n  pointer-events: auto;\n  box-sizing: border-box;\n  z-index: 1000;\n  display: flex;\n  max-width: 100%;\n  max-height: 100%;\n}\n\n.cdk-overlay-backdrop {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  z-index: 1000;\n  pointer-events: auto;\n  -webkit-tap-highlight-color: transparent;\n  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);\n  opacity: 0;\n}\n.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n  opacity: 1;\n}\n.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {\n  opacity: 0.6;\n}\n\n.cdk-overlay-dark-backdrop {\n  background: rgba(0, 0, 0, 0.32);\n}\n\n.cdk-overlay-transparent-backdrop, .cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {\n  opacity: 0;\n}\n\n.cdk-overlay-connected-position-bounding-box {\n  position: absolute;\n  z-index: 1000;\n  display: flex;\n  flex-direction: column;\n  min-width: 1px;\n  min-height: 1px;\n}\n\n.cdk-global-scrollblock {\n  position: fixed;\n  width: 100%;\n  overflow-y: scroll;\n}\n\ntextarea.cdk-textarea-autosize {\n  resize: none;\n}\n\ntextarea.cdk-textarea-autosize-measuring {\n  padding: 2px 0 !important;\n  box-sizing: content-box !important;\n  height: auto !important;\n  overflow: hidden !important;\n}\n\ntextarea.cdk-textarea-autosize-measuring-firefox {\n  padding: 2px 0 !important;\n  box-sizing: content-box !important;\n  height: 0 !important;\n}\n\n@keyframes cdk-text-field-autofill-start {\n  /*!*/\n}\n@keyframes cdk-text-field-autofill-end {\n  /*!*/\n}\n.cdk-text-field-autofill-monitored:-webkit-autofill {\n  animation: cdk-text-field-autofill-start 0s 1ms;\n}\n\n.cdk-text-field-autofill-monitored:not(:-webkit-autofill) {\n  animation: cdk-text-field-autofill-end 0s 1ms;\n}\n\n.mat-focus-indicator {\n  position: relative;\n}\n\n.mat-mdc-focus-indicator {\n  position: relative;\n}\n\n.mat-ripple-element {\n  background-color: rgba(0, 0, 0, 0.1);\n}\n\n.mat-option {\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) {\n  background: rgba(0, 0, 0, 0.04);\n}\n.mat-option.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {\n  background: rgba(0, 0, 0, 0.04);\n}\n.mat-option.mat-active {\n  background: rgba(0, 0, 0, 0.04);\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-option.mat-option-disabled {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {\n  color: #1976d2;\n}\n\n.mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {\n  color: #d32f2f;\n}\n\n.mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {\n  color: #f44336;\n}\n\n.mat-optgroup-label {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-optgroup-disabled .mat-optgroup-label {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-pseudo-checkbox {\n  color: rgba(0, 0, 0, 0.54);\n}\n.mat-pseudo-checkbox::after {\n  color: #fafafa;\n}\n\n.mat-pseudo-checkbox-disabled {\n  color: #b0b0b0;\n}\n\n.mat-primary .mat-pseudo-checkbox-checked,\n.mat-primary .mat-pseudo-checkbox-indeterminate {\n  background: #1976d2;\n}\n\n.mat-pseudo-checkbox-checked,\n.mat-pseudo-checkbox-indeterminate,\n.mat-accent .mat-pseudo-checkbox-checked,\n.mat-accent .mat-pseudo-checkbox-indeterminate {\n  background: #d32f2f;\n}\n\n.mat-warn .mat-pseudo-checkbox-checked,\n.mat-warn .mat-pseudo-checkbox-indeterminate {\n  background: #f44336;\n}\n\n.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled,\n.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {\n  background: #b0b0b0;\n}\n\n.mat-app-background {\n  background-color: #fafafa;\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-elevation-z0 {\n  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z1 {\n  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z2 {\n  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z3 {\n  box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z4 {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z5 {\n  box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z6 {\n  box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z7 {\n  box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z8 {\n  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z9 {\n  box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z10 {\n  box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z11 {\n  box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z12 {\n  box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z13 {\n  box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z14 {\n  box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z15 {\n  box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z16 {\n  box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z17 {\n  box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z18 {\n  box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z19 {\n  box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z20 {\n  box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z21 {\n  box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z22 {\n  box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z23 {\n  box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);\n}\n\n.mat-elevation-z24 {\n  box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);\n}\n\n.mat-theme-loaded-marker {\n  display: none;\n}\n\n.mat-autocomplete-panel {\n  background: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-autocomplete-panel:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n}\n.mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active):not(:hover) {\n  background: white;\n}\n.mat-autocomplete-panel .mat-option.mat-selected:not(.mat-active):not(:hover):not(.mat-option-disabled) {\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-badge-content {\n  color: white;\n  background: #1976d2;\n}\n.cdk-high-contrast-active .mat-badge-content {\n  outline: solid 1px;\n  border-radius: 0;\n}\n\n.mat-badge-accent .mat-badge-content {\n  background: #d32f2f;\n  color: white;\n}\n\n.mat-badge-warn .mat-badge-content {\n  color: white;\n  background: #f44336;\n}\n\n.mat-badge {\n  position: relative;\n}\n\n.mat-badge-hidden .mat-badge-content {\n  display: none;\n}\n\n.mat-badge-disabled .mat-badge-content {\n  background: #b9b9b9;\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-badge-content {\n  position: absolute;\n  text-align: center;\n  display: inline-block;\n  border-radius: 50%;\n  transition: transform 200ms ease-in-out;\n  transform: scale(0.6);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  pointer-events: none;\n}\n\n.ng-animate-disabled .mat-badge-content,\n.mat-badge-content._mat-animation-noopable {\n  transition: none;\n}\n\n.mat-badge-content.mat-badge-active {\n  transform: none;\n}\n\n.mat-badge-small .mat-badge-content {\n  width: 16px;\n  height: 16px;\n  line-height: 16px;\n}\n.mat-badge-small.mat-badge-above .mat-badge-content {\n  top: -8px;\n}\n.mat-badge-small.mat-badge-below .mat-badge-content {\n  bottom: -8px;\n}\n.mat-badge-small.mat-badge-before .mat-badge-content {\n  left: -16px;\n}\n[dir=rtl] .mat-badge-small.mat-badge-before .mat-badge-content {\n  left: auto;\n  right: -16px;\n}\n.mat-badge-small.mat-badge-after .mat-badge-content {\n  right: -16px;\n}\n[dir=rtl] .mat-badge-small.mat-badge-after .mat-badge-content {\n  right: auto;\n  left: -16px;\n}\n.mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {\n  left: -8px;\n}\n[dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {\n  left: auto;\n  right: -8px;\n}\n.mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {\n  right: -8px;\n}\n[dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {\n  right: auto;\n  left: -8px;\n}\n\n.mat-badge-medium .mat-badge-content {\n  width: 22px;\n  height: 22px;\n  line-height: 22px;\n}\n.mat-badge-medium.mat-badge-above .mat-badge-content {\n  top: -11px;\n}\n.mat-badge-medium.mat-badge-below .mat-badge-content {\n  bottom: -11px;\n}\n.mat-badge-medium.mat-badge-before .mat-badge-content {\n  left: -22px;\n}\n[dir=rtl] .mat-badge-medium.mat-badge-before .mat-badge-content {\n  left: auto;\n  right: -22px;\n}\n.mat-badge-medium.mat-badge-after .mat-badge-content {\n  right: -22px;\n}\n[dir=rtl] .mat-badge-medium.mat-badge-after .mat-badge-content {\n  right: auto;\n  left: -22px;\n}\n.mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {\n  left: -11px;\n}\n[dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {\n  left: auto;\n  right: -11px;\n}\n.mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {\n  right: -11px;\n}\n[dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {\n  right: auto;\n  left: -11px;\n}\n\n.mat-badge-large .mat-badge-content {\n  width: 28px;\n  height: 28px;\n  line-height: 28px;\n}\n.mat-badge-large.mat-badge-above .mat-badge-content {\n  top: -14px;\n}\n.mat-badge-large.mat-badge-below .mat-badge-content {\n  bottom: -14px;\n}\n.mat-badge-large.mat-badge-before .mat-badge-content {\n  left: -28px;\n}\n[dir=rtl] .mat-badge-large.mat-badge-before .mat-badge-content {\n  left: auto;\n  right: -28px;\n}\n.mat-badge-large.mat-badge-after .mat-badge-content {\n  right: -28px;\n}\n[dir=rtl] .mat-badge-large.mat-badge-after .mat-badge-content {\n  right: auto;\n  left: -28px;\n}\n.mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {\n  left: -14px;\n}\n[dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {\n  left: auto;\n  right: -14px;\n}\n.mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {\n  right: -14px;\n}\n[dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {\n  right: auto;\n  left: -14px;\n}\n\n.mat-bottom-sheet-container {\n  box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);\n  background: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-button, .mat-icon-button, .mat-stroked-button {\n  color: inherit;\n  background: transparent;\n}\n.mat-button.mat-primary, .mat-icon-button.mat-primary, .mat-stroked-button.mat-primary {\n  color: #1976d2;\n}\n.mat-button.mat-accent, .mat-icon-button.mat-accent, .mat-stroked-button.mat-accent {\n  color: #d32f2f;\n}\n.mat-button.mat-warn, .mat-icon-button.mat-warn, .mat-stroked-button.mat-warn {\n  color: #f44336;\n}\n.mat-button.mat-primary.mat-button-disabled, .mat-button.mat-accent.mat-button-disabled, .mat-button.mat-warn.mat-button-disabled, .mat-button.mat-button-disabled.mat-button-disabled, .mat-icon-button.mat-primary.mat-button-disabled, .mat-icon-button.mat-accent.mat-button-disabled, .mat-icon-button.mat-warn.mat-button-disabled, .mat-icon-button.mat-button-disabled.mat-button-disabled, .mat-stroked-button.mat-primary.mat-button-disabled, .mat-stroked-button.mat-accent.mat-button-disabled, .mat-stroked-button.mat-warn.mat-button-disabled, .mat-stroked-button.mat-button-disabled.mat-button-disabled {\n  color: rgba(0, 0, 0, 0.26);\n}\n.mat-button.mat-primary .mat-button-focus-overlay, .mat-icon-button.mat-primary .mat-button-focus-overlay, .mat-stroked-button.mat-primary .mat-button-focus-overlay {\n  background-color: #1976d2;\n}\n.mat-button.mat-accent .mat-button-focus-overlay, .mat-icon-button.mat-accent .mat-button-focus-overlay, .mat-stroked-button.mat-accent .mat-button-focus-overlay {\n  background-color: #d32f2f;\n}\n.mat-button.mat-warn .mat-button-focus-overlay, .mat-icon-button.mat-warn .mat-button-focus-overlay, .mat-stroked-button.mat-warn .mat-button-focus-overlay {\n  background-color: #f44336;\n}\n.mat-button.mat-button-disabled .mat-button-focus-overlay, .mat-icon-button.mat-button-disabled .mat-button-focus-overlay, .mat-stroked-button.mat-button-disabled .mat-button-focus-overlay {\n  background-color: transparent;\n}\n.mat-button .mat-ripple-element, .mat-icon-button .mat-ripple-element, .mat-stroked-button .mat-ripple-element {\n  opacity: 0.1;\n  background-color: currentColor;\n}\n\n.mat-button-focus-overlay {\n  background: black;\n}\n\n.mat-stroked-button:not(.mat-button-disabled) {\n  border-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-flat-button, .mat-raised-button, .mat-fab, .mat-mini-fab {\n  color: rgba(0, 0, 0, 0.87);\n  background-color: white;\n}\n.mat-flat-button.mat-primary, .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {\n  color: white;\n}\n.mat-flat-button.mat-accent, .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {\n  color: white;\n}\n.mat-flat-button.mat-warn, .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {\n  color: white;\n}\n.mat-flat-button.mat-primary.mat-button-disabled, .mat-flat-button.mat-accent.mat-button-disabled, .mat-flat-button.mat-warn.mat-button-disabled, .mat-flat-button.mat-button-disabled.mat-button-disabled, .mat-raised-button.mat-primary.mat-button-disabled, .mat-raised-button.mat-accent.mat-button-disabled, .mat-raised-button.mat-warn.mat-button-disabled, .mat-raised-button.mat-button-disabled.mat-button-disabled, .mat-fab.mat-primary.mat-button-disabled, .mat-fab.mat-accent.mat-button-disabled, .mat-fab.mat-warn.mat-button-disabled, .mat-fab.mat-button-disabled.mat-button-disabled, .mat-mini-fab.mat-primary.mat-button-disabled, .mat-mini-fab.mat-accent.mat-button-disabled, .mat-mini-fab.mat-warn.mat-button-disabled, .mat-mini-fab.mat-button-disabled.mat-button-disabled {\n  color: rgba(0, 0, 0, 0.26);\n}\n.mat-flat-button.mat-primary, .mat-raised-button.mat-primary, .mat-fab.mat-primary, .mat-mini-fab.mat-primary {\n  background-color: #1976d2;\n}\n.mat-flat-button.mat-accent, .mat-raised-button.mat-accent, .mat-fab.mat-accent, .mat-mini-fab.mat-accent {\n  background-color: #d32f2f;\n}\n.mat-flat-button.mat-warn, .mat-raised-button.mat-warn, .mat-fab.mat-warn, .mat-mini-fab.mat-warn {\n  background-color: #f44336;\n}\n.mat-flat-button.mat-primary.mat-button-disabled, .mat-flat-button.mat-accent.mat-button-disabled, .mat-flat-button.mat-warn.mat-button-disabled, .mat-flat-button.mat-button-disabled.mat-button-disabled, .mat-raised-button.mat-primary.mat-button-disabled, .mat-raised-button.mat-accent.mat-button-disabled, .mat-raised-button.mat-warn.mat-button-disabled, .mat-raised-button.mat-button-disabled.mat-button-disabled, .mat-fab.mat-primary.mat-button-disabled, .mat-fab.mat-accent.mat-button-disabled, .mat-fab.mat-warn.mat-button-disabled, .mat-fab.mat-button-disabled.mat-button-disabled, .mat-mini-fab.mat-primary.mat-button-disabled, .mat-mini-fab.mat-accent.mat-button-disabled, .mat-mini-fab.mat-warn.mat-button-disabled, .mat-mini-fab.mat-button-disabled.mat-button-disabled {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n.mat-flat-button.mat-primary .mat-ripple-element, .mat-raised-button.mat-primary .mat-ripple-element, .mat-fab.mat-primary .mat-ripple-element, .mat-mini-fab.mat-primary .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.1);\n}\n.mat-flat-button.mat-accent .mat-ripple-element, .mat-raised-button.mat-accent .mat-ripple-element, .mat-fab.mat-accent .mat-ripple-element, .mat-mini-fab.mat-accent .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.1);\n}\n.mat-flat-button.mat-warn .mat-ripple-element, .mat-raised-button.mat-warn .mat-ripple-element, .mat-fab.mat-warn .mat-ripple-element, .mat-mini-fab.mat-warn .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.1);\n}\n\n.mat-stroked-button:not([class*=mat-elevation-z]), .mat-flat-button:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-raised-button:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);\n}\n.mat-raised-button:not(.mat-button-disabled):active:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);\n}\n.mat-raised-button.mat-button-disabled:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-fab:not([class*=mat-elevation-z]), .mat-mini-fab:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);\n}\n.mat-fab:not(.mat-button-disabled):active:not([class*=mat-elevation-z]), .mat-mini-fab:not(.mat-button-disabled):active:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);\n}\n.mat-fab.mat-button-disabled:not([class*=mat-elevation-z]), .mat-mini-fab.mat-button-disabled:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-button-toggle-standalone,\n.mat-button-toggle-group {\n  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,\n.mat-button-toggle-group-appearance-standard {\n  box-shadow: none;\n}\n\n.mat-button-toggle {\n  color: rgba(0, 0, 0, 0.38);\n}\n.mat-button-toggle .mat-button-toggle-focus-overlay {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-button-toggle-appearance-standard {\n  color: rgba(0, 0, 0, 0.87);\n  background: white;\n}\n.mat-button-toggle-appearance-standard .mat-button-toggle-focus-overlay {\n  background-color: black;\n}\n\n.mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {\n  border-left: solid 1px rgba(0, 0, 0, 0.12);\n}\n\n[dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {\n  border-left: none;\n  border-right: solid 1px rgba(0, 0, 0, 0.12);\n}\n\n.mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle + .mat-button-toggle {\n  border-left: none;\n  border-right: none;\n  border-top: solid 1px rgba(0, 0, 0, 0.12);\n}\n\n.mat-button-toggle-checked {\n  background-color: #e0e0e0;\n  color: rgba(0, 0, 0, 0.54);\n}\n.mat-button-toggle-checked.mat-button-toggle-appearance-standard {\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-button-toggle-disabled {\n  color: rgba(0, 0, 0, 0.26);\n  background-color: #eeeeee;\n}\n.mat-button-toggle-disabled.mat-button-toggle-appearance-standard {\n  background: white;\n}\n.mat-button-toggle-disabled.mat-button-toggle-checked {\n  background-color: #bdbdbd;\n}\n\n.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,\n.mat-button-toggle-group-appearance-standard {\n  border: solid 1px rgba(0, 0, 0, 0.12);\n}\n\n.mat-button-toggle-appearance-standard .mat-button-toggle-label-content {\n  line-height: 48px;\n}\n\n.mat-card {\n  background: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-card:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n}\n.mat-card.mat-card-flat:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-card-subtitle {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-checkbox-frame {\n  border-color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-checkbox-checkmark {\n  fill: #fafafa;\n}\n\n.mat-checkbox-checkmark-path {\n  stroke: #fafafa !important;\n}\n\n.mat-checkbox-mixedmark {\n  background-color: #fafafa;\n}\n\n.mat-checkbox-indeterminate.mat-primary .mat-checkbox-background, .mat-checkbox-checked.mat-primary .mat-checkbox-background {\n  background-color: #1976d2;\n}\n.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background {\n  background-color: #d32f2f;\n}\n.mat-checkbox-indeterminate.mat-warn .mat-checkbox-background, .mat-checkbox-checked.mat-warn .mat-checkbox-background {\n  background-color: #f44336;\n}\n\n.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {\n  background-color: #b0b0b0;\n}\n.mat-checkbox-disabled:not(.mat-checkbox-checked) .mat-checkbox-frame {\n  border-color: #b0b0b0;\n}\n.mat-checkbox-disabled .mat-checkbox-label {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-checkbox .mat-ripple-element {\n  background-color: black;\n}\n\n.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element,\n.mat-checkbox:active:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element {\n  background: #1976d2;\n}\n.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element,\n.mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {\n  background: #d32f2f;\n}\n.mat-checkbox-checked:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element,\n.mat-checkbox:active:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element {\n  background: #f44336;\n}\n\n.mat-chip.mat-standard-chip {\n  background-color: #e0e0e0;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-chip.mat-standard-chip .mat-chip-remove {\n  color: rgba(0, 0, 0, 0.87);\n  opacity: 0.4;\n}\n.mat-chip.mat-standard-chip:not(.mat-chip-disabled):active {\n  box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);\n}\n.mat-chip.mat-standard-chip:not(.mat-chip-disabled) .mat-chip-remove:hover {\n  opacity: 0.54;\n}\n.mat-chip.mat-standard-chip.mat-chip-disabled {\n  opacity: 0.4;\n}\n.mat-chip.mat-standard-chip::after {\n  background: black;\n}\n\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary {\n  background-color: #1976d2;\n  color: white;\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary .mat-chip-remove {\n  color: white;\n  opacity: 0.4;\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-primary .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.1);\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn {\n  background-color: #f44336;\n  color: white;\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn .mat-chip-remove {\n  color: white;\n  opacity: 0.4;\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-warn .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.1);\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent {\n  background-color: #d32f2f;\n  color: white;\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent .mat-chip-remove {\n  color: white;\n  opacity: 0.4;\n}\n.mat-chip.mat-standard-chip.mat-chip-selected.mat-accent .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.1);\n}\n\n.mat-table {\n  background: white;\n}\n\n.mat-table thead, .mat-table tbody, .mat-table tfoot,\nmat-header-row, mat-row, mat-footer-row,\n[mat-header-row], [mat-row], [mat-footer-row],\n.mat-table-sticky {\n  background: inherit;\n}\n\nmat-row, mat-header-row, mat-footer-row,\nth.mat-header-cell, td.mat-cell, td.mat-footer-cell {\n  border-bottom-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-header-cell {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-cell, .mat-footer-cell {\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-calendar-arrow {\n  border-top-color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-datepicker-toggle,\n.mat-datepicker-content .mat-calendar-next-button,\n.mat-datepicker-content .mat-calendar-previous-button {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-calendar-table-header {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-calendar-table-header-divider::after {\n  background: rgba(0, 0, 0, 0.12);\n}\n\n.mat-calendar-body-label {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-calendar-body-cell-content,\n.mat-date-range-input-separator {\n  color: rgba(0, 0, 0, 0.87);\n  border-color: transparent;\n}\n\n.mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-form-field-disabled .mat-date-range-input-separator {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-calendar-body-in-preview {\n  color: rgba(0, 0, 0, 0.24);\n}\n\n.mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n  border-color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-calendar-body-disabled > .mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n  border-color: rgba(0, 0, 0, 0.18);\n}\n\n.mat-calendar-body-in-range::before {\n  background: rgba(25, 118, 210, 0.2);\n}\n\n.mat-calendar-body-comparison-identical,\n.mat-calendar-body-in-comparison-range::before {\n  background: rgba(249, 171, 0, 0.2);\n}\n\n.mat-calendar-body-comparison-bridge-start::before,\n[dir=rtl] .mat-calendar-body-comparison-bridge-end::before {\n  background: linear-gradient(to right, rgba(25, 118, 210, 0.2) 50%, rgba(249, 171, 0, 0.2) 50%);\n}\n\n.mat-calendar-body-comparison-bridge-end::before,\n[dir=rtl] .mat-calendar-body-comparison-bridge-start::before {\n  background: linear-gradient(to left, rgba(25, 118, 210, 0.2) 50%, rgba(249, 171, 0, 0.2) 50%);\n}\n\n.mat-calendar-body-in-range > .mat-calendar-body-comparison-identical,\n.mat-calendar-body-in-comparison-range.mat-calendar-body-in-range::after {\n  background: #a8dab5;\n}\n\n.mat-calendar-body-comparison-identical.mat-calendar-body-selected,\n.mat-calendar-body-in-comparison-range > .mat-calendar-body-selected {\n  background: #46a35e;\n}\n\n.mat-calendar-body-selected {\n  background-color: #1976d2;\n  color: white;\n}\n\n.mat-calendar-body-disabled > .mat-calendar-body-selected {\n  background-color: rgba(25, 118, 210, 0.4);\n}\n\n.mat-calendar-body-today.mat-calendar-body-selected {\n  box-shadow: inset 0 0 0 1px white;\n}\n\n.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),\n.cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),\n.cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n  background-color: rgba(25, 118, 210, 0.3);\n}\n\n.mat-datepicker-content {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n  background-color: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-in-range::before {\n  background: rgba(211, 47, 47, 0.2);\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-comparison-identical,\n.mat-datepicker-content.mat-accent .mat-calendar-body-in-comparison-range::before {\n  background: rgba(249, 171, 0, 0.2);\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-comparison-bridge-start::before,\n.mat-datepicker-content.mat-accent [dir=rtl] .mat-calendar-body-comparison-bridge-end::before {\n  background: linear-gradient(to right, rgba(211, 47, 47, 0.2) 50%, rgba(249, 171, 0, 0.2) 50%);\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-comparison-bridge-end::before,\n.mat-datepicker-content.mat-accent [dir=rtl] .mat-calendar-body-comparison-bridge-start::before {\n  background: linear-gradient(to left, rgba(211, 47, 47, 0.2) 50%, rgba(249, 171, 0, 0.2) 50%);\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-in-range > .mat-calendar-body-comparison-identical,\n.mat-datepicker-content.mat-accent .mat-calendar-body-in-comparison-range.mat-calendar-body-in-range::after {\n  background: #a8dab5;\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-comparison-identical.mat-calendar-body-selected,\n.mat-datepicker-content.mat-accent .mat-calendar-body-in-comparison-range > .mat-calendar-body-selected {\n  background: #46a35e;\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-selected {\n  background-color: #d32f2f;\n  color: white;\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-disabled > .mat-calendar-body-selected {\n  background-color: rgba(211, 47, 47, 0.4);\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-today.mat-calendar-body-selected {\n  box-shadow: inset 0 0 0 1px white;\n}\n.mat-datepicker-content.mat-accent .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),\n.mat-datepicker-content.mat-accent .cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),\n.mat-datepicker-content.mat-accent .cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n  background-color: rgba(211, 47, 47, 0.3);\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-in-range::before {\n  background: rgba(244, 67, 54, 0.2);\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-comparison-identical,\n.mat-datepicker-content.mat-warn .mat-calendar-body-in-comparison-range::before {\n  background: rgba(249, 171, 0, 0.2);\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-comparison-bridge-start::before,\n.mat-datepicker-content.mat-warn [dir=rtl] .mat-calendar-body-comparison-bridge-end::before {\n  background: linear-gradient(to right, rgba(244, 67, 54, 0.2) 50%, rgba(249, 171, 0, 0.2) 50%);\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-comparison-bridge-end::before,\n.mat-datepicker-content.mat-warn [dir=rtl] .mat-calendar-body-comparison-bridge-start::before {\n  background: linear-gradient(to left, rgba(244, 67, 54, 0.2) 50%, rgba(249, 171, 0, 0.2) 50%);\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-in-range > .mat-calendar-body-comparison-identical,\n.mat-datepicker-content.mat-warn .mat-calendar-body-in-comparison-range.mat-calendar-body-in-range::after {\n  background: #a8dab5;\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-comparison-identical.mat-calendar-body-selected,\n.mat-datepicker-content.mat-warn .mat-calendar-body-in-comparison-range > .mat-calendar-body-selected {\n  background: #46a35e;\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-selected {\n  background-color: #f44336;\n  color: white;\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-disabled > .mat-calendar-body-selected {\n  background-color: rgba(244, 67, 54, 0.4);\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-today.mat-calendar-body-selected {\n  box-shadow: inset 0 0 0 1px white;\n}\n.mat-datepicker-content.mat-warn .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),\n.mat-datepicker-content.mat-warn .cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),\n.mat-datepicker-content.mat-warn .cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n  background-color: rgba(244, 67, 54, 0.3);\n}\n\n.mat-datepicker-content-touch {\n  box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);\n}\n\n.mat-datepicker-toggle-active {\n  color: #1976d2;\n}\n.mat-datepicker-toggle-active.mat-accent {\n  color: #d32f2f;\n}\n.mat-datepicker-toggle-active.mat-warn {\n  color: #f44336;\n}\n\n.mat-date-range-input-inner[disabled] {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-dialog-container {\n  box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);\n  background: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-divider {\n  border-top-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-divider-vertical {\n  border-right-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-expansion-panel {\n  background: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-expansion-panel:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-action-row {\n  border-top-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-expansion-panel .mat-expansion-panel-header.cdk-keyboard-focused:not([aria-disabled=true]), .mat-expansion-panel .mat-expansion-panel-header.cdk-program-focused:not([aria-disabled=true]), .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover:not([aria-disabled=true]) {\n  background: rgba(0, 0, 0, 0.04);\n}\n\n@media (hover: none) {\n  .mat-expansion-panel:not(.mat-expanded):not([aria-disabled=true]) .mat-expansion-panel-header:hover {\n    background: white;\n  }\n}\n.mat-expansion-panel-header-title {\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-expansion-panel-header-description,\n.mat-expansion-indicator::after {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-expansion-panel-header[aria-disabled=true] {\n  color: rgba(0, 0, 0, 0.26);\n}\n.mat-expansion-panel-header[aria-disabled=true] .mat-expansion-panel-header-title,\n.mat-expansion-panel-header[aria-disabled=true] .mat-expansion-panel-header-description {\n  color: inherit;\n}\n\n.mat-expansion-panel-header {\n  height: 48px;\n}\n.mat-expansion-panel-header.mat-expanded {\n  height: 64px;\n}\n\n.mat-form-field-label {\n  color: rgba(0, 0, 0, 0.6);\n}\n\n.mat-hint {\n  color: rgba(0, 0, 0, 0.6);\n}\n\n.mat-form-field.mat-focused .mat-form-field-label {\n  color: #1976d2;\n}\n.mat-form-field.mat-focused .mat-form-field-label.mat-accent {\n  color: #d32f2f;\n}\n.mat-form-field.mat-focused .mat-form-field-label.mat-warn {\n  color: #f44336;\n}\n\n.mat-focused .mat-form-field-required-marker {\n  color: #d32f2f;\n}\n\n.mat-form-field-ripple {\n  background-color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-form-field.mat-focused .mat-form-field-ripple {\n  background-color: #1976d2;\n}\n.mat-form-field.mat-focused .mat-form-field-ripple.mat-accent {\n  background-color: #d32f2f;\n}\n.mat-form-field.mat-focused .mat-form-field-ripple.mat-warn {\n  background-color: #f44336;\n}\n\n.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) .mat-form-field-infix::after {\n  color: #1976d2;\n}\n.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-accent .mat-form-field-infix::after {\n  color: #d32f2f;\n}\n.mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid).mat-warn .mat-form-field-infix::after {\n  color: #f44336;\n}\n\n.mat-form-field.mat-form-field-invalid .mat-form-field-label {\n  color: #f44336;\n}\n.mat-form-field.mat-form-field-invalid .mat-form-field-label.mat-accent,\n.mat-form-field.mat-form-field-invalid .mat-form-field-label .mat-form-field-required-marker {\n  color: #f44336;\n}\n.mat-form-field.mat-form-field-invalid .mat-form-field-ripple,\n.mat-form-field.mat-form-field-invalid .mat-form-field-ripple.mat-accent {\n  background-color: #f44336;\n}\n\n.mat-error {\n  color: #f44336;\n}\n\n.mat-form-field-appearance-legacy .mat-form-field-label {\n  color: rgba(0, 0, 0, 0.54);\n}\n.mat-form-field-appearance-legacy .mat-hint {\n  color: rgba(0, 0, 0, 0.54);\n}\n.mat-form-field-appearance-legacy .mat-form-field-underline {\n  background-color: rgba(0, 0, 0, 0.42);\n}\n.mat-form-field-appearance-legacy.mat-form-field-disabled .mat-form-field-underline {\n  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%);\n  background-size: 4px 100%;\n  background-repeat: repeat-x;\n}\n\n.mat-form-field-appearance-standard .mat-form-field-underline {\n  background-color: rgba(0, 0, 0, 0.42);\n}\n.mat-form-field-appearance-standard.mat-form-field-disabled .mat-form-field-underline {\n  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%);\n  background-size: 4px 100%;\n  background-repeat: repeat-x;\n}\n\n.mat-form-field-appearance-fill .mat-form-field-flex {\n  background-color: rgba(0, 0, 0, 0.04);\n}\n.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-flex {\n  background-color: rgba(0, 0, 0, 0.02);\n}\n.mat-form-field-appearance-fill .mat-form-field-underline::before {\n  background-color: rgba(0, 0, 0, 0.42);\n}\n.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label {\n  color: rgba(0, 0, 0, 0.38);\n}\n.mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-underline::before {\n  background-color: transparent;\n}\n\n.mat-form-field-appearance-outline .mat-form-field-outline {\n  color: rgba(0, 0, 0, 0.12);\n}\n.mat-form-field-appearance-outline .mat-form-field-outline-thick {\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick {\n  color: #1976d2;\n}\n.mat-form-field-appearance-outline.mat-focused.mat-accent .mat-form-field-outline-thick {\n  color: #d32f2f;\n}\n.mat-form-field-appearance-outline.mat-focused.mat-warn .mat-form-field-outline-thick {\n  color: #f44336;\n}\n.mat-form-field-appearance-outline.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick {\n  color: #f44336;\n}\n.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label {\n  color: rgba(0, 0, 0, 0.38);\n}\n.mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-outline {\n  color: rgba(0, 0, 0, 0.06);\n}\n\n.mat-icon.mat-primary {\n  color: #1976d2;\n}\n.mat-icon.mat-accent {\n  color: #d32f2f;\n}\n.mat-icon.mat-warn {\n  color: #f44336;\n}\n\n.mat-form-field-type-mat-native-select .mat-form-field-infix::after {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-input-element:disabled,\n.mat-form-field-type-mat-native-select.mat-form-field-disabled .mat-form-field-infix::after {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-input-element {\n  caret-color: #1976d2;\n}\n.mat-input-element::placeholder {\n  color: rgba(0, 0, 0, 0.42);\n}\n.mat-input-element::-moz-placeholder {\n  color: rgba(0, 0, 0, 0.42);\n}\n.mat-input-element::-webkit-input-placeholder {\n  color: rgba(0, 0, 0, 0.42);\n}\n.mat-input-element:-ms-input-placeholder {\n  color: rgba(0, 0, 0, 0.42);\n}\n\n.mat-form-field.mat-accent .mat-input-element {\n  caret-color: #d32f2f;\n}\n\n.mat-form-field.mat-warn .mat-input-element,\n.mat-form-field-invalid .mat-input-element {\n  caret-color: #f44336;\n}\n\n.mat-form-field-type-mat-native-select.mat-form-field-invalid .mat-form-field-infix::after {\n  color: #f44336;\n}\n\n.mat-list-base .mat-list-item {\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-list-base .mat-list-option {\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-list-base .mat-subheader {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-list-item-disabled {\n  background-color: #eeeeee;\n}\n\n.mat-list-option:hover, .mat-list-option:focus,\n.mat-nav-list .mat-list-item:hover,\n.mat-nav-list .mat-list-item:focus,\n.mat-action-list .mat-list-item:hover,\n.mat-action-list .mat-list-item:focus {\n  background: rgba(0, 0, 0, 0.04);\n}\n\n.mat-list-single-selected-option, .mat-list-single-selected-option:hover, .mat-list-single-selected-option:focus {\n  background: rgba(0, 0, 0, 0.12);\n}\n\n.mat-menu-panel {\n  background: white;\n}\n.mat-menu-panel:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-menu-item {\n  background: transparent;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-menu-item[disabled], .mat-menu-item[disabled]::after,\n.mat-menu-item[disabled] .mat-icon-no-color {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-menu-item .mat-icon-no-color,\n.mat-menu-item-submenu-trigger::after {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-menu-item:hover:not([disabled]),\n.mat-menu-item.cdk-program-focused:not([disabled]),\n.mat-menu-item.cdk-keyboard-focused:not([disabled]),\n.mat-menu-item-highlighted:not([disabled]) {\n  background: rgba(0, 0, 0, 0.04);\n}\n\n.mat-paginator {\n  background: white;\n}\n\n.mat-paginator,\n.mat-paginator-page-size .mat-select-trigger {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-paginator-decrement,\n.mat-paginator-increment {\n  border-top: 2px solid rgba(0, 0, 0, 0.54);\n  border-right: 2px solid rgba(0, 0, 0, 0.54);\n}\n\n.mat-paginator-first,\n.mat-paginator-last {\n  border-top: 2px solid rgba(0, 0, 0, 0.54);\n}\n\n.mat-icon-button[disabled] .mat-paginator-decrement,\n.mat-icon-button[disabled] .mat-paginator-increment,\n.mat-icon-button[disabled] .mat-paginator-first,\n.mat-icon-button[disabled] .mat-paginator-last {\n  border-color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-paginator-container {\n  min-height: 56px;\n}\n\n.mat-progress-bar-background {\n  fill: #c2d9f0;\n}\n\n.mat-progress-bar-buffer {\n  background-color: #c2d9f0;\n}\n\n.mat-progress-bar-fill::after {\n  background-color: #1976d2;\n}\n\n.mat-progress-bar.mat-accent .mat-progress-bar-background {\n  fill: #f0c7c7;\n}\n.mat-progress-bar.mat-accent .mat-progress-bar-buffer {\n  background-color: #f0c7c7;\n}\n.mat-progress-bar.mat-accent .mat-progress-bar-fill::after {\n  background-color: #d32f2f;\n}\n\n.mat-progress-bar.mat-warn .mat-progress-bar-background {\n  fill: #f9ccc9;\n}\n.mat-progress-bar.mat-warn .mat-progress-bar-buffer {\n  background-color: #f9ccc9;\n}\n.mat-progress-bar.mat-warn .mat-progress-bar-fill::after {\n  background-color: #f44336;\n}\n\n.mat-progress-spinner circle, .mat-spinner circle {\n  stroke: #1976d2;\n}\n.mat-progress-spinner.mat-accent circle, .mat-spinner.mat-accent circle {\n  stroke: #d32f2f;\n}\n.mat-progress-spinner.mat-warn circle, .mat-spinner.mat-warn circle {\n  stroke: #f44336;\n}\n\n.mat-radio-outer-circle {\n  border-color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-radio-button.mat-primary.mat-radio-checked .mat-radio-outer-circle {\n  border-color: #1976d2;\n}\n.mat-radio-button.mat-primary .mat-radio-inner-circle,\n.mat-radio-button.mat-primary .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), .mat-radio-button.mat-primary.mat-radio-checked .mat-radio-persistent-ripple, .mat-radio-button.mat-primary:active .mat-radio-persistent-ripple {\n  background-color: #1976d2;\n}\n.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {\n  border-color: #d32f2f;\n}\n.mat-radio-button.mat-accent .mat-radio-inner-circle,\n.mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-persistent-ripple, .mat-radio-button.mat-accent:active .mat-radio-persistent-ripple {\n  background-color: #d32f2f;\n}\n.mat-radio-button.mat-warn.mat-radio-checked .mat-radio-outer-circle {\n  border-color: #f44336;\n}\n.mat-radio-button.mat-warn .mat-radio-inner-circle,\n.mat-radio-button.mat-warn .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), .mat-radio-button.mat-warn.mat-radio-checked .mat-radio-persistent-ripple, .mat-radio-button.mat-warn:active .mat-radio-persistent-ripple {\n  background-color: #f44336;\n}\n.mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-outer-circle,\n.mat-radio-button.mat-radio-disabled .mat-radio-outer-circle {\n  border-color: rgba(0, 0, 0, 0.38);\n}\n.mat-radio-button.mat-radio-disabled .mat-radio-ripple .mat-ripple-element,\n.mat-radio-button.mat-radio-disabled .mat-radio-inner-circle {\n  background-color: rgba(0, 0, 0, 0.38);\n}\n.mat-radio-button.mat-radio-disabled .mat-radio-label-content {\n  color: rgba(0, 0, 0, 0.38);\n}\n.mat-radio-button .mat-ripple-element {\n  background-color: black;\n}\n\n.mat-select-value {\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-select-placeholder {\n  color: rgba(0, 0, 0, 0.42);\n}\n\n.mat-select-disabled .mat-select-value {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-select-arrow {\n  color: rgba(0, 0, 0, 0.54);\n}\n\n.mat-select-panel {\n  background: white;\n}\n.mat-select-panel:not([class*=mat-elevation-z]) {\n  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);\n}\n.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) {\n  background: rgba(0, 0, 0, 0.12);\n}\n\n.mat-form-field.mat-focused.mat-primary .mat-select-arrow {\n  color: #1976d2;\n}\n.mat-form-field.mat-focused.mat-accent .mat-select-arrow {\n  color: #d32f2f;\n}\n.mat-form-field.mat-focused.mat-warn .mat-select-arrow {\n  color: #f44336;\n}\n.mat-form-field .mat-select.mat-select-invalid .mat-select-arrow {\n  color: #f44336;\n}\n.mat-form-field .mat-select.mat-select-disabled .mat-select-arrow {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-drawer-container {\n  background-color: #fafafa;\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-drawer {\n  background-color: white;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-drawer.mat-drawer-push {\n  background-color: white;\n}\n.mat-drawer:not(.mat-drawer-side) {\n  box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);\n}\n\n.mat-drawer-side {\n  border-right: solid 1px rgba(0, 0, 0, 0.12);\n}\n.mat-drawer-side.mat-drawer-end {\n  border-left: solid 1px rgba(0, 0, 0, 0.12);\n  border-right: none;\n}\n\n[dir=rtl] .mat-drawer-side {\n  border-left: solid 1px rgba(0, 0, 0, 0.12);\n  border-right: none;\n}\n[dir=rtl] .mat-drawer-side.mat-drawer-end {\n  border-left: none;\n  border-right: solid 1px rgba(0, 0, 0, 0.12);\n}\n\n.mat-drawer-backdrop.mat-drawer-shown {\n  background-color: rgba(0, 0, 0, 0.6);\n}\n\n.mat-slide-toggle.mat-checked .mat-slide-toggle-thumb {\n  background-color: #d32f2f;\n}\n.mat-slide-toggle.mat-checked .mat-slide-toggle-bar {\n  background-color: rgba(211, 47, 47, 0.54);\n}\n.mat-slide-toggle.mat-checked .mat-ripple-element {\n  background-color: #d32f2f;\n}\n.mat-slide-toggle.mat-primary.mat-checked .mat-slide-toggle-thumb {\n  background-color: #1976d2;\n}\n.mat-slide-toggle.mat-primary.mat-checked .mat-slide-toggle-bar {\n  background-color: rgba(25, 118, 210, 0.54);\n}\n.mat-slide-toggle.mat-primary.mat-checked .mat-ripple-element {\n  background-color: #1976d2;\n}\n.mat-slide-toggle.mat-warn.mat-checked .mat-slide-toggle-thumb {\n  background-color: #f44336;\n}\n.mat-slide-toggle.mat-warn.mat-checked .mat-slide-toggle-bar {\n  background-color: rgba(244, 67, 54, 0.54);\n}\n.mat-slide-toggle.mat-warn.mat-checked .mat-ripple-element {\n  background-color: #f44336;\n}\n.mat-slide-toggle:not(.mat-checked) .mat-ripple-element {\n  background-color: black;\n}\n\n.mat-slide-toggle-thumb {\n  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n  background-color: #fafafa;\n}\n\n.mat-slide-toggle-bar {\n  background-color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-slider-track-background {\n  background-color: rgba(0, 0, 0, 0.26);\n}\n\n.mat-primary .mat-slider-track-fill,\n.mat-primary .mat-slider-thumb,\n.mat-primary .mat-slider-thumb-label {\n  background-color: #1976d2;\n}\n.mat-primary .mat-slider-thumb-label-text {\n  color: white;\n}\n.mat-primary .mat-slider-focus-ring {\n  background-color: rgba(25, 118, 210, 0.2);\n}\n\n.mat-accent .mat-slider-track-fill,\n.mat-accent .mat-slider-thumb,\n.mat-accent .mat-slider-thumb-label {\n  background-color: #d32f2f;\n}\n.mat-accent .mat-slider-thumb-label-text {\n  color: white;\n}\n.mat-accent .mat-slider-focus-ring {\n  background-color: rgba(211, 47, 47, 0.2);\n}\n\n.mat-warn .mat-slider-track-fill,\n.mat-warn .mat-slider-thumb,\n.mat-warn .mat-slider-thumb-label {\n  background-color: #f44336;\n}\n.mat-warn .mat-slider-thumb-label-text {\n  color: white;\n}\n.mat-warn .mat-slider-focus-ring {\n  background-color: rgba(244, 67, 54, 0.2);\n}\n\n.mat-slider:hover .mat-slider-track-background,\n.cdk-focused .mat-slider-track-background {\n  background-color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-slider-disabled .mat-slider-track-background,\n.mat-slider-disabled .mat-slider-track-fill,\n.mat-slider-disabled .mat-slider-thumb {\n  background-color: rgba(0, 0, 0, 0.26);\n}\n.mat-slider-disabled:hover .mat-slider-track-background {\n  background-color: rgba(0, 0, 0, 0.26);\n}\n\n.mat-slider-min-value .mat-slider-focus-ring {\n  background-color: rgba(0, 0, 0, 0.12);\n}\n.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb,\n.mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label {\n  background-color: rgba(0, 0, 0, 0.87);\n}\n.mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb,\n.mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label {\n  background-color: rgba(0, 0, 0, 0.26);\n}\n.mat-slider-min-value:not(.mat-slider-thumb-label-showing) .mat-slider-thumb {\n  border-color: rgba(0, 0, 0, 0.26);\n  background-color: transparent;\n}\n.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused .mat-slider-thumb {\n  border-color: rgba(0, 0, 0, 0.38);\n}\n.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover.mat-slider-disabled .mat-slider-thumb, .mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused.mat-slider-disabled .mat-slider-thumb {\n  border-color: rgba(0, 0, 0, 0.26);\n}\n\n.mat-slider-has-ticks .mat-slider-wrapper::after {\n  border-color: rgba(0, 0, 0, 0.7);\n}\n\n.mat-slider-horizontal .mat-slider-ticks {\n  background-image: repeating-linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);\n  background-image: -moz-repeating-linear-gradient(0.0001deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);\n}\n\n.mat-slider-vertical .mat-slider-ticks {\n  background-image: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);\n}\n\n.mat-step-header.cdk-keyboard-focused, .mat-step-header.cdk-program-focused, .mat-step-header:hover {\n  background-color: rgba(0, 0, 0, 0.04);\n}\n@media (hover: none) {\n  .mat-step-header:hover {\n    background: none;\n  }\n}\n.mat-step-header .mat-step-label,\n.mat-step-header .mat-step-optional {\n  color: rgba(0, 0, 0, 0.54);\n}\n.mat-step-header .mat-step-icon {\n  background-color: rgba(0, 0, 0, 0.54);\n  color: white;\n}\n.mat-step-header .mat-step-icon-selected,\n.mat-step-header .mat-step-icon-state-done,\n.mat-step-header .mat-step-icon-state-edit {\n  background-color: #1976d2;\n  color: white;\n}\n.mat-step-header.mat-accent .mat-step-icon {\n  color: white;\n}\n.mat-step-header.mat-accent .mat-step-icon-selected,\n.mat-step-header.mat-accent .mat-step-icon-state-done,\n.mat-step-header.mat-accent .mat-step-icon-state-edit {\n  background-color: #d32f2f;\n  color: white;\n}\n.mat-step-header.mat-warn .mat-step-icon {\n  color: white;\n}\n.mat-step-header.mat-warn .mat-step-icon-selected,\n.mat-step-header.mat-warn .mat-step-icon-state-done,\n.mat-step-header.mat-warn .mat-step-icon-state-edit {\n  background-color: #f44336;\n  color: white;\n}\n.mat-step-header .mat-step-icon-state-error {\n  background-color: transparent;\n  color: #f44336;\n}\n.mat-step-header .mat-step-label.mat-step-label-active {\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-step-header .mat-step-label.mat-step-label-error {\n  color: #f44336;\n}\n\n.mat-stepper-horizontal, .mat-stepper-vertical {\n  background-color: white;\n}\n\n.mat-stepper-vertical-line::before {\n  border-left-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-horizontal-stepper-header::before,\n.mat-horizontal-stepper-header::after,\n.mat-stepper-horizontal-line {\n  border-top-color: rgba(0, 0, 0, 0.12);\n}\n\n.mat-horizontal-stepper-header {\n  height: 72px;\n}\n\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header,\n.mat-vertical-stepper-header {\n  padding: 24px 24px;\n}\n\n.mat-stepper-vertical-line::before {\n  top: -16px;\n  bottom: -16px;\n}\n\n.mat-stepper-label-position-bottom .mat-horizontal-stepper-header::after, .mat-stepper-label-position-bottom .mat-horizontal-stepper-header::before {\n  top: 36px;\n}\n\n.mat-stepper-label-position-bottom .mat-stepper-horizontal-line {\n  top: 36px;\n}\n\n.mat-sort-header-arrow {\n  color: #757575;\n}\n\n.mat-tab-nav-bar,\n.mat-tab-header {\n  border-bottom: 1px solid rgba(0, 0, 0, 0.12);\n}\n\n.mat-tab-group-inverted-header .mat-tab-nav-bar,\n.mat-tab-group-inverted-header .mat-tab-header {\n  border-top: 1px solid rgba(0, 0, 0, 0.12);\n  border-bottom: none;\n}\n\n.mat-tab-label, .mat-tab-link {\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {\n  color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-tab-header-pagination-chevron {\n  border-color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n  border-color: rgba(0, 0, 0, 0.38);\n}\n\n.mat-tab-group[class*=mat-background-] .mat-tab-header,\n.mat-tab-nav-bar[class*=mat-background-] {\n  border-bottom: none;\n  border-top: none;\n}\n\n.mat-tab-group.mat-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n  background-color: rgba(30, 136, 229, 0.3);\n}\n.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar {\n  background-color: #1976d2;\n}\n.mat-tab-group.mat-primary.mat-background-primary > .mat-tab-header .mat-ink-bar, .mat-tab-group.mat-primary.mat-background-primary > .mat-tab-link-container .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary > .mat-tab-header .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary > .mat-tab-link-container .mat-ink-bar {\n  background-color: white;\n}\n.mat-tab-group.mat-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n  background-color: rgba(229, 57, 53, 0.3);\n}\n.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar {\n  background-color: #d32f2f;\n}\n.mat-tab-group.mat-accent.mat-background-accent > .mat-tab-header .mat-ink-bar, .mat-tab-group.mat-accent.mat-background-accent > .mat-tab-link-container .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent > .mat-tab-header .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent > .mat-tab-link-container .mat-ink-bar {\n  background-color: white;\n}\n.mat-tab-group.mat-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n  background-color: rgba(255, 205, 210, 0.3);\n}\n.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar {\n  background-color: #f44336;\n}\n.mat-tab-group.mat-warn.mat-background-warn > .mat-tab-header .mat-ink-bar, .mat-tab-group.mat-warn.mat-background-warn > .mat-tab-link-container .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn > .mat-tab-header .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn > .mat-tab-link-container .mat-ink-bar {\n  background-color: white;\n}\n.mat-tab-group.mat-background-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-background-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-primary .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-primary .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-primary .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-primary .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n  background-color: rgba(30, 136, 229, 0.3);\n}\n.mat-tab-group.mat-background-primary > .mat-tab-header, .mat-tab-group.mat-background-primary > .mat-tab-link-container, .mat-tab-group.mat-background-primary > .mat-tab-header-pagination, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header, .mat-tab-nav-bar.mat-background-primary > .mat-tab-link-container, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header-pagination {\n  background-color: #1976d2;\n}\n.mat-tab-group.mat-background-primary > .mat-tab-header .mat-tab-label, .mat-tab-group.mat-background-primary > .mat-tab-link-container .mat-tab-link, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header .mat-tab-label, .mat-tab-nav-bar.mat-background-primary > .mat-tab-link-container .mat-tab-link {\n  color: white;\n}\n.mat-tab-group.mat-background-primary > .mat-tab-header .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary > .mat-tab-link-container .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary > .mat-tab-link-container .mat-tab-link.mat-tab-disabled {\n  color: rgba(255, 255, 255, 0.4);\n}\n.mat-tab-group.mat-background-primary > .mat-tab-header .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-primary > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-primary > .mat-tab-link-container .mat-focus-indicator::before,\n.mat-tab-group.mat-background-primary > .mat-tab-header .mat-focus-indicator::before, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-primary > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-primary > .mat-tab-link-container .mat-focus-indicator::before,\n.mat-tab-nav-bar.mat-background-primary > .mat-tab-header .mat-focus-indicator::before {\n  border-color: white;\n}\n.mat-tab-group.mat-background-primary > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-primary > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-primary > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n  border-color: rgba(255, 255, 255, 0.4);\n}\n.mat-tab-group.mat-background-primary > .mat-tab-header .mat-ripple-element,\n.mat-tab-group.mat-background-primary > .mat-tab-link-container .mat-ripple-element,\n.mat-tab-group.mat-background-primary > .mat-tab-header-pagination .mat-ripple-element, .mat-tab-nav-bar.mat-background-primary > .mat-tab-header .mat-ripple-element,\n.mat-tab-nav-bar.mat-background-primary > .mat-tab-link-container .mat-ripple-element,\n.mat-tab-nav-bar.mat-background-primary > .mat-tab-header-pagination .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.12);\n}\n.mat-tab-group.mat-background-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-background-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-accent .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-accent .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-accent .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-accent .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n  background-color: rgba(229, 57, 53, 0.3);\n}\n.mat-tab-group.mat-background-accent > .mat-tab-header, .mat-tab-group.mat-background-accent > .mat-tab-link-container, .mat-tab-group.mat-background-accent > .mat-tab-header-pagination, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header, .mat-tab-nav-bar.mat-background-accent > .mat-tab-link-container, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header-pagination {\n  background-color: #d32f2f;\n}\n.mat-tab-group.mat-background-accent > .mat-tab-header .mat-tab-label, .mat-tab-group.mat-background-accent > .mat-tab-link-container .mat-tab-link, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header .mat-tab-label, .mat-tab-nav-bar.mat-background-accent > .mat-tab-link-container .mat-tab-link {\n  color: white;\n}\n.mat-tab-group.mat-background-accent > .mat-tab-header .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent > .mat-tab-link-container .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent > .mat-tab-link-container .mat-tab-link.mat-tab-disabled {\n  color: rgba(255, 255, 255, 0.4);\n}\n.mat-tab-group.mat-background-accent > .mat-tab-header .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-accent > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-accent > .mat-tab-link-container .mat-focus-indicator::before,\n.mat-tab-group.mat-background-accent > .mat-tab-header .mat-focus-indicator::before, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-accent > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-accent > .mat-tab-link-container .mat-focus-indicator::before,\n.mat-tab-nav-bar.mat-background-accent > .mat-tab-header .mat-focus-indicator::before {\n  border-color: white;\n}\n.mat-tab-group.mat-background-accent > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-accent > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-accent > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n  border-color: rgba(255, 255, 255, 0.4);\n}\n.mat-tab-group.mat-background-accent > .mat-tab-header .mat-ripple-element,\n.mat-tab-group.mat-background-accent > .mat-tab-link-container .mat-ripple-element,\n.mat-tab-group.mat-background-accent > .mat-tab-header-pagination .mat-ripple-element, .mat-tab-nav-bar.mat-background-accent > .mat-tab-header .mat-ripple-element,\n.mat-tab-nav-bar.mat-background-accent > .mat-tab-link-container .mat-ripple-element,\n.mat-tab-nav-bar.mat-background-accent > .mat-tab-header-pagination .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.12);\n}\n.mat-tab-group.mat-background-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-group.mat-background-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-group.mat-background-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-warn .mat-tab-label.cdk-keyboard-focused:not(.mat-tab-disabled), .mat-tab-nav-bar.mat-background-warn .mat-tab-label.cdk-program-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-warn .mat-tab-link.cdk-keyboard-focused:not(.mat-tab-disabled),\n.mat-tab-nav-bar.mat-background-warn .mat-tab-link.cdk-program-focused:not(.mat-tab-disabled) {\n  background-color: rgba(255, 205, 210, 0.3);\n}\n.mat-tab-group.mat-background-warn > .mat-tab-header, .mat-tab-group.mat-background-warn > .mat-tab-link-container, .mat-tab-group.mat-background-warn > .mat-tab-header-pagination, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header, .mat-tab-nav-bar.mat-background-warn > .mat-tab-link-container, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header-pagination {\n  background-color: #f44336;\n}\n.mat-tab-group.mat-background-warn > .mat-tab-header .mat-tab-label, .mat-tab-group.mat-background-warn > .mat-tab-link-container .mat-tab-link, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header .mat-tab-label, .mat-tab-nav-bar.mat-background-warn > .mat-tab-link-container .mat-tab-link {\n  color: white;\n}\n.mat-tab-group.mat-background-warn > .mat-tab-header .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn > .mat-tab-link-container .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn > .mat-tab-link-container .mat-tab-link.mat-tab-disabled {\n  color: rgba(255, 255, 255, 0.4);\n}\n.mat-tab-group.mat-background-warn > .mat-tab-header .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-warn > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-warn > .mat-tab-link-container .mat-focus-indicator::before,\n.mat-tab-group.mat-background-warn > .mat-tab-header .mat-focus-indicator::before, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-warn > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-warn > .mat-tab-link-container .mat-focus-indicator::before,\n.mat-tab-nav-bar.mat-background-warn > .mat-tab-header .mat-focus-indicator::before {\n  border-color: white;\n}\n.mat-tab-group.mat-background-warn > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n.mat-tab-group.mat-background-warn > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n.mat-tab-nav-bar.mat-background-warn > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n  border-color: rgba(255, 255, 255, 0.4);\n}\n.mat-tab-group.mat-background-warn > .mat-tab-header .mat-ripple-element,\n.mat-tab-group.mat-background-warn > .mat-tab-link-container .mat-ripple-element,\n.mat-tab-group.mat-background-warn > .mat-tab-header-pagination .mat-ripple-element, .mat-tab-nav-bar.mat-background-warn > .mat-tab-header .mat-ripple-element,\n.mat-tab-nav-bar.mat-background-warn > .mat-tab-link-container .mat-ripple-element,\n.mat-tab-nav-bar.mat-background-warn > .mat-tab-header-pagination .mat-ripple-element {\n  background-color: rgba(255, 255, 255, 0.12);\n}\n\n.mat-toolbar {\n  background: whitesmoke;\n  color: rgba(0, 0, 0, 0.87);\n}\n.mat-toolbar.mat-primary {\n  background: #1976d2;\n  color: white;\n}\n.mat-toolbar.mat-accent {\n  background: #d32f2f;\n  color: white;\n}\n.mat-toolbar.mat-warn {\n  background: #f44336;\n  color: white;\n}\n.mat-toolbar .mat-form-field-underline,\n.mat-toolbar .mat-form-field-ripple,\n.mat-toolbar .mat-focused .mat-form-field-ripple {\n  background-color: currentColor;\n}\n.mat-toolbar .mat-form-field-label,\n.mat-toolbar .mat-focused .mat-form-field-label,\n.mat-toolbar .mat-select-value,\n.mat-toolbar .mat-select-arrow,\n.mat-toolbar .mat-form-field.mat-focused .mat-select-arrow {\n  color: inherit;\n}\n.mat-toolbar .mat-input-element {\n  caret-color: currentColor;\n}\n\n.mat-toolbar-multiple-rows {\n  min-height: 64px;\n}\n\n.mat-toolbar-row, .mat-toolbar-single-row {\n  height: 64px;\n}\n\n@media (max-width: 599px) {\n  .mat-toolbar-multiple-rows {\n    min-height: 56px;\n  }\n\n  .mat-toolbar-row, .mat-toolbar-single-row {\n    height: 56px;\n  }\n}\n.mat-tooltip {\n  background: rgba(97, 97, 97, 0.9);\n}\n\n.mat-tree {\n  background: white;\n}\n\n.mat-tree-node,\n.mat-nested-tree-node {\n  color: rgba(0, 0, 0, 0.87);\n}\n\n.mat-tree-node {\n  min-height: 48px;\n}\n\n.mat-snack-bar-container {\n  color: rgba(255, 255, 255, 0.7);\n  background: #323232;\n  box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);\n}\n\n.mat-simple-snackbar-action {\n  color: #d32f2f;\n}\n\n/* ==============================\n   BASE STYLES\n   ============================== */\nhtml {\n  font-size: 62.5%;\n}\n\nbody {\n  font-family: \"Roboto\", \"Helvetica Neue Light\", \"Helvetica Neue\", Helvetica, Arial, \"Lucida Grande\", sans-serif;\n  margin: 0;\n  color: #444444;\n  font-size: 16px;\n  font-size: 1.6rem;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\nh1, h2, h3, h4, h5, h6 {\n  color: #333333;\n  margin-bottom: 0;\n  font-weight: 500;\n}\n\nh1 {\n  font-size: 40px;\n  font-size: 4rem;\n  display: inline-block;\n  margin: 1.6rem 0;\n}\n@media screen and (max-width: 600px) {\n  h1 {\n    margin-top: 0;\n  }\n}\n\nh2 {\n  border-top: 1px solid #DBDBDB;\n  clear: both;\n  font-size: 32px;\n  font-size: 3.2rem;\n  margin-top: 4rem;\n  padding-top: 4rem;\n}\n.page-about h2, .page-contribute h2, .page-events h2, .page-features h2, .page-home h2, .page-presskit h2, .page-resources h2, .page-api h2 {\n  border-top: 0;\n  margin-top: 2rem;\n  padding-top: 0;\n}\n\nh3 {\n  font-size: 24px;\n  font-size: 2.4rem;\n  margin-top: 3rem;\n  clear: both;\n}\n\nh4 {\n  font-size: 20px;\n  font-size: 2rem;\n  margin-top: 3rem;\n  clear: both;\n}\n\nh5 {\n  font-size: 18px;\n  font-size: 1.8rem;\n  margin-top: 2rem;\n  clear: both;\n}\n\nh6 {\n  font-size: 16px;\n  font-size: 1.6rem;\n  color: #6E6E6E;\n  margin-top: 2rem;\n  clear: both;\n}\n\nh2 a,\nh3 a,\nh4 a,\nh5 a,\nh6 a {\n  font-size: inherit;\n}\n@media screen and (max-width: 600px) {\n  h2,\nh3,\nh4,\nh5,\nh6 {\n    margin: 8px 0;\n  }\n}\n\n.mat-tab-body-wrapper h2 {\n  margin-top: 0;\n}\n\np,\nol,\nul,\nli,\ninput,\na {\n  font-size: 16px;\n  font-size: 1.6rem;\n  line-height: 32px;\n  line-height: 3.2rem;\n  font-family: inherit;\n  font-weight: 400;\n  color: #444444;\n}\np > em,\nol > em,\nul > em,\nli > em,\ninput > em,\na > em {\n  letter-spacing: 0.3px;\n  letter-spacing: 0.03rem;\n}\n\np {\n  margin: 1em 0;\n}\n\np + ul {\n  margin-top: 4px;\n}\n\nol li,\nol p {\n  margin: 4px 0;\n}\n\nol ol {\n  list-style-type: lower-alpha;\n}\nol ol ol {\n  list-style-type: lower-roman;\n}\n\nli {\n  padding-bottom: 8px;\n  line-height: 24px;\n  line-height: 2.4rem;\n}\nli p {\n  margin: 0;\n}\n\na {\n  text-decoration: none;\n}\n\n.app-toolbar a {\n  font-size: 16px;\n  font-size: 1.6rem;\n  font-weight: 400;\n  color: #FFFFFF;\n  font-family: \"Roboto\", \"Helvetica Neue Light\", \"Helvetica Neue\", Helvetica, Arial, \"Lucida Grande\", sans-serif;\n  text-transform: uppercase;\n}\n\nstrong {\n  font-weight: 500;\n}\n\ntable {\n  border-collapse: collapse;\n  border-radius: 2px;\n  border-spacing: 0;\n  margin: 12px 0 32px;\n}\n\ntable tbody th {\n  max-width: 100px;\n  padding: 13px 32px;\n  text-align: left;\n}\n\ntd {\n  font-weight: 400;\n  padding: 8px 30px;\n}\ntd > p:first-child,\ntd ul:first-child {\n  margin-top: 0;\n}\ntd > p:last-child,\ntd ul:last-child {\n  margin-bottom: 0;\n}\n\nth {\n  font-size: 16px;\n  font-size: 1.6rem;\n  font-weight: 500;\n  padding: 13px 32px;\n  text-align: left;\n}\n\ncode {\n  font-family: \"Roboto Mono\", monospace;\n  font-size: 90%;\n  color: #444444;\n}\n\n.sidenav-content a {\n  color: #1976D2;\n}\n.sidenav-content a:hover {\n  text-decoration: underline;\n}\n\n.folder-api aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-api aio-doc-viewer :not(.github-links) > a[href^=\"https:\"], .folder-cli aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-cli aio-doc-viewer :not(.github-links) > a[href^=\"https:\"], .folder-docs aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-docs aio-doc-viewer :not(.github-links) > a[href^=\"https:\"], .folder-errors aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-errors aio-doc-viewer :not(.github-links) > a[href^=\"https:\"], .folder-guide aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-guide aio-doc-viewer :not(.github-links) > a[href^=\"https:\"], .folder-start aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-start aio-doc-viewer :not(.github-links) > a[href^=\"https:\"], .folder-tutorial aio-doc-viewer :not(.github-links) > a[href^=\"http:\"], .folder-tutorial aio-doc-viewer :not(.github-links) > a[href^=\"https:\"] {\n  display: inline-flex;\n  padding-right: calc(1em + 0.25rem);\n  position: relative;\n}\n.folder-api aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-api aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after, .folder-cli aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-cli aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after, .folder-docs aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-docs aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after, .folder-errors aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-errors aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after, .folder-guide aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-guide aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after, .folder-start aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-start aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after, .folder-tutorial aio-doc-viewer :not(.github-links) > a[href^=\"http:\"]::after, .folder-tutorial aio-doc-viewer :not(.github-links) > a[href^=\"https:\"]::after {\n  content: \"open_in_new\";\n  font-family: \"Material Icons\";\n  position: absolute;\n  right: 0;\n}\n\n.error-text {\n  color: #DD0031;\n}\n\n/* ==============================\n   LAYOUT STYLES\n   ============================== */\n.sidenav-container {\n  width: 100%;\n  height: 100vh;\n}\n\n.sidenav-content {\n  display: block;\n  min-height: 100vh;\n  padding: 80px 3rem 2rem;\n  max-width: 50em;\n  margin: 0 auto;\n}\n@media screen and (max-width: 600px) {\n  .sidenav-content {\n    min-height: 450px;\n    padding: 80px 2rem 1rem;\n  }\n}\n@media screen and (max-width: 480px) {\n  .sidenav-content {\n    padding: 80px 1rem 1rem;\n  }\n}\n.page-about .sidenav-content, .page-contribute .sidenav-content, .page-events .sidenav-content, .page-features .sidenav-content, .page-home .sidenav-content, .page-presskit .sidenav-content, .page-resources .sidenav-content, .page-api .sidenav-content, .page-file-not-found .sidenav-content, .page-guide-cheatsheet .sidenav-content {\n  max-width: none;\n}\n\n.sidenav-content button {\n  min-width: 24px;\n}\n\n@media (max-width: 600px) {\n  aio-menu {\n    display: none;\n  }\n}\n\n.no-animations aio-doc-viewer > * {\n  transition: none !important;\n}\n\nfooter {\n  position: relative;\n  line-height: 24px;\n  line-height: 2.4rem;\n  flex: 1;\n  padding: 48px;\n  z-index: 0;\n  background-color: #1976D2;\n  font-weight: 300;\n}\nfooter aio-footer {\n  position: relative;\n  z-index: 0;\n}\nfooter aio-footer > * {\n  color: #FFFFFF;\n  max-width: 50em;\n}\nfooter aio-footer .footer-block {\n  margin: 0 24px;\n  vertical-align: top;\n}\nfooter aio-footer a {\n  color: #FFFFFF;\n  text-decoration: none;\n  z-index: 20;\n  position: relative;\n}\nfooter aio-footer a:hover {\n  text-decoration: underline;\n}\nfooter aio-footer a:visited {\n  text-decoration: none;\n}\nfooter aio-footer a:focus {\n  outline: 1px solid rgba(255, 255, 255, 0.8);\n  outline-offset: 2px;\n}\nfooter aio-footer h3 {\n  font-size: 16px;\n  font-size: 1.6rem;\n  text-transform: uppercase;\n  font-weight: 400;\n  margin: 8px 0 12px;\n  color: #FFFFFF;\n}\n@media (max-width: 600px) {\n  footer aio-footer h3 {\n    font-size: 14px;\n    font-size: 1.4rem;\n  }\n}\nfooter aio-footer p {\n  text-align: center;\n  margin: 10px auto 5px;\n}\n@media (max-width: 480px) {\n  footer aio-footer p {\n    text-align: left;\n  }\n}\nfooter aio-footer div.grid-fluid {\n  display: -ms-flexbox;\n  display: -webkit-flex;\n  display: flex;\n  justify-content: center;\n  text-align: left;\n  margin: 0 auto 40px;\n}\nfooter aio-footer div.grid-fluid ul {\n  list-style-position: inside;\n  padding: 0px;\n  margin: 0px;\n}\nfooter aio-footer div.grid-fluid ul li {\n  list-style-type: none;\n  padding: 4px 0;\n  text-align: left;\n}\n@media (max-width: 480px) {\n  footer aio-footer div.grid-fluid {\n    flex-direction: column;\n  }\n  footer aio-footer div.grid-fluid .footer-block {\n    margin: 8px 24px;\n  }\n}\nfooter::after {\n  content: \"\";\n  position: absolute;\n  z-index: -1;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: url(\"/assets/images/logos/angular/angular_whiteTransparent_withMargin.png\") top 0 left 0 repeat, url(\"/assets/images/logos/angular/angular_whiteTransparent_withMargin.png\") top 80px left 160px repeat;\n  opacity: 0.05;\n  background-size: 320px auto;\n}\n\nhtml, body {\n  height: 100%;\n}\n\nbody,\n.content {\n  background-color: #FFFFFF;\n}\n\n.center-layout {\n  margin: 0 auto;\n  max-width: 62.5em;\n}\n\n.center-layout-wide {\n  margin: 0 auto;\n  max-width: 84em;\n}\n\n.github-links + .content h1 {\n  max-width: 90%;\n}\n\n.clear {\n  clear: both;\n}\n\n.l-flex-wrap {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n.flex-center {\n  display: flex;\n  justify-content: center;\n}\n\n.center {\n  text-align: center;\n}\n\n.visually-hidden {\n  position: absolute !important;\n  top: -9999px !important;\n  left: -9999px !important;\n}\n\n.hero {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  position: absolute;\n  width: 100%;\n  min-height: 480px;\n  height: 80vh;\n  max-height: 560px;\n  box-sizing: border-box;\n  padding: 48px 48px 32px 48px;\n  overflow: hidden;\n  transform: skewY(8deg);\n  transform-origin: 100%;\n}\n@media (max-width: 480px) {\n  .hero {\n    max-height: 486px;\n    padding-top: 40px;\n    transform: none;\n  }\n}\n.hero .hero-title {\n  display: inline-block;\n  font-size: 28px;\n  font-size: 2.8rem;\n  font-weight: 400;\n  line-height: 48px;\n  line-height: 4.8rem;\n  margin: 0 8px 0 0;\n  text-transform: uppercase;\n}\n.hero .hero-title.is-standard-case {\n  text-transform: none;\n}\n\nsection#intro {\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 900px;\n  height: 480px;\n  margin: 0 auto -32px;\n  padding: 48px 0 0;\n  color: #FFFFFF;\n}\n@media (max-width: 780px) {\n  section#intro {\n    flex-direction: column;\n    justify-content: center;\n    width: 100%;\n    max-width: 100vw;\n    padding: 40px 0 32px;\n  }\n  section#intro button {\n    margin: 0;\n    height: 60px;\n  }\n}\nsection#intro .homepage-container {\n  width: 100%;\n  max-width: 1040px;\n  margin: 0 auto;\n  margin-top: -7%;\n  padding-top: 0;\n  padding-bottom: 0;\n}\n@media (max-width: 780px) {\n  section#intro .homepage-container {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 100%;\n    max-width: 100%;\n    padding: 0;\n  }\n}\nsection#intro .hero-headline {\n  font-size: 40px;\n  font-size: 4rem;\n  line-height: 64px;\n  line-height: 6.4rem;\n  font-weight: 500;\n  margin: 32px 0;\n}\nsection#intro .hero-headline:after {\n  display: none;\n}\n@media (max-width: 780px) {\n  section#intro .hero-headline {\n    text-align: center;\n  }\n}\n@media (max-width: 575px) {\n  section#intro .hero-headline {\n    font-size: 32px;\n    font-size: 3.2rem;\n    line-height: 50px;\n    line-height: 5rem;\n  }\n}\nsection#intro .hero-logo {\n  display: flex;\n}\n@media (max-width: 780px) {\n  section#intro .hero-logo {\n    justify-content: center;\n  }\n}\nsection#intro .hero-logo img {\n  width: 400px;\n  height: 400px;\n  margin-bottom: 8px;\n  max-width: none;\n  padding: 0;\n  filter: drop-shadow(0 2px 2px rgba(10, 16, 20, 0.24));\n}\n@media (max-width: 780px) {\n  section#intro .hero-logo img {\n    width: 250px;\n    height: 250px;\n  }\n}\n\n.announcement-bar {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  justify-content: space-around;\n  align-items: center;\n  max-width: 50vw;\n  margin: 0 auto;\n  padding: 16px;\n  background-color: #FFFFFF;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  box-sizing: border-box;\n  transition: all 0.3s ease-in;\n}\n@media (max-width: 991px) {\n  .announcement-bar {\n    flex-direction: column;\n    text-align: center;\n    padding: 32px 16px;\n  }\n}\n@media (max-width: 768px) {\n  .announcement-bar {\n    width: 100%;\n    max-width: none;\n  }\n}\n.announcement-bar > * {\n  margin: 8px;\n}\n.announcement-bar .button {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 40px;\n  min-width: 160px;\n  font-size: 16px;\n  font-size: 1.6rem;\n  color: #FFFFFF;\n  background-color: #1976D2;\n  border-radius: 48px;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);\n  box-sizing: border-box;\n  cursor: pointer;\n}\n.announcement-bar .button:hover {\n  color: rgba(255, 255, 255, 0.7);\n}\n.announcement-bar .material-icons {\n  display: none;\n  right: 0;\n  position: static;\n  transition: all 0.3s ease-in;\n  font-size: 16px;\n  font-size: 1.6rem;\n}\n.announcement-bar p {\n  font-size: 16px;\n  font-size: 1.6rem;\n  margin: 8px;\n  text-align: center;\n}\n\n.background-sky {\n  background-color: #1976D2;\n  background: linear-gradient(145deg, #0D47A1, #42A5F5);\n  color: #FFFFFF;\n}\n\n.home-row .card {\n  height: 70%;\n  width: auto;\n  background-color: #FFFFFF;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  box-sizing: border-box;\n  transition: box-shadow 0.5s;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  position: relative;\n  width: 70%;\n  min-width: 350px;\n  height: auto;\n  margin: auto;\n  padding: 24px;\n  box-shadow: 0 6px 6px rgba(10, 16, 20, 0.15), 0 0 52px rgba(10, 16, 20, 0.12);\n}\n.home-row .card:hover {\n  box-shadow: 0 8px 8px rgba(10, 16, 20, 0.24), 0 0 8px rgba(10, 16, 20, 0.12);\n  text-decoration: none;\n}\n@media (max-width: 600px) {\n  .home-row .card {\n    margin: 16px auto 0;\n  }\n  .home-row .card h2 {\n    margin: 0;\n  }\n  .home-row .card img {\n    max-width: none;\n    height: 70px;\n  }\n}\n@media (max-width: 1300px) {\n  .home-row .card img {\n    height: 70px;\n    max-width: none;\n  }\n}\n.home-row .card img {\n  margin: 16px;\n}\n.home-row .card .card-text-container {\n  margin: 0 16px;\n}\n.home-row .card .card-text-container p {\n  text-align: left;\n  color: #444444;\n  margin: 0;\n  padding: 8px 0;\n}\n.home-row .card:hover h2 {\n  color: #1976D2;\n}\n\n.button.hero-cta {\n  padding: 2px 34px 0;\n  font-size: 18px;\n  font-size: 1.8rem;\n  font-weight: 600;\n  line-height: 40px;\n  line-height: 4rem;\n  background-color: #FFFFFF;\n  border-radius: 48px;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);\n  box-sizing: border-box;\n  cursor: pointer;\n}\n.button.hero-cta:hover {\n  opacity: 0.9;\n}\n\n.page-about .sidenav-content, .page-contribute .sidenav-content, .page-events .sidenav-content, .page-features .sidenav-content, .page-home .sidenav-content, .page-presskit .sidenav-content, .page-resources .sidenav-content {\n  padding: 0 0 3rem;\n}\n.page-about article, .page-contribute article, .page-events article, .page-features article, .page-home article, .page-presskit article, .page-resources article {\n  padding: 3rem;\n}\n@media (max-width: 800px) {\n  .page-about article, .page-contribute article, .page-events article, .page-features article, .page-home article, .page-presskit article, .page-resources article {\n    padding: 2.2rem;\n  }\n}\n\n.page-home .sidenav-content {\n  padding-bottom: 0;\n}\n\n.cta-bar.announcement-bar {\n  background: none;\n  box-shadow: none;\n}\n.cta-bar .hero-cta {\n  color: #1976D2;\n}\n\n.text-headline {\n  font-size: 20px;\n  font-size: 2rem;\n  font-weight: 500;\n  color: #1976D2;\n  margin-top: 10px;\n  text-transform: uppercase;\n}\n\naio-shell:not(.view-SideNav) mat-sidenav-container.sidenav-container {\n  max-width: none;\n}\n\ndiv[layout=row] {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  box-sizing: border-box;\n}\n@media (max-width: 480px) {\n  div[layout=row] {\n    display: block;\n  }\n}\n\n.layout-row {\n  flex-direction: row;\n}\n\n.home-rows {\n  overflow: hidden;\n}\n@media (max-width: 600px) {\n  .home-rows {\n    margin: 0;\n  }\n}\n\n.background-superhero-paper {\n  background-size: 100%;\n  background-blend-mode: multiply;\n}\n\n.home-row {\n  max-width: 920px;\n  margin: 32px auto;\n}\n.home-row .promo-img-container, .home-row .text-container {\n  max-width: 50%;\n}\n@media (max-width: 480px) {\n  .home-row .promo-img-container, .home-row .text-container {\n    max-width: 100%;\n    text-align: center;\n  }\n  .home-row .promo-img-container:nth-child(even), .home-row .text-container:nth-child(even) {\n    flex-direction: column-reverse;\n  }\n}\n.home-row .text-block {\n  padding-right: 15%;\n}\n@media (max-width: 600px) {\n  .home-row .text-block {\n    padding: 0;\n  }\n}\n.home-row .promo-img-container p {\n  margin: 0 20px;\n}\n.home-row .promo-img-container img {\n  max-width: 90% !important;\n}\n\n.marketing-banner {\n  background-color: #378fe7;\n  margin-top: 64px;\n  padding: 32px;\n}\n@media (max-width: 600px) {\n  .marketing-banner {\n    margin-top: 56px;\n    padding: 18px;\n  }\n}\n.marketing-banner .banner-headline {\n  text-transform: uppercase;\n  font-size: 24px;\n  font-size: 2.4rem;\n  font-weight: 300;\n  color: #FFFFFF;\n  margin: 0;\n  -webkit-margin-before: 0;\n  -webkit-margin-after: 0;\n}\n@media (max-width: 600px) {\n  .marketing-banner .banner-headline {\n    font-size: 18px;\n    font-size: 1.8rem;\n    font-weight: 400;\n  }\n}\n.marketing-banner .banner-headline:after {\n  display: none;\n}\n.page-features .marketing-banner {\n  margin-bottom: 20px;\n}\n\n.nf-container {\n  align-items: center;\n  padding: 32px;\n}\n\n.nf-response {\n  margin: 32px;\n  height: 100%;\n  flex-direction: column;\n}\n.nf-response h1 {\n  font-size: 48px;\n  font-size: 4.8rem;\n  color: #1976D2;\n  text-transform: uppercase;\n  margin: 8px 0;\n}\n\n.nf-icon.material-icons {\n  color: #1976D2;\n  font-size: 100px;\n  font-size: 10rem;\n  position: static;\n}\n\n.starting.mat-drawer-transition .mat-drawer-content {\n  transition: none;\n}\n\nmat-sidenav-container.sidenav-container {\n  background-color: #FFFFFF;\n  min-height: 100%;\n  height: auto !important;\n  max-width: 100%;\n  margin: 0;\n  transform: none;\n}\nmat-sidenav-container.sidenav-container.has-floating-toc {\n  max-width: 82%;\n}\nmat-sidenav-container.sidenav-container .sidenav-content {\n  height: auto;\n}\nmat-sidenav-container.sidenav-container mat-sidenav.sidenav {\n  position: fixed;\n  top: 64px;\n  bottom: 0;\n  left: 0;\n  min-width: 260px;\n  background-color: #F2F2F2;\n  border-right: 1px solid #DBDBDB;\n}\n@media (max-width: 599px) {\n  mat-sidenav-container.sidenav-container mat-sidenav.sidenav {\n    top: 56px;\n  }\n}\nmat-sidenav-container.sidenav-container mat-sidenav.sidenav .doc-version {\n  padding: 8px;\n  border-top: 1px solid #DBDBDB;\n}\n\naio-nav-menu {\n  display: block;\n  margin: 0 auto;\n  max-width: 268px;\n}\naio-nav-menu:first-of-type {\n  margin-top: 16px;\n}\naio-nav-menu:last-of-type {\n  margin-bottom: 16px;\n}\naio-nav-menu ul, aio-nav-menu a {\n  margin: 0;\n}\naio-nav-menu aio-nav-item .vertical-menu-item {\n  box-sizing: border-box;\n  color: #444444;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  overflow-wrap: break-word;\n  padding: 8px;\n  text-decoration: none;\n  text-align: left;\n  width: 100%;\n  word-wrap: break-word;\n}\naio-nav-menu aio-nav-item .vertical-menu-item:hover {\n  background-color: #DBDBDB;\n  color: #1976D2;\n  text-shadow: 0 0 5px #FFFFFF;\n}\naio-nav-menu aio-nav-item .vertical-menu-item:focus {\n  outline: #1E88E5 auto 2px;\n}\naio-nav-menu aio-nav-item .vertical-menu-item.selected {\n  color: #1669bb;\n}\naio-nav-menu aio-nav-item .vertical-menu-item span {\n  padding-right: 32px;\n}\naio-nav-menu aio-nav-item .vertical-menu-item .mat-icon {\n  height: 24px;\n  width: 24px;\n}\naio-nav-menu aio-nav-item button.vertical-menu-item {\n  border: none;\n  background-color: transparent;\n  margin: 0;\n  width: 100%;\n}\naio-nav-menu aio-nav-item .heading-children.expanded {\n  visibility: visible;\n  opacity: 1;\n  padding-left: 0;\n  max-height: 4000px;\n  transition: visibility 500ms, opacity 500ms, max-height 500ms;\n  transition-timing-function: ease-in-out;\n}\naio-nav-menu aio-nav-item .heading-children.collapsed {\n  overflow: hidden;\n  visibility: hidden;\n  padding-left: 0;\n  opacity: 0;\n  max-height: 1px;\n  transition: visibility 275ms, opacity 275ms, max-height 280ms;\n  transition-timing-function: ease-out;\n}\n.no-animations aio-nav-menu aio-nav-item .heading-children.expanded, .no-animations aio-nav-menu aio-nav-item .heading-children.collapsed {\n  transition: none !important;\n}\naio-nav-menu aio-nav-item .level-1 {\n  font-size: 16px;\n  font-size: 1.6rem;\n  line-height: 28px;\n  line-height: 2.8rem;\n  font-weight: 400;\n  padding-left: 20px;\n  margin: 0;\n  transition: background-color 0.2s;\n}\naio-nav-menu aio-nav-item .level-2 {\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  font-weight: 400;\n  margin: 0;\n  padding-left: 36px;\n}\naio-nav-menu aio-nav-item .level-3 {\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  margin: 0;\n  padding-left: 44px;\n}\naio-nav-menu aio-nav-item .level-4 {\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  margin: 0;\n  padding-left: 52px;\n}\naio-nav-menu aio-nav-item .level-1.collapsed > .mat-icon, aio-nav-menu aio-nav-item .level-2.collapsed > .mat-icon, aio-nav-menu aio-nav-item .level-3.collapsed > .mat-icon {\n  -moz-transform: rotate(0deg);\n  -webkit-transform: rotate(0deg);\n  -o-transform: rotate(0deg);\n  -ms-transform: rotate(0deg);\n  transform: rotate(0deg);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\naio-nav-menu aio-nav-item .level-1.expanded > .mat-icon, aio-nav-menu aio-nav-item .level-2.expanded > .mat-icon, aio-nav-menu aio-nav-item .level-3.expanded > .mat-icon {\n  -moz-transform: rotate(90deg);\n  -webkit-transform: rotate(90deg);\n  -o-transform: rotate(90deg);\n  -ms-transform: rotate(90deg);\n  transform: rotate(90deg);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\n\nmat-toolbar.app-toolbar {\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  z-index: 10;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n}\n.page-home mat-toolbar.app-toolbar {\n  background-color: #1976D2;\n}\n@media (min-width: 481px) {\n  .page-home mat-toolbar.app-toolbar:not(.transitioning) {\n    background-color: transparent;\n    box-shadow: none;\n    position: absolute;\n    transition: background-color 0.2s linear;\n  }\n}\n@media (min-width: 1048px) {\n  .folder-api mat-toolbar.app-toolbar .hamburger, .folder-cli mat-toolbar.app-toolbar .hamburger, .folder-docs mat-toolbar.app-toolbar .hamburger, .folder-errors mat-toolbar.app-toolbar .hamburger, .folder-guide mat-toolbar.app-toolbar .hamburger, .folder-start mat-toolbar.app-toolbar .hamburger, .folder-tutorial mat-toolbar.app-toolbar .hamburger {\n    margin: 0 8px 0 0;\n  }\n}\n\nmat-toolbar.app-toolbar mat-toolbar-row {\n  padding: 0 16px 0 0;\n}\nmat-toolbar.app-toolbar mat-icon {\n  color: #FFFFFF;\n}\nmat-toolbar.app-toolbar .hamburger {\n  height: 100%;\n  margin: 0 8px 0 0;\n  padding: 0;\n}\n@media (min-width: 1048px) {\n  mat-toolbar.app-toolbar .hamburger {\n    margin: 0 16px 0 -64px;\n  }\n}\n@media (max-width: 480px) {\n  mat-toolbar.app-toolbar .hamburger {\n    min-width: 15%;\n  }\n}\nmat-toolbar.app-toolbar .hamburger:not(.starting) {\n  transition-duration: 0.4s;\n  transition-property: color, margin;\n  transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);\n}\nmat-toolbar.app-toolbar .hamburger:hover {\n  color: #FAFAFA;\n}\nmat-toolbar.app-toolbar .hamburger .mat-icon {\n  color: #FFFFFF;\n  position: inherit;\n}\nmat-toolbar.app-toolbar .nav-link.home {\n  cursor: pointer;\n  margin: 0 16px 0 0;\n  padding: 8px 0;\n}\nmat-toolbar.app-toolbar .nav-link.home:focus {\n  outline: 1px solid rgba(255, 255, 255, 0.8);\n  outline-offset: 4px;\n}\n@media screen and (max-width: 1047px) {\n  mat-toolbar.app-toolbar .nav-link.home {\n    padding: 4px 0;\n  }\n}\n@media screen and (max-width: 480px) {\n  mat-toolbar.app-toolbar .nav-link.home {\n    margin-right: 8px;\n  }\n}\nmat-toolbar.app-toolbar .nav-link.home img {\n  position: relative;\n  margin-top: -21px;\n  top: 12px;\n  height: 40px;\n}\n@media (max-width: 1047px) {\n  mat-toolbar.app-toolbar .nav-link.home img:hover {\n    transform: scale(1.1);\n  }\n}\nmat-toolbar.app-toolbar aio-top-menu {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 80%;\n}\nmat-toolbar.app-toolbar aio-top-menu ul {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  list-style-position: inside;\n  padding: 0px;\n  margin: 0px;\n}\nmat-toolbar.app-toolbar aio-top-menu ul li {\n  padding-bottom: 2px;\n  list-style-type: none;\n  cursor: pointer;\n}\nmat-toolbar.app-toolbar aio-top-menu ul li:focus {\n  outline: none;\n}\nmat-toolbar.app-toolbar aio-top-menu ul li a.nav-link {\n  margin: 0 4px;\n  padding: 0px;\n  cursor: pointer;\n}\nmat-toolbar.app-toolbar aio-top-menu ul li a.nav-link .nav-link-inner {\n  border-radius: 4px;\n  padding: 8px 16px;\n}\nmat-toolbar.app-toolbar aio-top-menu ul li a.nav-link .nav-link-inner:hover {\n  background: rgba(255, 255, 255, 0.15);\n}\nmat-toolbar.app-toolbar aio-top-menu ul li a.nav-link:focus {\n  outline: none;\n}\nmat-toolbar.app-toolbar aio-top-menu ul li a.nav-link:focus .nav-link-inner {\n  background: rgba(255, 255, 255, 0.15);\n  border-radius: 1px;\n  box-shadow: 0 0 1px 2px rgba(255, 255, 255, 0.8);\n}\nmat-toolbar.app-toolbar aio-top-menu ul li a.nav-link:active .nav-link-inner {\n  background: rgba(255, 255, 255, 0.15);\n}\nmat-toolbar.app-toolbar aio-top-menu ul li.selected a.nav-link .nav-link-inner {\n  background: rgba(255, 255, 255, 0.15);\n}\nmat-toolbar.app-toolbar aio-search-box.search-container {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  width: 100%;\n  min-width: 150px;\n  height: 100%;\n  margin-right: 16px;\n}\nmat-toolbar.app-toolbar aio-search-box.search-container input {\n  color: #444444;\n  border: none;\n  border-radius: 100px;\n  background-color: #FFFFFF;\n  padding: 5px 16px;\n  margin-left: 8px;\n  width: 180px;\n  max-width: 240px;\n  height: 50%;\n  -webkit-appearance: none;\n}\nmat-toolbar.app-toolbar aio-search-box.search-container input:focus {\n  outline: none;\n}\nmat-toolbar.app-toolbar aio-search-box.search-container input:-ms-input-placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\nmat-toolbar.app-toolbar aio-search-box.search-container input::-ms-input-placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\nmat-toolbar.app-toolbar aio-search-box.search-container input::-webkit-input-placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\nmat-toolbar.app-toolbar aio-search-box.search-container input::placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\n@media (min-width: 1000px) {\n  mat-toolbar.app-toolbar aio-search-box.search-container input {\n    transition: width 0.4s ease-in-out;\n  }\n  mat-toolbar.app-toolbar aio-search-box.search-container input:focus {\n    width: 80%;\n  }\n}\n@media (max-width: 480px) {\n  mat-toolbar.app-toolbar aio-search-box.search-container input {\n    width: 150px;\n  }\n}\nmat-toolbar.app-toolbar .toolbar-external-icons-container {\n  display: flex;\n  flex-direction: row;\n  flex-shrink: 0;\n  height: 100%;\n}\nmat-toolbar.app-toolbar .toolbar-external-icons-container a {\n  display: flex;\n  align-items: center;\n  padding: 24px;\n  margin: 0 -16px;\n}\nmat-toolbar.app-toolbar .toolbar-external-icons-container a:focus {\n  outline: 1px solid rgba(255, 255, 255, 0.8);\n  outline-offset: -16px;\n}\n@media screen and (max-width: 480px) {\n  mat-toolbar.app-toolbar .toolbar-external-icons-container a {\n    margin: 0 0 0 8px;\n    padding: 0;\n  }\n}\nmat-toolbar.app-toolbar .toolbar-external-icons-container a:hover {\n  opacity: 0.8;\n}\nmat-toolbar.app-toolbar .toolbar-external-icons-container a img {\n  height: 24px;\n}\n\n/* ==============================\n   MODULE STYLES\n   ============================== */\n.alert, .callout {\n  padding: 16px;\n  margin: 24px 0px;\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #444444;\n  width: 100%;\n  box-sizing: border-box;\n  clear: both;\n}\n.alert h1, .callout h1, .alert h2, .callout h2, .alert h3, .callout h3, .alert h4, .callout h4, .alert h5, .callout h5, .alert h6, .callout h6 {\n  font-weight: 500;\n}\n.alert.is-critical, .is-critical.callout {\n  border-left: 8px solid #DD0031;\n  background-color: rgba(221, 0, 49, 0.05);\n}\n.alert.is-critical h1, .is-critical.callout h1, .alert.is-critical h2, .is-critical.callout h2, .alert.is-critical h3, .is-critical.callout h3, .alert.is-critical h4, .is-critical.callout h4, .alert.is-critical h5, .is-critical.callout h5, .alert.is-critical h6, .is-critical.callout h6 {\n  color: #DD0031;\n}\n.alert.is-important, .is-important.callout {\n  border-left: 8px solid #FF9800;\n  background-color: rgba(255, 152, 0, 0.05);\n}\n.alert.is-important h1, .is-important.callout h1, .alert.is-important h2, .is-important.callout h2, .alert.is-important h3, .is-important.callout h3, .alert.is-important h4, .is-important.callout h4, .alert.is-important h5, .is-important.callout h5, .alert.is-important h6, .is-important.callout h6 {\n  color: #FF9800;\n}\n.alert.is-helpful, .is-helpful.callout {\n  border-left: 8px solid #1976D2;\n  background-color: rgba(25, 118, 210, 0.05);\n}\n.alert.is-helpful h1, .is-helpful.callout h1, .alert.is-helpful h2, .is-helpful.callout h2, .alert.is-helpful h3, .is-helpful.callout h3, .alert.is-helpful h4, .is-helpful.callout h4, .alert.is-helpful h5, .is-helpful.callout h5, .alert.is-helpful h6, .is-helpful.callout h6 {\n  color: #1976D2;\n}\n.alert.archive-warning, .archive-warning.callout {\n  background-color: #C3002F;\n  border-radius: 4px;\n  margin-bottom: 1rem;\n}\n.alert.archive-warning *, .archive-warning.callout * {\n  color: #FFFFFF;\n}\n.alert.archive-warning a, .archive-warning.callout a {\n  color: #FFFFFF;\n  font-weight: bold;\n  text-decoration: underline;\n}\n.alert.archive-warning a:hover, .archive-warning.callout a:hover {\n  opacity: 0.9;\n}\n.alert > *, .callout > * {\n  margin: 8px 16px;\n}\n\n/* API LIST STYLES */\naio-api-list {\n  /* LAYOUT */\n}\naio-api-list .api-filter {\n  display: flex;\n  margin: 0 auto;\n  /* API FILTER MENU */\n  /* API SEARCH ICON */\n}\n@media (max-width: 600px) {\n  aio-api-list .api-filter {\n    flex-direction: column;\n    margin: 16px auto;\n  }\n}\naio-api-list .api-filter aio-select {\n  width: 200px;\n}\n@media screen and (max-width: 600px) {\n  aio-api-list .api-filter aio-select {\n    width: 100%;\n  }\n}\naio-api-list .api-filter .form-select-menu,\naio-api-list .api-filter .form-search {\n  margin: 8px;\n}\n@media screen and (max-width: 600px) {\n  aio-api-list .api-filter .form-select-menu,\naio-api-list .api-filter .form-search {\n    margin-left: 0;\n  }\n}\naio-api-list .api-filter aio-select:first-child .form-select-menu {\n  margin-left: 0;\n}\naio-api-list .api-filter .form-search {\n  position: relative;\n  float: left;\n}\naio-api-list .api-filter .form-search input {\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  box-sizing: border-box;\n  border: 1px solid #FFFFFF;\n  border-radius: 4px;\n  color: #444444;\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 32px;\n  line-height: 3.2rem;\n  outline: none;\n  padding: 4px 16px 4px 32px;\n  transition: all 0.2s;\n  width: 182px;\n}\naio-api-list .api-filter .form-search input:-ms-input-placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\naio-api-list .api-filter .form-search input::-ms-input-placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\naio-api-list .api-filter .form-search input::-webkit-input-placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\naio-api-list .api-filter .form-search input::placeholder {\n  font-size: 14px;\n  font-size: 1.4rem;\n  color: #6E6E6E;\n}\naio-api-list .api-filter .form-search input:focus {\n  border: 1px solid #42A5F5;\n  box-shadow: 0 2px 2px rgba(66, 165, 245, 0.24), 0 0 2px rgba(66, 165, 245, 0.12);\n}\n@media screen and (max-width: 600px) {\n  aio-api-list .api-filter .form-search input {\n    width: 100%;\n  }\n}\naio-api-list .api-filter .form-search .material-icons {\n  color: #546E7A;\n  font-size: 20px;\n  font-size: 2rem;\n  left: 8px;\n  pointer-events: none;\n  position: absolute;\n  top: 12px;\n  width: 20px;\n  z-index: 1;\n}\naio-api-list .api-filter .material-icons {\n  right: 48px;\n}\naio-api-list .api-list-container {\n  display: flex;\n  flex-direction: column;\n  padding: 16px 0;\n  position: relative;\n  /* API CLASS LIST */\n}\n@media handheld and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 800px) {\n  aio-api-list .api-list-container {\n    padding: 24px 0 0;\n  }\n}\naio-api-list .api-list-container h2 {\n  margin-top: 16px;\n  margin-bottom: 16px;\n}\naio-api-list .api-list-container .api-list {\n  list-style: none;\n  margin: 0 0 32px -8px;\n  padding: 0;\n  overflow: hidden;\n}\n@media screen and (max-width: 600px) {\n  aio-api-list .api-list-container .api-list {\n    margin: 0 0 0 -8px;\n  }\n}\naio-api-list .api-list-container .api-list li {\n  font-size: 14px;\n  font-size: 1.4rem;\n  margin: 8px 0;\n  line-height: 14px;\n  line-height: 1.4rem;\n  padding: 0;\n  float: left;\n  width: 33%;\n  overflow: hidden;\n  min-width: 330px;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\naio-api-list .api-list-container .api-list li a {\n  color: #546E7A;\n  line-height: 16px;\n  line-height: 1.6rem;\n  padding: 0 16px;\n  text-decoration: none;\n  transition: all 0.3s;\n}\naio-api-list .api-list-container .api-list li a:hover {\n  background: #ECEFF1;\n  color: #2196F3;\n}\naio-api-list .api-list-container .api-list li a.deprecated-api-item {\n  text-decoration: line-through;\n}\n\n.api-body {\n  max-width: 1200px;\n}\n.api-body h1 {\n  margin-top: -4px;\n}\n.api-body details.overloads {\n  box-shadow: none;\n}\n.api-body details.overloads .icon-action-header {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n}\n.api-body details.overloads .icon-action-header a {\n  display: flex;\n}\n.api-body details.overloads .detail-contents {\n  padding: 0;\n  border: 1px solid #DBDBDB;\n  border-radius: 2px;\n  box-shadow: none;\n}\n.api-body details.overloads .detail-contents > *:not(hr) {\n  margin: 16px 24px;\n}\n.api-body details.overloads summary {\n  height: inherit;\n  padding: 0;\n}\n.api-body details.overloads summary h4 {\n  margin: 0;\n  clear: left;\n}\n.api-body details.overloads summary .actions {\n  display: flex;\n  color: #1976D2;\n  font-size: 14px;\n  font-size: 1.4rem;\n}\n.api-body details.overloads summary .show-all {\n  display: initial;\n}\n.api-body details.overloads summary .collapse-all {\n  display: none;\n}\n.api-body details.overloads[open] > summary .show-all {\n  display: none;\n}\n.api-body details.overloads[open] > summary .collapse-all {\n  display: initial;\n}\n.api-body details.overload {\n  box-shadow: none;\n  margin: 0;\n}\n.api-body table {\n  margin: 12px 0 24px;\n}\n.api-body table.item-table td {\n  padding: 32px;\n}\n.api-body table.list-table td {\n  padding: 16px 24px;\n}\n.api-body table.parameters-table {\n  margin-top: 0;\n  font-size: 14px;\n  font-size: 1.4rem;\n  box-shadow: none;\n}\n@media screen and (max-width: 480px) {\n  .api-body table.parameters-table tr {\n    display: flex;\n    flex-direction: column;\n  }\n}\n.api-body table.parameters-table tr td:first-child {\n  font-weight: 600;\n  padding-left: 16px;\n  width: 20%;\n}\n.api-body table.parameters-table td {\n  padding: 8px 8px 8px 0;\n  border: 0;\n  vertical-align: top;\n}\n.api-body table.property-table td {\n  vertical-align: top;\n}\n.api-body table.method-table td > code, .api-body table.option-table td > code, .api-body table.list-table td > code {\n  background-color: inherit;\n  white-space: pre-wrap;\n}\n.api-body table.method-table .with-github-links, .api-body table.option-table .with-github-links, .api-body table.list-table .with-github-links {\n  align-items: center;\n  display: flex;\n  justify-content: space-between;\n}\n.api-body table.method-table .with-github-links .github-links a, .api-body table.option-table .with-github-links .github-links a, .api-body table.list-table .with-github-links .github-links a {\n  color: #6E6E6E;\n}\n.api-body table.method-table .with-github-links .github-links a .material-icons:hover, .api-body table.option-table .with-github-links .github-links a .material-icons:hover, .api-body table.list-table .with-github-links .github-links a .material-icons:hover {\n  background: none;\n  color: #1976D2;\n}\n.api-body table.method-table h3, .api-body table.option-table h3, .api-body table.list-table h3 {\n  margin: 6px 0;\n  font-weight: 500;\n  clear: left;\n}\n.api-body table.method-table h4, .api-body table.option-table h4, .api-body table.list-table h4 {\n  font-size: 14px;\n  font-size: 1.4rem;\n  font-weight: bold;\n  margin-top: 12px;\n}\n.api-body table th {\n  text-transform: none;\n  font-size: 16px;\n  font-size: 1.6rem;\n  font-weight: bold;\n}\n.api-body table tr {\n  border-bottom: 1px solid #DBDBDB;\n}\n.api-body table tr:last-child {\n  border-bottom: none;\n}\n.api-body table td {\n  vertical-align: middle;\n}\n@media screen and (max-width: 480px) {\n  .api-body table tbody > tr > td tr td:first-child {\n    background-color: inherit;\n  }\n}\n.api-body table hr {\n  margin: 16px 0;\n}\n.api-body table .short-description {\n  margin-left: 0;\n}\n.api-body .class-overview {\n  position: relative;\n}\n.api-body .class-overview code-example {\n  clear: left;\n}\n.api-body .member-name .pln {\n  font-weight: 700;\n}\n.api-body .short-description {\n  margin-top: 8px;\n}\n.api-body .api-heading {\n  font-size: 14px;\n  font-size: 1.4rem;\n  margin: 16px;\n}\n.api-body .from-constructor,\n.api-body .read-only-property,\n.api-body .write-only-property {\n  font-size: 12px;\n  font-size: 1.2rem;\n  font-weight: 600;\n  letter-spacing: 0.5px;\n  letter-spacing: 0.05rem;\n  font-style: italic;\n  background-color: #DBDBDB;\n  border-radius: 4px;\n  padding: 4px 6px;\n}\n.api-body .selector-list ul,\n.api-body .inherited-members-list ul {\n  padding: 0;\n}\n.api-body .selector-list ul li,\n.api-body .inherited-members-list ul li {\n  list-style: none;\n  margin-bottom: 12px;\n}\n.api-body .selector-list li,\n.api-body .selector-list a {\n  font-weight: bold;\n}\n.api-body .selector-list li i,\n.api-body .selector-list a i {\n  font-weight: normal;\n}\n\n.github-links {\n  float: right;\n}\n.github-links .material-icons {\n  border-radius: 4px;\n  padding: 4px;\n  font-size: 20px;\n  font-size: 2rem;\n}\n.github-links .material-icons:hover {\n  background-color: #ECEFF1;\n}\n\n.breadcrumb-container {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n}\n\n.api-header {\n  display: flex;\n  align-items: center;\n  margin-top: -4px;\n}\n@media screen and (max-width: 600px) {\n  .api-header {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n}\n.api-header h1 {\n  font-size: 24px;\n  font-size: 2.4rem;\n  margin: 0;\n}\n\n.deprecated-api-item {\n  text-decoration: line-through;\n}\n\n/* API SYMBOLS */\n/* SYMBOL CLASS */\n.symbol {\n  border-radius: 2px;\n  box-shadow: 0 1px 2px rgba(10, 16, 20, 0.24);\n  color: #FFFFFF;\n  display: inline-block;\n  font-size: 10px;\n  font-size: 1rem;\n  font-weight: 600;\n  line-height: 16px;\n  line-height: 1.6rem;\n  margin-right: 8px;\n  text-align: center;\n  width: 16px;\n}\n.symbol.all {\n  background: #FFFFFF;\n}\n.symbol.all:before {\n  content: \" \";\n}\n.symbol.class {\n  background: #2196F3;\n}\n.symbol.class:before {\n  content: \"C\";\n}\n.symbol.const {\n  background: #6E6E6E;\n}\n.symbol.const:before {\n  content: \"K\";\n}\n.symbol.decorator {\n  background: #1565C0;\n}\n.symbol.decorator:before {\n  content: \"@\";\n}\n.symbol.directive {\n  background: #D81B60;\n}\n.symbol.directive:before {\n  content: \"D\";\n}\n.symbol.enum {\n  background: #FFA000;\n}\n.symbol.enum:before {\n  content: \"E\";\n}\n.symbol.function {\n  background: #4CAF50;\n}\n.symbol.function:before {\n  content: \"F\";\n}\n.symbol.interface {\n  background: #009688;\n}\n.symbol.interface:before {\n  content: \"I\";\n}\n.symbol.let {\n  background: #6E6E6E;\n}\n.symbol.let:before {\n  content: \"K\";\n}\n.symbol.ngmodule {\n  background: #940;\n}\n.symbol.ngmodule:before {\n  content: \"M\";\n}\n.symbol.package {\n  background: #8E24AA;\n}\n.symbol.package:before {\n  content: \"Pk\";\n}\n.symbol.pipe {\n  background: #546E7A;\n}\n.symbol.pipe:before {\n  content: \"P\";\n}\n.symbol.type-alias {\n  background: #7CB342;\n}\n.symbol.type-alias:before {\n  content: \"T\";\n}\n.symbol.var {\n  background: #6E6E6E;\n}\n.symbol.var:before {\n  content: \"K\";\n}\n\n/* Button Styles */\nbutton {\n  font-family: inherit;\n}\n\na.button.mat-button,\n.button {\n  color: inherit;\n  display: inline-block;\n  line-height: 32px;\n  line-height: 3.2rem;\n  padding: 0px 16px;\n  font-size: 14px;\n  font-size: 1.4rem;\n  font-weight: 400;\n  border-radius: 3px;\n  text-decoration: none;\n  text-transform: uppercase;\n  overflow: hidden;\n  border: none;\n}\na.button.mat-button.button-small,\n.button.button-small {\n  font-size: 12px;\n  font-size: 1.2rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  padding: 0px 8px;\n}\na.button.mat-button.button-large,\n.button.button-large {\n  font-size: 15px;\n  font-size: 1.5rem;\n  line-height: 48px;\n  line-height: 4.8rem;\n  padding: 0px 24px;\n}\na.button.mat-button.button-x-large,\n.button.button-x-large {\n  font-size: 16px;\n  font-size: 1.6rem;\n  line-height: 56px;\n  line-height: 5.6rem;\n  padding: 0px 24px;\n}\na.button.mat-button.button-secondary,\n.button.button-secondary {\n  background: #6E6E6E;\n  color: rgba(255, 255, 255, 0.87);\n}\na.button.mat-button.button-plain,\n.button.button-plain {\n  background: #FFFFFF;\n  color: rgba(68, 68, 68, 0.87);\n}\na.button.mat-button.button-subtle,\n.button.button-subtle {\n  background: #6E6E6E;\n  color: #e1e1e1;\n}\na.button.mat-button.button-subtle:hover,\n.button.button-subtle:hover {\n  color: rgba(255, 255, 255, 0.7);\n}\na.button.mat-button.button-blue,\n.button.button-blue {\n  background: #1976D2;\n  color: rgba(255, 255, 255, 0.87);\n}\na.button.mat-button.button-blue:hover,\n.button.button-blue:hover {\n  color: rgba(255, 255, 255, 0.7);\n}\na.button.mat-button.button-banner,\n.button.button-banner {\n  background: #444444;\n  color: rgba(255, 255, 255, 0.87);\n}\n\n.cta-bar {\n  text-align: center;\n}\n.cta-bar .button {\n  margin: 0px 8px;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);\n  transition: all 0.2s ease-in-out;\n}\n.cta-bar .button:hover {\n  transform: scale(1.1);\n  color: #FAFAFA;\n}\n\n.group-buttons {\n  margin: 16px auto 32px;\n}\n.group-buttons a.button.mat-button.filter-button {\n  background-color: rgba(25, 118, 210, 0.2);\n  border-radius: 4px;\n  font-size: 16px;\n  font-size: 1.6rem;\n  line-height: 48px;\n  line-height: 4.8rem;\n  margin: 8px;\n  padding: 0px 16px;\n  width: 168px;\n}\n.group-buttons a.button.mat-button.filter-button.selected, .group-buttons a.button.mat-button.filter-button:hover {\n  background-color: #1976D2;\n  color: #FFFFFF;\n}\n@media (max-width: 480px) {\n  .group-buttons a.button.mat-button.filter-button {\n    font-size: 14px;\n    font-size: 1.4rem;\n    width: auto;\n  }\n}\n\n[mat-button], [mat-raised-button], [mat-button], [mat-raised-button] {\n  text-transform: uppercase;\n}\n\n.callout {\n  padding: 0px;\n  border-left: none !important;\n  border-radius: 4px;\n}\n.callout header {\n  color: #FFFFFF;\n  line-height: 24px;\n  line-height: 2.4rem;\n  font-weight: 500;\n  padding: 8px 16px;\n  margin: 0;\n  text-transform: uppercase;\n  border-radius: 4px 4px 0 0;\n}\n.callout p {\n  padding: 16px;\n  margin: 0px;\n  font-size: 14px;\n  font-size: 1.4rem;\n}\n.callout > *:not(:first-child) {\n  padding: 16px 24px;\n}\n.callout.is-critical {\n  border-color: #DD0031;\n  background: rgba(221, 0, 49, 0.05);\n}\n.callout.is-critical header {\n  background: #DD0031;\n}\n.callout.is-important {\n  border-color: #FF9800;\n  background: rgba(255, 152, 0, 0.05);\n}\n.callout.is-important header {\n  background: #FFA000;\n}\n.callout.is-helpful {\n  border-color: #1976D2;\n  background: rgba(25, 118, 210, 0.05);\n}\n.callout.is-helpful header {\n  background: #1976D2;\n}\n\n.card-container {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  justify-content: center;\n  margin: 16px 0;\n}\n.card-container .docs-card {\n  height: 194px;\n  width: 35%;\n  background-color: #FFFFFF;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  box-sizing: border-box;\n  transition: box-shadow 0.5s;\n  max-width: 340px;\n  min-width: 300px;\n  margin: 24px 16px;\n  padding-bottom: 48px;\n  position: relative;\n}\n.card-container .docs-card:hover {\n  box-shadow: 0 8px 8px rgba(10, 16, 20, 0.24), 0 0 8px rgba(10, 16, 20, 0.12);\n  text-decoration: none;\n}\n@media screen and (max-width: 600px) {\n  .card-container .docs-card {\n    width: 100%;\n    margin: 8px auto;\n    max-width: none;\n  }\n}\n.card-container .docs-card section {\n  color: #1976D2;\n  font-size: 20px;\n  font-size: 2rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  margin: 0;\n  padding: 32px 0 24px;\n  text-transform: none;\n  text-align: center;\n}\n.card-container .docs-card p {\n  color: #444444;\n  font-size: 13px;\n  font-size: 1.3rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  padding: 0 16px;\n  margin: 0;\n  text-align: center;\n}\n.card-container .docs-card .card-footer {\n  color: #1669bb;\n  background-color: rgba(25, 118, 210, 0.1);\n  bottom: 0;\n  border-top: 0.5px solid #DBDBDB;\n  box-sizing: border-box;\n  line-height: 48px;\n  line-height: 4.8rem;\n  left: 0;\n  position: absolute;\n  right: 0;\n  text-align: right;\n}\n.card-container .docs-card .card-footer a {\n  color: #6E6E6E;\n  font-size: 13px;\n  font-size: 1.3rem;\n}\n\n.card-section {\n  height: auto;\n  width: 90%;\n  background-color: #FFFFFF;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  box-sizing: border-box;\n  transition: box-shadow 0.5s;\n  padding: 16px 32px;\n  margin: 16px 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n.card-section:hover {\n  box-shadow: 0 8px 8px rgba(10, 16, 20, 0.24), 0 0 8px rgba(10, 16, 20, 0.12);\n  text-decoration: none;\n}\n.card-section:hover {\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n}\n.card-section h1,\n.card-section h2,\n.card-section h3,\n.card-section h4,\n.card-section h5,\n.card-section h6 {\n  margin: 8px 0;\n}\n.card-section a,\n.card-section .button,\n.card-section button {\n  text-align: center;\n}\n\n.cli-name {\n  font-weight: bold;\n  /* override code format */\n}\n.cli-name .kwd {\n  color: initial;\n}\n\n.cli-option-syntax {\n  white-space: pre;\n}\n\ncode-example,\ncode-tabs {\n  clear: both;\n  display: block;\n}\ncode-example code,\ncode-tabs code {\n  overflow: auto;\n}\ncode-example ol,\ncode-tabs ol {\n  list-style: decimal;\n}\ncode-example .mat-card,\ncode-tabs .mat-card {\n  padding: 0;\n  border-radius: 5px;\n}\n\ncode-example:not(.no-box) {\n  background-color: rgba(241, 241, 241, 0.2);\n  border: 0.5px solid #DBDBDB;\n  border-radius: 5px;\n  color: #444444;\n  margin: 16px auto;\n}\ncode-example.no-box pre.prettyprint {\n  margin: 0;\n}\ncode-example.no-box code {\n  background-color: transparent;\n}\ncode-example code {\n  overflow: auto;\n}\ncode-example[language=sh], code-example[language=bash] {\n  background-color: #444444;\n}\ncode-example header {\n  background-color: #1E88E5;\n  border-radius: 5px 5px 0 0;\n  color: #FAFAFA;\n  font-size: 16px;\n  font-size: 1.6rem;\n  padding: 8px 16px;\n}\n\ncode-tabs {\n  margin: 16px 0;\n}\ncode-tabs .code-tab-group .mat-tab-label:hover {\n  background: rgba(0, 0, 0, 0.04);\n}\ncode-tabs .code-tab-group .mat-tab-body {\n  overflow-y: hidden;\n}\ncode-tabs .code-tab-group .mat-tab-body .mat-tab-body-content {\n  height: auto;\n  transform: none;\n}\ncode-tabs .code-tab-group .mat-tab-body .mat-tab-body-content .fadeIn {\n  animation: opacity 2s ease-in;\n}\n\ncode-example.avoid header,\ncode-example.avoidFile header {\n  border: 2px solid #DD0031;\n  background: #DD0031;\n}\n\ncode-example.avoid,\ncode-example.avoidFile,\ncode-tabs.avoid mat-tab-body,\ncode-tabs.avoidFile mat-tab-body {\n  border: 0.5px solid #DD0031;\n}\n\naio-code pre.prettyprint {\n  position: relative;\n  display: flex;\n  min-height: 32px;\n  margin: 16px 24px;\n  white-space: pre-wrap;\n  align-items: center;\n}\naio-code pre.prettyprint code a {\n  color: inherit;\n}\naio-code pre.prettyprint code span {\n  line-height: 24px;\n  line-height: 2.4rem;\n}\naio-code pre.prettyprint code ol.linenums {\n  margin: 0;\n  color: #aeaeae;\n}\naio-code pre.prettyprint code ol.linenums li {\n  margin: 0;\n  font-family: \"Roboto Mono\", monospace;\n  font-size: 90%;\n  line-height: 24px;\n  line-height: 2.4rem;\n}\naio-code pre.prettyprint code ol.linenums li::marker {\n  color: #aeaeae;\n}\naio-code pre.prettyprint code .code-missing {\n  color: #C3002F;\n}\naio-code pre.prettyprint .copy-button {\n  position: absolute;\n  top: -7px;\n  right: -19px;\n  padding: 0;\n  overflow: visible;\n  color: #B0BEC5;\n  background-color: transparent;\n  border: none;\n  cursor: pointer;\n}\naio-code pre.prettyprint .copy-button:hover {\n  color: #6E6E6E;\n}\naio-code pre.prettyprint.lang-sh .copy-button, aio-code pre.prettyprint.lang-bash .copy-button {\n  color: #6E6E6E;\n}\naio-code pre.prettyprint.lang-sh .copy-button:hover, aio-code pre.prettyprint.lang-bash .copy-button:hover {\n  color: #DBDBDB;\n}\n\n.sidenav-content code a {\n  color: #1669bb;\n  font-size: inherit;\n  font-weight: inherit;\n}\n.sidenav-content :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre) > code {\n  background-color: rgba(219, 219, 219, 0.5);\n  border-radius: 4px;\n  color: #333333;\n  padding: 0 4px;\n}\n.sidenav-content :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre):not(a) > code {\n  padding: 4px;\n}\n.page-guide-cheatsheet .sidenav-content td:first-of-type code,\n.page-guide-cheatsheet .sidenav-content th code {\n  background-color: inherit;\n  padding: 0;\n  white-space: pre-wrap;\n}\n.sidenav-content .code-anchor {\n  cursor: pointer;\n  text-decoration: none;\n  font-size: inherit;\n}\n.sidenav-content .code-anchor:hover {\n  text-decoration: underline;\n}\n\n/* PRETTY PRINTING STYLES for prettify.js. */\n/* The following class|color styles are derived from https://github.com/google/code-prettify/blob/master/src/prettify.css*/\n/* SPAN elements with the classes below are added by prettyprint. */\n.pln {\n  color: #000;\n}\n\n/* plain text */\n@media screen {\n  .str {\n    color: #800;\n  }\n\n  /* string content */\n  .kwd {\n    color: #00f;\n  }\n\n  /* a keyword */\n  .com {\n    color: #060;\n  }\n\n  /* a comment */\n  .typ {\n    color: red;\n  }\n\n  /* a type name */\n  .lit {\n    color: #08c;\n  }\n\n  /* a literal value */\n  /* punctuation, lisp open bracket, lisp close bracket */\n  .pun, .opn, .clo {\n    color: #660;\n  }\n\n  .tag {\n    color: #008;\n  }\n\n  /* a markup tag name */\n  .atn {\n    color: #606;\n  }\n\n  /* a markup attribute name */\n  .atv {\n    color: #800;\n  }\n\n  /* a markup attribute value */\n  .dec, .var {\n    color: #606;\n  }\n\n  /* a declaration; a variable name */\n  .fun {\n    color: red;\n  }\n\n  /* a function name */\n}\n/* Use higher contrast and text-weight for printable form. */\n@media print, projection {\n  .str {\n    color: #060;\n  }\n\n  .kwd {\n    color: #006;\n    font-weight: bold;\n  }\n\n  .com {\n    color: #600;\n    font-style: italic;\n  }\n\n  .typ {\n    color: #404;\n    font-weight: bold;\n  }\n\n  .lit {\n    color: #044;\n  }\n\n  .pun, .opn, .clo {\n    color: #440;\n  }\n\n  .tag {\n    color: #006;\n    font-weight: bold;\n  }\n\n  .atn {\n    color: #404;\n  }\n\n  .atv {\n    color: #060;\n  }\n}\n/* SHELL / TERMINAL CODE BLOCKS */\ncode-example[language=sh] .pnk, code-example[language=sh] .blk, code-example[language=sh] .pln, code-example[language=sh] .otl, code-example[language=sh] .kwd, code-example[language=sh] .typ, code-example[language=sh] .tag, code-example[language=sh] .str, code-example[language=sh] .atv, code-example[language=sh] .atn, code-example[language=sh] .com, code-example[language=sh] .lit, code-example[language=sh] .pun, code-example[language=sh] .dec, code-example[language=bash] .pnk, code-example[language=bash] .blk, code-example[language=bash] .pln, code-example[language=bash] .otl, code-example[language=bash] .kwd, code-example[language=bash] .typ, code-example[language=bash] .tag, code-example[language=bash] .str, code-example[language=bash] .atv, code-example[language=bash] .atn, code-example[language=bash] .com, code-example[language=bash] .lit, code-example[language=bash] .pun, code-example[language=bash] .dec {\n  color: #17ff0b;\n}\n\n.contribute-container h2 {\n  margin: 0;\n}\n.contribute-container .card-section {\n  justify-content: space-between;\n}\n@media (max-width: 600px) {\n  .contribute-container .card-section {\n    flex-direction: column;\n  }\n}\n.contribute-container .card-section > :first-child {\n  margin-right: 2rem;\n  width: 67%;\n}\n@media (max-width: 600px) {\n  .contribute-container .card-section > :first-child {\n    width: 100%;\n  }\n}\n.contribute-container .card-section:last-child {\n  margin-bottom: 0;\n}\n@media (max-width: 600px) {\n  .contribute-container .card-section .button {\n    margin-top: 14px;\n  }\n}\n\naio-contributor-list .contributor-group {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  justify-content: center;\n}\n@media handheld and (max-width: 480px), screen and (max-width: 900px) {\n  aio-contributor-list .grid-fluid {\n    margin-left: 20px;\n    margin-right: 20px;\n    float: none;\n    display: block;\n    width: auto;\n  }\n}\n\naio-contributor {\n  background: #FFFFFF;\n  margin: 8px;\n  position: relative;\n  cursor: pointer;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  transition: all 0.3s;\n  perspective: 800px;\n}\n@media (hover) {\n  aio-contributor:hover {\n    transform: translate3d(0, -3px, 0);\n    box-shadow: 0 8px 8px rgba(10, 16, 20, 0.24), 0 0 8px rgba(10, 16, 20, 0.12);\n  }\n  aio-contributor:hover .contributor-image {\n    transform: scale(1.05);\n  }\n  aio-contributor:hover .contributor-info {\n    opacity: 1;\n  }\n}\naio-contributor .contributor-info {\n  background: rgba(68, 68, 68, 0.5);\n  height: 168px;\n  width: 168px;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n  /* There is no point in hiding this if we can't hover to show it. */\n  border-radius: 50%;\n}\n@media (hover) {\n  aio-contributor .contributor-info {\n    opacity: 0;\n  }\n}\naio-contributor .contributor-info .info-item {\n  color: #FFFFFF;\n  display: flex;\n  font-size: 14px;\n  font-size: 1.4rem;\n  font-weight: 500;\n  margin: 8px;\n  padding: 0;\n}\naio-contributor .contributor-info .info-item:hover {\n  color: #DBDBDB;\n  text-decoration: none;\n}\naio-contributor .contributor-info .info-item.icon {\n  min-width: 20px;\n  width: 20px;\n}\naio-contributor .contributor-info .info-item.icon mat-icon {\n  height: 20px;\n  width: 20px;\n}\naio-contributor .contributor-info .info-item.icon mat-icon.link-icon {\n  margin-top: -7px;\n  transform: rotateZ(45deg);\n}\naio-contributor .contributor-card {\n  width: 250px;\n  height: 270px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  position: relative;\n  overflow: hidden;\n  border-radius: 4px;\n  transform-style: preserve-3d;\n  transition: transform ease 500ms;\n}\naio-contributor .contributor-card h3 {\n  margin: 8px 0;\n}\naio-contributor .contributor-card .card-front, aio-contributor .contributor-card .card-back {\n  width: 100%;\n  height: 100%;\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n}\naio-contributor .contributor-card .card-front {\n  justify-content: center;\n}\naio-contributor .contributor-card .card-back {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  padding: 16px 24px;\n  transform: rotateY(180deg);\n}\naio-contributor .contributor-card .card-back section {\n  display: none;\n}\naio-contributor .contributor-card .card-back p {\n  margin: 8px 0;\n  font-size: 12px;\n  font-size: 1.2rem;\n  line-height: 14px;\n  line-height: 1.4rem;\n  text-align: left;\n}\naio-contributor .contributor-card.flipped {\n  transform: rotateY(180deg);\n}\naio-contributor .contributor-card.flipped .card-front {\n  display: none;\n}\naio-contributor .contributor-image {\n  display: flex;\n  justify-content: center;\n  border-radius: 50%;\n  align-items: center;\n  height: 168px;\n  width: 168px;\n  background-size: cover;\n  background-position: center;\n  margin: 8px auto;\n  border: 2px solid #DBDBDB;\n  transition: all 0.2s ease-in-out;\n}\naio-contributor p {\n  cursor: pointer;\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 18px;\n  line-height: 1.8rem;\n  margin: 8px 16px;\n  text-overflow: ellipsis;\n  overflow-y: auto;\n  font-weight: 400;\n}\n\naio-shell.mode-archive .mat-toolbar.mat-primary, aio-shell.mode-archive footer {\n  background: linear-gradient(145deg, #263238, #78909C);\n}\naio-shell.mode-archive .vertical-menu-item.selected, aio-shell.mode-archive .vertical-menu-item:hover {\n  color: #263238;\n}\naio-shell.mode-archive .toc-inner ul.toc-list li.active a {\n  color: #263238;\n}\naio-shell.mode-archive .toc-inner ul.toc-list li.active a:before {\n  background-color: #263238;\n}\naio-shell.mode-archive .toc-inner ul.toc-list li:hover a {\n  color: #263238;\n}\n\naio-shell.mode-next .mat-toolbar.mat-primary, aio-shell.mode-next footer {\n  background: linear-gradient(145deg, #DD0031, #C3002F);\n}\naio-shell.mode-next .vertical-menu-item.selected, aio-shell.mode-next .vertical-menu-item:hover {\n  color: #DD0031;\n}\naio-shell.mode-next .toc-inner ul.toc-list li.active a {\n  color: #DD0031;\n}\naio-shell.mode-next .toc-inner ul.toc-list li.active a:before {\n  background-color: #DD0031;\n}\naio-shell.mode-next .toc-inner ul.toc-list li:hover a {\n  color: #DD0031;\n}\n\naio-shell.mode-rc .mat-toolbar.mat-primary, aio-shell.mode-rc footer {\n  background: linear-gradient(145deg, #DDA302, #C3A300);\n}\naio-shell.mode-rc .vertical-menu-item.selected, aio-shell.mode-rc .vertical-menu-item:hover {\n  color: #DDA302;\n}\naio-shell.mode-rc .toc-inner ul.toc-list li.active a {\n  color: #DDA302;\n}\naio-shell.mode-rc .toc-inner ul.toc-list li.active a:before {\n  background-color: #DDA302;\n}\naio-shell.mode-rc .toc-inner ul.toc-list li:hover a {\n  color: #DDA302;\n}\n\n/*\n * General styling to make detail/summary tags look a bit more material\n * To get the best out of it you should structure your usage like this:\n *\n * ```html\n * <details>\n *   <summary>Some title</summary>\n *   <div class=\"details-content\">\n *     Some content\n *   </div>\n * </details>\n * ```\n */\ndetails {\n  box-shadow: 0 1px 4px 0 rgba(10, 16, 20, 0.37);\n}\ndetails > summary {\n  cursor: pointer;\n  font-size: 16px;\n  font-size: 1.6rem;\n  position: relative;\n  padding: 16px 24px;\n  color: #0A1014;\n  height: 16px;\n  display: block;\n  overflow: hidden;\n}\ndetails > summary::-webkit-details-marker {\n  display: none;\n}\ndetails > summary i.material-icons.expand {\n  -moz-transform: rotate(0deg);\n  -webkit-transform: rotate(0deg);\n  -o-transform: rotate(0deg);\n  -ms-transform: rotate(0deg);\n  transform: rotate(0deg);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\ndetails[open] > summary i.material-icons.expand {\n  -moz-transform: rotate(180deg);\n  -webkit-transform: rotate(180deg);\n  -o-transform: rotate(180deg);\n  -ms-transform: rotate(180deg);\n  transform: rotate(180deg);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\n\ndetails > summary > h2 {\n  margin: 0;\n  padding: 0;\n  border: none;\n  display: inline;\n}\ndetails .detail-contents {\n  padding: 16px 24px;\n}\n\n.error-list {\n  display: grid;\n  list-style: none;\n  padding: 0;\n  overflow: hidden;\n}\n@media screen and (max-width: 600px) {\n  .error-list {\n    margin: 0 0 0 -8px;\n  }\n}\n.error-list li {\n  font-size: 14px;\n  font-size: 1.4rem;\n  margin: 8px 0;\n  line-height: 14px;\n  line-height: 1.4rem;\n  padding: 0;\n  float: left;\n  overflow: hidden;\n  min-width: 220px;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.error-list li .symbol.runtime {\n  background: #4CAF50;\n}\n.error-list li .symbol.compiler {\n  background: #2196F3;\n}\n.error-list li .symbol.runtime:before {\n  content: \"R\";\n}\n.error-list li .symbol.compiler:before {\n  content: \"C\";\n}\n.error-list li a {\n  color: #546E7A;\n  display: inline-block;\n  line-height: 16px;\n  line-height: 1.6rem;\n  padding: 0 16px 0;\n  text-decoration: none;\n  transition: all 0.3s;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.error-list li a:hover {\n  background: #ECEFF1;\n  color: #2196F3;\n}\n\n.error-video-container {\n  position: relative;\n  padding-bottom: 56.25%;\n  /* 16:9 */\n  height: 0;\n}\n.error-video-container iframe {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\n.feature-section {\n  margin: 0 0 32px;\n}\n.feature-section .feature-header, .feature-section .text-headline {\n  text-align: center;\n}\n.feature-section .feature-header img {\n  margin: 16px;\n  max-width: 70px;\n}\n.feature-section .feature-title {\n  font-size: 16px;\n  font-size: 1.6rem;\n  font-weight: 500;\n  margin: 8px 0px;\n  clear: both;\n}\n.feature-section .feature-row {\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: space-around;\n  justify-content: space-evenly;\n}\n@media (max-width: 1057px) {\n  .feature-section .feature-row {\n    flex-direction: column;\n  }\n}\n.feature-section .feature-row .feature {\n  max-width: 300px;\n  margin: 0 16px;\n}\n@media (max-width: 1057px) {\n  .feature-section .feature-row .feature {\n    max-width: 100%;\n    padding: 8px 10%;\n  }\n}\n@media (max-width: 768px) {\n  .feature-section .feature-row .feature {\n    padding: 8px 0;\n  }\n}\n\n.filetree {\n  background: #FFFFFF;\n  border: 4px solid #DBDBDB;\n  border-radius: 4px;\n  margin: 0 0 24px 0;\n  padding: 16px 32px;\n}\n.filetree .file {\n  display: block;\n  letter-spacing: 0.3px;\n  letter-spacing: 0.03rem;\n  line-height: 32px;\n  line-height: 3.2rem;\n  color: #444444;\n}\n.filetree .children {\n  padding-left: 24px;\n  position: relative;\n  overflow: hidden;\n}\n.filetree .children .file {\n  position: relative;\n}\n.filetree .children .file:before {\n  content: \"\";\n  left: -18px;\n  bottom: 16px;\n  width: 16px;\n  height: 9999px;\n  position: absolute;\n  border-width: 0 0 1px 1px;\n  border-style: solid;\n  border-color: #DBDBDB;\n  border-radius: 0 0 0 3px;\n}\n\n.reviewed {\n  color: #5e5e5e;\n  font-size: 13px;\n  font-size: 1.3rem;\n  font-style: italic;\n  text-align: right;\n}\n\n.sidenav-content h1 .header-link, .sidenav-content h2 .header-link, .sidenav-content h3 .header-link, .sidenav-content h4 .header-link, .sidenav-content h5 .header-link, .sidenav-content h6 .header-link {\n  color: #6E6E6E;\n  margin: 0 6px;\n  text-decoration: none;\n  user-select: none;\n  visibility: hidden;\n  display: inline-flex;\n  vertical-align: middle;\n}\n.sidenav-content h1:hover .header-link, .sidenav-content h2:hover .header-link, .sidenav-content h3:hover .header-link, .sidenav-content h4:hover .header-link, .sidenav-content h5:hover .header-link, .sidenav-content h6:hover .header-link {\n  visibility: visible;\n}\n\nhr {\n  border: none;\n  background: #DBDBDB;\n  height: 1px;\n}\n\n.content img.right {\n  clear: both;\n  float: right;\n  margin-left: 20px;\n  margin-bottom: 20px;\n}\n.content img.left {\n  clear: both;\n  float: left;\n  margin-right: 20px;\n  margin-bottom: 20px;\n}\n@media (max-width: 1300px) {\n  .content img {\n    max-width: 100%;\n    height: auto;\n    margin: auto;\n  }\n}\n@media (max-width: 600px) {\n  .content img {\n    float: none !important;\n  }\n  .content img.right {\n    margin-left: 0;\n  }\n  .content img.left {\n    margin-right: 0;\n  }\n}\n.content .lightbox {\n  margin: 0;\n  margin-top: 14px;\n  margin-bottom: 14px;\n  border-radius: 1px;\n  background: #FFFFFF;\n  border: 1px solid #DBDBDB;\n  padding: 32px;\n  box-sizing: border-box;\n  display: flex;\n  justify-content: center;\n  box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, 0.2);\n  margin: 16px 0;\n  background-color: #EBEBEB;\n  width: 100%;\n  display: flex;\n  justify-content: center;\n}\n.content .lightbox img {\n  max-width: 100%;\n  height: auto;\n  padding: 8px;\n  margin: auto;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  border-radius: 4px;\n  background-color: #FFFFFF;\n}\n\n.api-header label {\n  border-radius: 4px;\n  padding: 2px 10px;\n  display: inline;\n  font-size: 12px;\n  font-size: 1.2rem;\n  color: #FFFFFF;\n  margin-right: 8px;\n  font-weight: 500;\n  text-transform: uppercase;\n}\n@media screen and (max-width: 600px) {\n  .api-header label {\n    display: block;\n    margin: 4px 0;\n  }\n}\n.api-header label.api-status-label {\n  background-color: #6E6E6E;\n}\n.api-header label.api-status-label.deprecated, .api-header label.api-status-label.security, .api-header label.api-status-label.impure-pipe {\n  background-color: #DD0031;\n}\n.api-header label.api-type-label {\n  background-color: #1E88E5;\n}\n.api-header label.api-type-label.all {\n  background: #FFFFFF;\n}\n.api-header label.api-type-label.class {\n  background: #2196F3;\n}\n.api-header label.api-type-label.const {\n  background: #6E6E6E;\n}\n.api-header label.api-type-label.decorator {\n  background: #1565C0;\n}\n.api-header label.api-type-label.directive {\n  background: #D81B60;\n}\n.api-header label.api-type-label.enum {\n  background: #FFA000;\n}\n.api-header label.api-type-label.function {\n  background: #4CAF50;\n}\n.api-header label.api-type-label.interface {\n  background: #009688;\n}\n.api-header label.api-type-label.let {\n  background: #6E6E6E;\n}\n.api-header label.api-type-label.ngmodule {\n  background: #940;\n}\n.api-header label.api-type-label.package {\n  background: #8E24AA;\n}\n.api-header label.api-type-label.pipe {\n  background: #546E7A;\n}\n.api-header label.api-type-label.type-alias {\n  background: #7CB342;\n}\n.api-header label.api-type-label.var {\n  background: #6E6E6E;\n}\n.api-header label.page-label {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  background-color: #ECEFF1;\n  color: #6E6E6E;\n  margin-bottom: 8px;\n  width: 140px;\n}\n.api-header label.page-label .material-icons {\n  margin-right: 8px;\n}\n.api-header label.property-type-label {\n  font-size: 12px;\n  font-size: 1.2rem;\n  background-color: #444444;\n  color: #FFFFFF;\n  text-transform: none;\n}\n\n.app-toolbar mat-toolbar-row.notification-container {\n  padding: 0;\n  height: auto;\n  overflow: hidden;\n}\n\naio-notification {\n  background: #444444;\n  display: flex;\n  position: relative;\n  align-items: center;\n  width: 100%;\n  height: 56px;\n  justify-content: center;\n}\n@media (max-width: 430px) {\n  aio-notification {\n    justify-content: flex-start;\n    padding-left: 10px;\n  }\n}\naio-notification .close-button {\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 56px;\n  height: 56px;\n  background: #444444;\n}\naio-notification .content {\n  max-width: calc(100% - 56px);\n  background: #444444;\n  text-transform: none;\n  padding: 0;\n}\naio-notification .content > * {\n  display: flex;\n}\naio-notification .content .icon {\n  margin-right: 10px;\n}\n@media (max-width: 464px) {\n  aio-notification .content .icon {\n    display: none;\n  }\n}\naio-notification .content .message {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  margin-right: 10px;\n}\naio-notification .content .action-button {\n  background: #DD0031;\n  border-radius: 15px;\n  text-transform: uppercase;\n  padding: 0 10px;\n  font-size: 12px;\n  font-size: 1.2rem;\n}\n@media (max-width: 780px) {\n  aio-notification .content .action-button {\n    display: none;\n  }\n}\n\n.aio-notification-show .toc-container {\n  top: 132px;\n}\n.aio-notification-show .search-results {\n  padding-top: 56px;\n}\n.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content {\n  padding-top: 136px;\n}\n.aio-notification-show mat-sidenav-container.sidenav-container mat-sidenav.sidenav {\n  top: 120px;\n}\n@media (max-width: 600px) {\n  .aio-notification-show mat-sidenav-container.sidenav-container mat-sidenav.sidenav {\n    top: 112px;\n  }\n}\n\n.page-about.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content, .page-contribute.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content, .page-events.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content, .page-features.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content, .page-home.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content, .page-presskit.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content, .page-resources.aio-notification-show mat-sidenav-container.sidenav-container .sidenav-content {\n  padding-top: 56px;\n}\n\n.aio-notification-animating .sidenav-content {\n  transition: padding-top 250ms ease;\n}\n.aio-notification-animating mat-sidenav.sidenav, .aio-notification-animating .toc-container {\n  transition: top 250ms ease;\n}\n\n.progress-bar-container {\n  height: 2px;\n  overflow: hidden;\n  position: fixed;\n  top: 0;\n  width: 100vw;\n  z-index: 11;\n}\n\n.presskit-container {\n  padding: 0 32px 32px 32px;\n}\n.presskit-container img {\n  height: 128px;\n  width: auto;\n}\n.presskit-container .presskit-section:not(:first-child) {\n  border-top: 1px solid #DBDBDB;\n  margin-top: 4rem;\n  padding-top: 2rem;\n}\n.presskit-container .presskit-section .presskit-icon-group {\n  display: flex;\n  flex-wrap: wrap;\n}\n.presskit-container .presskit-section .presskit-icon-group .presskit-icon-item {\n  align-items: center;\n  display: flex;\n  margin: 1rem;\n  width: calc(50% - 2rem);\n}\n@media screen and (max-width: 600px) {\n  .presskit-container .presskit-section .presskit-icon-group .presskit-icon-item {\n    align-items: flex-start;\n    flex-direction: column;\n    margin-bottom: 2rem;\n  }\n}\n.presskit-container .presskit-section .presskit-icon-group .presskit-icon-item .presskit-image-container {\n  flex: none;\n  margin-right: 2rem;\n}\n@media (max-width: 600px) {\n  .presskit-container .presskit-section .presskit-icon-group .presskit-icon-item .presskit-image-container {\n    width: 100%;\n    margin-right: 0;\n  }\n}\n.presskit-container .presskit-section .presskit-icon-group .presskit-icon-item .presskit-image-container .transparent-img {\n  background-color: #333333;\n  border-radius: 50%;\n}\n.presskit-container .presskit-section .presskit-icon-group .presskit-icon-item .presskit-links-container {\n  list-style-type: none;\n  margin-bottom: 0;\n  padding: 0;\n}\n.presskit-container .presskit-section .presskit-icon-group .presskit-icon-item .presskit-links-container a {\n  padding-right: 3rem;\n  position: relative;\n}\n.presskit-container .presskit-section .presskit-icon-group .presskit-icon-item .presskit-links-container a::after {\n  content: \"cloud_download\";\n  font-family: \"Material Icons\";\n  font-size: 24px;\n  font-size: 2.4rem;\n  position: absolute;\n  right: 0;\n}\n\naio-resource-list .showcase {\n  transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n  box-shadow: 0 1px 4px 0 rgba(10, 16, 20, 0.37);\n  border-radius: 4px;\n  margin-bottom: 48px;\n}\naio-resource-list .resource-item h4 {\n  margin: 0;\n  line-height: 24px;\n  line-height: 2.4rem;\n}\naio-resource-list .resource-item p {\n  margin: 0;\n}\naio-resource-list .subcategory-title {\n  padding: 16px 23px;\n  margin: 0;\n  background-color: #ECEFF1;\n}\naio-resource-list .resource-row-link {\n  display: flex;\n  flex-direction: column;\n  border: transparent solid 1px;\n  padding: 16px 23px 16px 23px;\n  transition: all 0.3s;\n}\naio-resource-list .resource-row-link:hover {\n  text-decoration: none;\n  border-color: rgba(25, 118, 210, 0.5);\n  border-radius: 4px;\n  box-shadow: 0 8px 8px rgba(1, 67, 163, 0.24), 0 0 8px rgba(1, 67, 163, 0.12), 0 6px 18px rgba(43, 133, 231, 0.12);\n  transform: translateY(-2px);\n}\n\n.roadmap-done-details {\n  padding: 0 20px 20px;\n  margin: 0 -20px;\n}\n\n.roadmap-done-summary {\n  margin: 0 -20px;\n  font-size: 3.2rem;\n  height: 40px;\n  padding-bottom: 0;\n  display: list-item;\n  user-select: none;\n}\n\naio-search-results {\n  z-index: 10;\n}\naio-search-results .search-results {\n  display: flex;\n  flex-direction: row;\n  overflow: auto;\n  padding: 0px 32px;\n  border-top: 68px solid transparent;\n  width: auto;\n  max-height: 95vh;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  z-index: 5;\n  background-color: #444444;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n  box-sizing: border-box;\n}\naio-search-results .search-results .search-area {\n  margin: 0 auto;\n  padding: 16px;\n}\naio-search-results .search-results .search-area .search-section-header {\n  font-size: 16px;\n  font-size: 1.6rem;\n  font-weight: 400;\n  margin: 10px 0px 5px;\n  text-transform: uppercase;\n  color: #FFFFFF;\n}\naio-search-results .search-results .search-area ul {\n  margin: 0;\n  padding: 0;\n}\naio-search-results .search-results .search-area ul li {\n  list-style: none;\n}\naio-search-results .search-results .search-area ul .search-result-item {\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 24px;\n  line-height: 2.4rem;\n  color: #DBDBDB;\n  display: inline-block;\n  font-weight: normal;\n  padding: 0.6rem 0;\n}\naio-search-results .search-results .search-area ul .search-result-itema {\n  text-decoration: none;\n}\naio-search-results .search-results .search-area ul .search-result-item:hover {\n  color: #FFFFFF;\n}\naio-search-results .search-results .search-area ul.priority-pages {\n  padding: 0.5rem 0;\n}\naio-search-results .search-results .search-area ul.priority-pages .search-result-item {\n  font-weight: bold;\n}\naio-search-results .search-results .no-results {\n  color: #FFFFFF;\n  text-align: center;\n  margin: 16px;\n}\naio-search-results .search-results a {\n  color: #FFFFFF;\n  font-weight: 500;\n}\n@media (max-width: 600px) {\n  aio-search-results .search-results {\n    display: block;\n  }\n}\naio-search-results.embedded .search-results {\n  padding: 0;\n  color: inherit;\n  max-height: 100%;\n  position: relative;\n  background-color: inherit;\n  box-shadow: none;\n}\naio-search-results.embedded .search-results .search-area .search-section-header {\n  color: #444444;\n}\naio-search-results.embedded .search-results .search-area .search-result-item {\n  color: #5e5e5e;\n}\naio-search-results.embedded .search-results .search-area .search-result-item:hover {\n  color: #1E88E5;\n}\naio-search-results.embedded .search-results .no-results {\n  color: #444444;\n}\naio-search-results.embedded .search-results a {\n  color: #1976D2;\n}\n\n/* SELECT MENU */\naio-select .form-select-menu {\n  position: relative;\n}\naio-select .form-select-button {\n  background: #FFFFFF;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  box-sizing: border-box;\n  border: 1px solid #FFFFFF;\n  border-radius: 4px;\n  color: #546E7A;\n  font-size: 14px;\n  font-size: 1.4rem;\n  font-weight: 400;\n  line-height: 32px;\n  line-height: 3.2rem;\n  outline: none;\n  padding: 4px 16px;\n  text-align: left;\n  width: 100%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n}\naio-select .form-select-button strong {\n  font-weight: 600;\n  margin-right: 8px;\n  text-transform: capitalize;\n}\naio-select .form-select-button:focus {\n  border: 1px solid #42A5F5;\n  box-shadow: 0 2px 2px rgba(66, 165, 245, 0.24), 0 0 2px rgba(66, 165, 245, 0.12);\n}\naio-select .form-select-button[disabled] {\n  color: lightgrey;\n  cursor: not-allowed;\n}\naio-select .form-select-dropdown {\n  background: #FFFFFF;\n  box-shadow: 0 16px 16px rgba(10, 16, 20, 0.24), 0 0 16px rgba(10, 16, 20, 0.12);\n  border-radius: 4px;\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n  position: absolute;\n  top: 0;\n  width: 100%;\n  z-index: 2;\n}\naio-select .form-select-dropdown li {\n  cursor: pointer;\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: 32px;\n  line-height: 3.2rem;\n  margin: 0;\n  padding: 4px 16px 4px 40px;\n  position: relative;\n  transition: all 0.2s;\n  border: 1px solid transparent;\n}\naio-select .form-select-dropdown li:first-child {\n  border-radius: 4px 4px 0 0;\n}\naio-select .form-select-dropdown li:last-child {\n  border-radius: 0 0 4px 4px;\n}\naio-select .form-select-dropdown li:hover {\n  background: #ECEFF1;\n  color: #2196F3;\n}\naio-select .form-select-dropdown li.selected {\n  background-color: #CFD8DC;\n}\naio-select .form-select-dropdown li .symbol {\n  left: 16px;\n  position: absolute;\n  top: 12px;\n  z-index: 5;\n}\n\ntable {\n  margin: 24px 0px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  border-radius: 2px;\n  background: #FFFFFF;\n}\ntable.is-full-width {\n  width: 100%;\n}\ntable.is-fixed-layout {\n  table-layout: fixed;\n}\ntable thead > {\n  vertical-align: middle;\n  border-color: inherit;\n}\ntable thead > tr {\n  vertical-align: inherit;\n  border-color: inherit;\n}\ntable thead > tr > th {\n  background: rgba(219, 219, 219, 0.2);\n  border-bottom: 1px solid #DBDBDB;\n  color: #444444;\n  font-size: 12px;\n  font-size: 1.2rem;\n  font-weight: 500;\n  padding: 8px 24px;\n  text-align: left;\n  text-transform: uppercase;\n  line-height: 28px;\n  line-height: 2.8rem;\n}\ntable tbody > tr > th,\ntable tbody > tr > td {\n  border-bottom: 1px solid #DBDBDB;\n  padding: 16px;\n  text-align: left;\n  line-height: 24px;\n  line-height: 2.4rem;\n  vertical-align: top;\n}\n@media (max-width: 480px) {\n  table tbody > tr > th:before,\ntable tbody > tr > td:before {\n    display: inline-block;\n  }\n}\ntable tbody > tr > td {\n  letter-spacing: 0.3px;\n  letter-spacing: 0.03rem;\n}\n@media (max-width: 480px) {\n  table tbody > tr > td tr td:first-child {\n    background-color: #DBDBDB;\n  }\n}\ntable tbody > tr > th {\n  background: rgba(219, 219, 219, 0.2);\n  border-right: 1px solid #DBDBDB;\n  font-weight: 600;\n  max-width: 100px;\n}\ntable tbody > tr:last-child td {\n  border: none;\n}\n@media (max-width: 480px) {\n  table tbody > tr:last-child td {\n    border-bottom: 1px solid #DBDBDB;\n  }\n}\n\n.page-guide-cheatsheet table tbody td {\n  overflow: auto;\n}\n@media only screen and (max-width: 990px) {\n  .page-guide-cheatsheet {\n    /* Force table to not be like tables anymore */\n  }\n  .page-guide-cheatsheet table, .page-guide-cheatsheet thead, .page-guide-cheatsheet tbody, .page-guide-cheatsheet tfoot, .page-guide-cheatsheet tr, .page-guide-cheatsheet th, .page-guide-cheatsheet td {\n    display: block;\n    position: relative;\n    max-width: 100%;\n  }\n  .page-guide-cheatsheet th {\n    border-right: none;\n  }\n  .page-guide-cheatsheet th:not(:last-child), .page-guide-cheatsheet td:not(:last-child) {\n    border-bottom: none;\n    padding-bottom: 0px;\n  }\n}\n\n.page-events tr > td, .page-events tr > th {\n  width: 33%;\n}\n\n.toc-container {\n  width: 18%;\n  position: fixed;\n  top: 76px;\n  right: 0;\n  bottom: 12px;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n\naio-toc .toc-inner {\n  font-size: 13px;\n  font-size: 1.3rem;\n  overflow-y: visible;\n  padding: 4px 0 0 10px;\n}\naio-toc .toc-inner .toc-heading,\naio-toc .toc-inner .toc-list .h1 {\n  font-size: 16px;\n  font-size: 1.6rem;\n}\naio-toc .toc-inner .toc-heading {\n  font-weight: 500;\n  margin: 0 0 16px 8px;\n  padding: 0;\n}\naio-toc .toc-inner .toc-heading.secondary {\n  position: relative;\n  top: -8px;\n}\naio-toc .toc-inner .toc-heading.secondary:hover {\n  color: #1E88E5;\n}\naio-toc .toc-inner button.toc-heading, aio-toc .toc-inner button.toc-more-items {\n  cursor: pointer;\n  display: inline-block;\n  background: 0;\n  background-color: transparent;\n  border: none;\n  box-shadow: none;\n  padding: 0;\n  text-align: start;\n}\naio-toc .toc-inner button.toc-heading.embedded:focus, aio-toc .toc-inner button.toc-more-items.embedded:focus {\n  outline: none;\n  background: #DBDBDB;\n}\naio-toc .toc-inner button.toc-heading mat-icon.rotating-icon {\n  height: 18px;\n  width: 18px;\n  position: relative;\n  left: -4px;\n  top: 5px;\n}\naio-toc .toc-inner button.toc-heading:hover:not(.embedded) {\n  color: #1E88E5;\n}\naio-toc .toc-inner button.toc-more-items {\n  color: #6E6E6E;\n  top: 10px;\n  position: relative;\n}\naio-toc .toc-inner button.toc-more-items:hover {\n  color: #1E88E5;\n}\naio-toc .toc-inner button.toc-more-items::after {\n  content: \"expand_less\";\n}\naio-toc .toc-inner button.toc-more-items.collapsed::after {\n  content: \"more_horiz\";\n}\naio-toc .toc-inner .mat-icon.collapsed {\n  -moz-transform: rotate(0deg);\n  -webkit-transform: rotate(0deg);\n  -o-transform: rotate(0deg);\n  -ms-transform: rotate(0deg);\n  transform: rotate(0deg);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\naio-toc .toc-inner .mat-icon:not(.collapsed) {\n  -moz-transform: rotate(90deg);\n  -webkit-transform: rotate(90deg);\n  -o-transform: rotate(90deg);\n  -ms-transform: rotate(90deg);\n  transform: rotate(90deg);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\naio-toc .toc-inner ul.toc-list {\n  list-style-type: none;\n  margin: 0;\n  padding: 0 8px 0 0;\n}\n@media (max-width: 800px) {\n  aio-toc .toc-inner ul.toc-list {\n    width: auto;\n  }\n}\naio-toc .toc-inner ul.toc-list li {\n  box-sizing: border-box;\n  line-height: 24px;\n  line-height: 2.4rem;\n  padding: 9px 0 9px 12px;\n  position: relative;\n  transition: all 0.3s ease-in-out;\n}\naio-toc .toc-inner ul.toc-list li.h1:after {\n  content: \"\";\n  display: block;\n  height: 1px;\n  width: 40%;\n  margin: 7px 0 4px 0;\n  background: #DBDBDB;\n  clear: both;\n}\naio-toc .toc-inner ul.toc-list li.h3 {\n  padding-left: 24px;\n}\naio-toc .toc-inner ul.toc-list li a {\n  color: #5e5e5e;\n  overflow: visible;\n  font-size: 14px;\n  font-size: 1.4rem;\n  line-height: inherit;\n  display: table-cell;\n}\naio-toc .toc-inner ul.toc-list li:hover * {\n  color: #1E88E5;\n}\naio-toc .toc-inner ul.toc-list li.active * {\n  color: #1976D2;\n  font-weight: 500;\n}\naio-toc .toc-inner ul.toc-list li.active a:before {\n  background: #1976D2;\n  border-radius: 50%;\n  content: \"\";\n  height: 6px;\n  left: -2.5px;\n  position: absolute;\n  top: calc(9px + 12px - 3px);\n  top: calc(9px + 1.2rem - 3px);\n  width: 6px;\n}\naio-toc .toc-inner ul.toc-list:not(.embedded) li:before {\n  border-left: 1px solid #DBDBDB;\n  bottom: 0;\n  content: \"\";\n  left: 0;\n  position: absolute;\n  top: 0;\n}\naio-toc .toc-inner ul.toc-list:not(.embedded) li:first-child:before {\n  top: calc(9px + 12px - 3px);\n  top: calc(9px + 1.2rem - 3px);\n}\naio-toc .toc-inner ul.toc-list:not(.embedded) li:last-child:before {\n  bottom: calc(100% - (9px + 12px + 3px));\n  bottom: calc(100% - (9px + 1.2rem + 3px));\n}\naio-toc .toc-inner ul.toc-list:not(.embedded) li:not(.active):hover a:before {\n  background: #DBDBDB;\n  border-radius: 50%;\n  content: \"\";\n  height: 6px;\n  left: -2.5px;\n  position: absolute;\n  top: calc(9px + 12px - 3px);\n  top: calc(9px + 1.2rem - 3px);\n  width: 6px;\n}\n@media (min-width: 801px) {\n  aio-toc.embedded {\n    display: none;\n  }\n}\naio-toc.embedded .toc-inner {\n  padding: 12px 0 0 0;\n}\naio-toc.embedded .toc-inner .toc-heading {\n  margin: 0 0 8px;\n}\naio-toc.embedded .toc-inner.collapsed .secondary {\n  display: none;\n}\n\n.debug [translation-result], .debug code-tabs, .debug code-example, .debug img, .debug code, .debug pre, .debug .filetree {\n  display: none;\n}\n\n[translation-result] + [translation-origin=off] {\n  display: none;\n}\n\n[translation-result] + aio-toc + [translation-origin=off] {\n  display: none;\n}\n\n[translation-origin=on] {\n  border-top: 1px dashed #0273D4;\n}\n\n[id^=translations-cn] aio-doc-viewer blockquote {\n  color: #455A64;\n  margin: 0 0 32px 0;\n  padding: 16px 32px;\n  background: rgba(236, 239, 241, 0.24);\n  border-left: 4px solid #00BCD4;\n}\n\nem {\n  font-style: normal;\n  font-weight: bold;\n}\n\n@media print {\n  * {\n    box-shadow: none !important;\n  }\n\n  body, mat-sidenav-container {\n    background: none !important;\n  }\n\n  h1 {\n    height: 40px !important;\n    color: #444444 !important;\n  }\n\n  h1, h2, h3, h4, h5, h6 {\n    page-break-after: avoid;\n  }\n\n  ul, ol, img, code-example, table, tr, .alert, .callout, .feature, .lightbox {\n    page-break-inside: avoid;\n  }\n\n  table tbody tr:last-child td {\n    border-bottom: 1px solid #DBDBDB !important;\n  }\n\n  img {\n    max-width: 100% !important;\n  }\n\n  p {\n    widows: 4;\n  }\n\n  p > code, li > code, table code {\n    color: #1976D2 !important;\n  }\n\n  .no-print {\n    display: none !important;\n  }\n\n  mat-sidenav.sidenav.mat-sidenav {\n    display: none !important;\n  }\n\n  .mat-sidenav-content {\n    margin: 0 !important;\n  }\n\n  mat-sidenav-container.sidenav-container {\n    min-width: 100vw;\n  }\n\n  .sidenav-content {\n    overflow: visible;\n  }\n\n  .filetree {\n    max-width: 100%;\n  }\n\n  aio-code code {\n    border: none !important;\n  }\n\n  code-example[language=sh], code-example[language=bash] {\n    background: none;\n  }\n  code-example[language=sh] .pnk, code-example[language=sh] .blk, code-example[language=sh] .pln, code-example[language=sh] .otl, code-example[language=sh] .kwd, code-example[language=sh] .typ, code-example[language=sh] .tag, code-example[language=sh] .str, code-example[language=sh] .atv, code-example[language=sh] .atn, code-example[language=sh] .com, code-example[language=sh] .lit, code-example[language=sh] .pun, code-example[language=sh] .dec, code-example[language=bash] .pnk, code-example[language=bash] .blk, code-example[language=bash] .pln, code-example[language=bash] .otl, code-example[language=bash] .kwd, code-example[language=bash] .typ, code-example[language=bash] .tag, code-example[language=bash] .str, code-example[language=bash] .atv, code-example[language=bash] .atn, code-example[language=bash] .com, code-example[language=bash] .lit, code-example[language=bash] .pun, code-example[language=bash] .dec {\n    color: #444444;\n  }\n  code-example header {\n    background: none;\n    border: 0.5px solid #DBDBDB;\n    color: #444444;\n  }\n\n  .content code {\n    border: 0.5px solid #DBDBDB;\n  }\n\n  .mat-tab-labels div.mat-tab-label:not(.mat-tab-label-active) span {\n    font-style: italic;\n  }\n  .mat-tab-labels div.mat-tab-label.mat-tab-label-active span {\n    font-weight: bold;\n  }\n\n  .api-header label {\n    color: #444444 !important;\n    font-weight: bold !important;\n    margin: 2px !important;\n    padding: 0 !important;\n    display: block !important;\n  }\n\n  .feature-section img {\n    max-width: 70px !important;\n  }\n}","@use 'sass:map';\n@use 'typography-utils';\n@use '../theming/theming';\n\n// Represents a typography level from the Material design spec.\n@function define-typography-level(\n  $font-size,\n  $line-height: $font-size,\n  $font-weight: 400,\n  $font-family: null,\n  $letter-spacing: normal) {\n\n  @return (\n    font-size: $font-size,\n    line-height: $line-height,\n    font-weight: $font-weight,\n    font-family: $font-family,\n    letter-spacing: $letter-spacing\n  );\n}\n\n// Represents a collection of typography levels.\n// Defaults come from https://material.io/guidelines/style/typography.html\n// Note: The spec doesn't mention letter spacing. The values here come from\n// eyeballing it until it looked exactly like the spec examples.\n@function define-typography-config(\n  $font-family:   'Roboto, \"Helvetica Neue\", sans-serif',\n  $display-4:     define-typography-level(112px, 112px, 300, $letter-spacing: -0.05em),\n  $display-3:     define-typography-level(56px, 56px, 400, $letter-spacing: -0.02em),\n  $display-2:     define-typography-level(45px, 48px, 400, $letter-spacing: -0.005em),\n  $display-1:     define-typography-level(34px, 40px, 400),\n  $headline:      define-typography-level(24px, 32px, 400),\n  $title:         define-typography-level(20px, 32px, 500),\n  $subheading-2:  define-typography-level(16px, 28px, 400),\n  $subheading-1:  define-typography-level(15px, 24px, 400),\n  $body-2:        define-typography-level(14px, 24px, 500),\n  $body-1:        define-typography-level(14px, 20px, 400),\n  $caption:       define-typography-level(12px, 20px, 400),\n  $button:        define-typography-level(14px, 14px, 500),\n  // Line-height must be unit-less fraction of the font-size.\n  $input:         define-typography-level(inherit, 1.125, 400)\n) {\n\n  // Declare an initial map with all of the levels.\n  $config: (\n    display-4:      $display-4,\n    display-3:      $display-3,\n    display-2:      $display-2,\n    display-1:      $display-1,\n    headline:       $headline,\n    title:          $title,\n    subheading-2:   $subheading-2,\n    subheading-1:   $subheading-1,\n    body-2:         $body-2,\n    body-1:         $body-1,\n    caption:        $caption,\n    button:         $button,\n    input:          $input,\n  );\n\n  // Loop through the levels and set the `font-family` of the ones that don't have one to the base.\n  // Note that Sass can't modify maps in place, which means that we need to merge and re-assign.\n  @each $key, $level in $config {\n    @if map.get($level, font-family) == null {\n      $new-level: map.merge($level, (font-family: $font-family));\n      $config: map.merge($config, ($key: $new-level));\n    }\n  }\n\n  // Add the base font family to the config.\n  @return map.merge($config, (font-family: $font-family));\n}\n\n// Whether a config is for the Material Design 2018 typography system.\n@function private-typography-is-2018-config($config) {\n  @return map.get($config, headline-1) != null;\n}\n\n// Whether a config is for the Material Design 2014 typography system.\n@function private-typography-is-2014-config($config) {\n  @return map.get($config, headline) != null;\n}\n\n// Given a config for either the 2014 or 2018 Material Design typography system,\n// produces a normalized typography config for the 2014 Material Design typography system.\n// 2014 - https://material.io/archive/guidelines/style/typography.html#typography-styles\n// 2018 - https://material.io/design/typography/the-type-system.html#type-scale\n//\n// Components using this function should be migrated to normalize to the 2018 style config instead.\n// New components should not use this function.\n@function private-typography-to-2014-config($config) {\n  @if $config == null {\n    @return null;\n  }\n  @if not private-typography-is-2014-config($config) {\n    $args: (\n        display-4: map.get($config, headline-1),\n        display-3: map.get($config, headline-2),\n        display-2: map.get($config, headline-3),\n        display-1: map.get($config, headline-4),\n        headline: map.get($config, headline-5),\n        title: map.get($config, headline-6),\n        subheading-2: map.get($config, subtitle-1),\n        subheading-1: map.get($config, subtitle-2),\n        body-2: map.get($config, body-1),\n        body-1: map.get($config, body-2),\n        button: map.get($config, button),\n        caption: map.get($config, caption),\n    );\n    $non-null-args: ();\n    @each $key, $value in $args {\n      @if $value != null {\n        $non-null-args: map.merge($non-null-args, ($key: $value));\n      }\n    }\n    @return define-typography-config($non-null-args...);\n  }\n  @return $config;\n}\n\n// Given a config for either the 2014 or 2018 Material Design typography system,\n// produces a normalized typography config for the 2018 Material Design typography system.\n// 2014 - https://material.io/archive/guidelines/style/typography.html#typography-styles\n// 2018 - https://material.io/design/typography/the-type-system.html#type-scale\n@function private-typography-to-2018-config($config) {\n  @if $config == null {\n    @return null;\n  }\n  @if not private-typography-is-2018-config($config) {\n    @return (\n        headline-1: map.get($config, display-4),\n        headline-2: map.get($config, display-3),\n        headline-3: map.get($config, display-2),\n        headline-4: map.get($config, display-1),\n        headline-5: map.get($config, headline),\n        headline-6: map.get($config, title),\n        subtitle-1: map.get($config, subheading-2),\n        subtitle-2: map.get($config, subheading-1),\n        body-1: map.get($config, body-2),\n        body-2: map.get($config, body-1),\n        button: map.get($config, button),\n        caption: map.get($config, caption),\n        overline: if(map.get($config, overline), map.get($config, overline),\n            define-typography-level(12px, 32px, 500)\n        )\n    );\n  }\n  @return $config;\n}\n\n// Adds the base typography styles, based on a config.\n// stylelint-disable-next-line material/theme-mixin-api\n@mixin typography-hierarchy($config-or-theme, $selector: '.mat-typography') {\n  $config: private-typography-to-2014-config(theming.get-typography-config($config-or-theme));\n\n  .mat-h1, .mat-headline, #{$selector} h1 {\n    @include typography-utils.typography-level($config, headline);\n    margin: 0 0 16px;\n  }\n\n  .mat-h2, .mat-title, #{$selector} h2 {\n    @include typography-utils.typography-level($config, title);\n    margin: 0 0 16px;\n  }\n\n  .mat-h3, .mat-subheading-2, #{$selector} h3 {\n    @include typography-utils.typography-level($config, subheading-2);\n    margin: 0 0 16px;\n  }\n\n  .mat-h4, .mat-subheading-1, #{$selector} h4 {\n    @include typography-utils.typography-level($config, subheading-1);\n    margin: 0 0 16px;\n  }\n\n  // Note: the spec doesn't have anything that would correspond to h5 and h6, but we add these for\n  // consistency. The font sizes come from the Chrome user agent styles which have h5 at 0.83em\n  // and h6 at 0.67em.\n  .mat-h5, #{$selector} h5 {\n    @include typography-utils.font-shorthand(\n       // calc is used here to support css variables\n      calc(#{typography-utils.font-size($config, body-1)} * 0.83),\n      typography-utils.font-weight($config, body-1),\n      typography-utils.line-height($config, body-1),\n      typography-utils.font-family($config, body-1)\n    );\n\n    margin: 0 0 12px;\n  }\n\n  .mat-h6, #{$selector} h6 {\n    @include typography-utils.font-shorthand(\n       // calc is used here to support css variables\n      calc(#{typography-utils.font-size($config, body-1)} * 0.67),\n      typography-utils.font-weight($config, body-1),\n      typography-utils.line-height($config, body-1),\n      typography-utils.font-family($config, body-1)\n    );\n\n    margin: 0 0 12px;\n  }\n\n  .mat-body-strong, .mat-body-2 {\n    @include typography-utils.typography-level($config, body-2);\n  }\n\n  .mat-body, .mat-body-1, #{$selector} {\n    @include typography-utils.typography-level($config, body-1);\n\n    p {\n      margin: 0 0 12px;\n    }\n  }\n\n  .mat-small, .mat-caption {\n    @include typography-utils.typography-level($config, caption);\n  }\n\n  .mat-display-4, #{$selector} .mat-display-4 {\n    @include typography-utils.typography-level($config, display-4);\n    margin: 0 0 56px;\n  }\n\n  .mat-display-3, #{$selector} .mat-display-3 {\n    @include typography-utils.typography-level($config, display-3);\n    margin: 0 0 64px;\n  }\n\n  .mat-display-2, #{$selector} .mat-display-2 {\n    @include typography-utils.typography-level($config, display-2);\n    margin: 0 0 64px;\n  }\n\n  .mat-display-1, #{$selector} .mat-display-1 {\n    @include typography-utils.typography-level($config, display-1);\n    margin: 0 0 64px;\n  }\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use 'sass:string';\n// Utility for fetching a nested value from a typography config.\n@function _mat-get-type-value($config, $level, $name) {\n  @return map.get(map.get($config, $level), $name);\n}\n\n// Gets the font size for a level inside a typography config.\n@function font-size($config, $level) {\n  @return _mat-get-type-value($config, $level, font-size);\n}\n\n// Gets the line height for a level inside a typography config.\n@function line-height($config, $level) {\n  @return _mat-get-type-value($config, $level, line-height);\n}\n\n// Gets the font weight for a level inside a typography config.\n@function font-weight($config, $level) {\n  @return _mat-get-type-value($config, $level, font-weight);\n}\n\n// Gets the letter spacing for a level inside a typography config.\n@function letter-spacing($config, $level) {\n  @return _mat-get-type-value($config, $level, letter-spacing);\n}\n\n// Gets the font-family from a typography config and removes the quotes around it.\n@function font-family($config, $level: null) {\n  $font-family: map.get($config, font-family);\n\n  @if $level != null {\n    $font-family: _mat-get-type-value($config, $level, font-family);\n  }\n\n  // Guard against unquoting non-string values, because it's deprecated.\n  @return if(meta.type-of($font-family) == string, string.unquote($font-family), $font-family);\n}\n\n// Outputs the shorthand `font` CSS property, based on a set of typography values. Falls back to\n// the individual properties if a value that isn't allowed in the shorthand is passed in.\n@mixin font-shorthand($font-size, $font-weight, $line-height, $font-family) {\n  // If any of the values are set to `inherit`, we can't use the shorthand\n  // so we fall back to passing in the individual properties.\n  @if ($font-size == inherit or\n       $font-weight == inherit or\n       $line-height == inherit or\n       $font-family == inherit or\n       $font-size == null or\n       $font-weight == null or\n       $line-height == null or\n       $font-family == null) {\n\n    font-size: $font-size;\n    font-weight: $font-weight;\n    line-height: $line-height;\n    font-family: $font-family;\n  }\n  @else {\n    // Otherwise use the shorthand `font`, because it's the least amount of bytes. Note\n    // that we need to use interpolation for `font-size/line-height` in order to prevent\n    // Sass from dividing the two values.\n    font: $font-weight #{$font-size}/#{$line-height} $font-family;\n  }\n}\n\n// Converts a typography level into CSS styles.\n@mixin typography-level($config, $level) {\n  $font-size: font-size($config, $level);\n  $font-weight: font-weight($config, $level);\n  $line-height: line-height($config, $level);\n  $font-family: font-family($config, $level);\n\n  @include font-shorthand($font-size, $font-weight, $line-height, $font-family);\n  letter-spacing: letter-spacing($config, $level);\n}\n","@use 'sass:map';\n@use '../core/style/private';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-bottom-sheet-container {\n    @include private.private-theme-elevation(16, $config);\n    background: theming.get-color-from-palette($background, dialog);\n    color: theming.get-color-from-palette($foreground, text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-bottom-sheet-container {\n    @include typography-utils.typography-level($config, body-1);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-bottom-sheet') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use '../core/theming/theming';\n@use '../core/style/private';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n$_ripple-opacity: 0.1;\n\n// Applies a focus style to an mat-button element for each of the supported palettes.\n@mixin _focus-overlay-color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n\n  &.mat-primary .mat-button-focus-overlay {\n    background-color: theming.get-color-from-palette($primary);\n  }\n\n  &.mat-accent .mat-button-focus-overlay {\n    background-color: theming.get-color-from-palette($accent);\n  }\n\n  &.mat-warn .mat-button-focus-overlay {\n    background-color: theming.get-color-from-palette($warn);\n  }\n\n  &.mat-button-disabled .mat-button-focus-overlay {\n    background-color: transparent;\n  }\n}\n\n// Applies the background color for a ripple. If the value provided is not a Sass color,\n// we assume that we've been given a CSS variable. Since we can't perform alpha-blending\n// on a CSS variable, we instead add the opacity directly to the ripple element.\n@mixin _ripple-background($palette, $hue, $opacity) {\n  $background-color: theming.get-color-from-palette($palette, $hue, $opacity);\n  background-color: $background-color;\n  @if (meta.type-of($background-color) != color) {\n    opacity: $opacity;\n  }\n}\n\n@mixin _ripple-color($theme, $hue, $opacity: $_ripple-opacity) {\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    @include _ripple-background($primary, $hue, $opacity);\n  }\n\n  &.mat-accent .mat-ripple-element {\n    @include _ripple-background($accent, $hue, $opacity);\n  }\n\n  &.mat-warn .mat-ripple-element {\n    @include _ripple-background($warn, $hue, $opacity);\n  }\n}\n\n// Applies a property to an mat-button element for each of the supported palettes.\n@mixin _theme-property($theme, $property, $hue) {\n  $primary: map.get($theme, primary);\n  $accent: map.get($theme, accent);\n  $warn: map.get($theme, warn);\n  $background: map.get($theme, background);\n  $foreground: map.get($theme, foreground);\n\n  &.mat-primary {\n    #{$property}: theming.get-color-from-palette($primary, $hue);\n  }\n  &.mat-accent {\n    #{$property}: theming.get-color-from-palette($accent, $hue);\n  }\n  &.mat-warn {\n    #{$property}: theming.get-color-from-palette($warn, $hue);\n  }\n\n  &.mat-primary, &.mat-accent, &.mat-warn, &.mat-button-disabled {\n    &.mat-button-disabled {\n      $palette: if($property == 'color', $foreground, $background);\n      #{$property}: theming.get-color-from-palette($palette, disabled-button);\n    }\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-button, .mat-icon-button, .mat-stroked-button {\n    // Buttons without a background color should inherit the font color. This is necessary to\n    // ensure that the button is readable on custom background colors. It's wrong to always assume\n    // that those buttons are always placed inside of containers with the default background\n    // color of the theme (e.g. themed toolbars).\n    color: inherit;\n    background: transparent;\n\n    @include _theme-property($config, 'color', text);\n    @include _focus-overlay-color($config);\n\n    // Setup the ripple color to be based on the text color. This ensures that the ripples\n    // are matching with the current theme palette and are in contrast to the background color\n    // (e.g in themed toolbars).\n    .mat-ripple-element {\n      opacity: $_ripple-opacity;\n      background-color: currentColor;\n    }\n  }\n\n  .mat-button-focus-overlay {\n    background: map.get($foreground, base);\n  }\n\n  // Note: this needs a bit extra specificity, because we're not guaranteed the inclusion\n  // order of the theme styles and the button reset may end up resetting this as well.\n  .mat-stroked-button:not(.mat-button-disabled) {\n    border-color: theming.get-color-from-palette($foreground, divider);\n  }\n\n  .mat-flat-button, .mat-raised-button, .mat-fab, .mat-mini-fab {\n    // Default font and background color when not using any color palette.\n    color: theming.get-color-from-palette($foreground, text);\n    background-color: theming.get-color-from-palette($background, raised-button);\n\n    @include _theme-property($config, 'color', default-contrast);\n    @include _theme-property($config, 'background-color', default);\n    @include _ripple-color($config, default-contrast);\n  }\n\n  .mat-stroked-button, .mat-flat-button {\n    @include private.private-theme-overridable-elevation(0, $config);\n  }\n\n  .mat-raised-button {\n    @include private.private-theme-overridable-elevation(2, $config);\n\n    &:not(.mat-button-disabled):active {\n      @include private.private-theme-overridable-elevation(8, $config);\n    }\n\n    &.mat-button-disabled {\n      @include private.private-theme-overridable-elevation(0, $config);\n    }\n  }\n\n  .mat-fab, .mat-mini-fab {\n    @include private.private-theme-overridable-elevation(6, $config);\n\n    &:not(.mat-button-disabled):active {\n      @include private.private-theme-overridable-elevation(12, $config);\n    }\n\n    &.mat-button-disabled {\n      @include private.private-theme-overridable-elevation(0, $config);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-button, .mat-raised-button, .mat-icon-button, .mat-stroked-button,\n  .mat-flat-button, .mat-fab, .mat-mini-fab {\n    font: {\n      family: typography-utils.font-family($config, button);\n      size: typography-utils.font-size($config, button);\n      weight: typography-utils.font-weight($config, button);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-button') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/style/private';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-card {\n    @include private.private-theme-overridable-elevation(1, $config);\n    background: theming.get-color-from-palette($background, card);\n    color: theming.get-color-from-palette($foreground, text);\n\n    // Needs extra specificity to be able to override the elevation selectors.\n    &.mat-card-flat {\n      @include private.private-theme-overridable-elevation(0, $config);\n    }\n  }\n\n  .mat-card-subtitle {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-card {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-card-title {\n    font: {\n      size: typography-utils.font-size($config, headline);\n      weight: typography-utils.font-weight($config, title);\n    }\n  }\n\n  .mat-card-header .mat-card-title {\n    font-size: typography-utils.font-size($config, title);\n  }\n\n  .mat-card-subtitle,\n  .mat-card-content {\n    font-size: typography-utils.font-size($config, body-1);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-card') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $is-dark-theme: map.get($config, is-dark);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n\n  // The color of the checkbox's checkmark / mixedmark.\n  $checkbox-mark-color: theming.get-color-from-palette($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: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-checkbox-checkmark {\n    fill: $checkbox-mark-color;\n  }\n\n  .mat-checkbox-checkmark-path {\n    // !important is needed here because a stroke must be set as an\n    // attribute on the SVG in order for line animation to work properly.\n    stroke: $checkbox-mark-color !important;\n  }\n\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: theming.get-color-from-palette($primary);\n    }\n\n    &.mat-accent .mat-checkbox-background {\n      background-color: theming.get-color-from-palette($accent);\n    }\n\n    &.mat-warn .mat-checkbox-background {\n      background-color: theming.get-color-from-palette($warn);\n    }\n  }\n\n  .mat-checkbox-disabled {\n    &.mat-checkbox-checked,\n    &.mat-checkbox-indeterminate {\n      .mat-checkbox-background {\n        background-color: $disabled-color;\n      }\n    }\n\n    &:not(.mat-checkbox-checked) {\n      .mat-checkbox-frame {\n        border-color: $disabled-color;\n      }\n    }\n\n    .mat-checkbox-label {\n      color: theming.get-color-from-palette($foreground, secondary-text);\n    }\n  }\n\n  // Switch this to a solid color since we're using `opacity`\n  // to control how opaque the ripple should be.\n  .mat-checkbox .mat-ripple-element {\n    background-color: map.get(map.get($config, foreground), base);\n  }\n\n  .mat-checkbox-checked:not(.mat-checkbox-disabled),\n  .mat-checkbox:active:not(.mat-checkbox-disabled) {\n    &.mat-primary .mat-ripple-element {\n      background: theming.get-color-from-palette($primary);\n    }\n\n    &.mat-accent .mat-ripple-element {\n      background: theming.get-color-from-palette($accent);\n    }\n\n    &.mat-warn .mat-ripple-element {\n      background: theming.get-color-from-palette($warn);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-checkbox {\n    font-family: typography-utils.font-family($config);\n  }\n\n  // TODO(kara): Remove this style when fixing vertical baseline\n  .mat-checkbox-layout .mat-checkbox-label {\n    line-height: typography-utils.line-height($config, body-2);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-checkbox') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use '../core/style/private';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n$chip-remove-font-size: 18px;\n\n@mixin _element-color($foreground, $background) {\n  background-color: $background;\n  color: $foreground;\n\n  .mat-chip-remove {\n    color: $foreground;\n    opacity: 0.4;\n  }\n}\n\n\n// Applies the background color for a ripple element.\n// If the color value provided is not a Sass color,\n// we assume that we've been given a CSS variable.\n// Since we can't perform alpha-blending on a CSS variable,\n// we instead add the opacity directly to the ripple element.\n@mixin _ripple-background($palette, $default-contrast, $opacity) {\n  $background-color: theming.get-color-from-palette($palette, $default-contrast, $opacity);\n  background-color: $background-color;\n  @if (meta.type-of($background-color) != color) {\n    opacity: $opacity;\n  }\n}\n\n@mixin _palette-styles($palette) {\n  @include _element-color(theming.get-color-from-palette($palette, default-contrast),\n    theming.get-color-from-palette($palette));\n\n  .mat-ripple-element {\n    @include _ripple-background($palette, default-contrast, 0.1);\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $is-dark-theme: map.get($config, is-dark);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  $unselected-background: theming.get-color-from-palette($background, unselected-chip);\n  $unselected-foreground: theming.get-color-from-palette($foreground, text);\n\n  .mat-chip.mat-standard-chip {\n    @include _element-color($unselected-foreground, $unselected-background);\n\n    &:not(.mat-chip-disabled) {\n      &:active {\n        @include private.private-theme-elevation(3, $config);\n      }\n\n      .mat-chip-remove:hover {\n        opacity: 0.54;\n      }\n    }\n\n    &.mat-chip-disabled {\n      opacity: 0.4;\n    }\n\n    &::after {\n      background: map.get($foreground, base);\n    }\n  }\n\n  .mat-chip.mat-standard-chip.mat-chip-selected {\n    &.mat-primary {\n      @include _palette-styles($primary);\n    }\n\n    &.mat-warn {\n      @include _palette-styles($warn);\n    }\n\n    &.mat-accent {\n      @include _palette-styles($accent);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-chip {\n    font-size: typography-utils.font-size($config, body-2);\n    font-weight: typography-utils.font-weight($config, body-2);\n\n    .mat-chip-trailing-icon.mat-icon,\n    .mat-chip-remove.mat-icon {\n      font-size: $chip-remove-font-size;\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-chips') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-table {\n    background: theming.get-color-from-palette($background, 'card');\n  }\n\n  .mat-table thead, .mat-table tbody, .mat-table tfoot,\n  mat-header-row, mat-row, mat-footer-row,\n  [mat-header-row], [mat-row], [mat-footer-row],\n  .mat-table-sticky {\n    background: inherit;\n  }\n\n  mat-row, mat-header-row, mat-footer-row,\n  th.mat-header-cell, td.mat-cell, td.mat-footer-cell {\n    border-bottom-color: theming.get-color-from-palette($foreground, divider);\n  }\n\n  .mat-header-cell {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-cell, .mat-footer-cell {\n    color: theming.get-color-from-palette($foreground, text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-table {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-header-cell {\n    font-size: typography-utils.font-size($config, caption);\n    font-weight: typography-utils.font-weight($config, body-2);\n  }\n\n  .mat-cell, .mat-footer-cell {\n    font-size: typography-utils.font-size($config, body-1);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-table') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:color';\n@use 'sass:map';\n@use 'sass:math';\n@use 'sass:meta';\n@use '../core/style/private';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n$selected-today-box-shadow-width: 1px;\n$selected-fade-amount: 0.6;\n$range-fade-amount: 0.2;\n$today-fade-amount: 0.2;\n$calendar-body-font-size: 13px !default;\n$calendar-weekday-table-font-size: 11px !default;\n\n@mixin _color($palette) {\n  @include date-range-colors(\n    theming.get-color-from-palette($palette, default, $range-fade-amount));\n\n  .mat-calendar-body-selected {\n    background-color: theming.get-color-from-palette($palette);\n    color: theming.get-color-from-palette($palette, default-contrast);\n  }\n\n  .mat-calendar-body-disabled > .mat-calendar-body-selected {\n    $background: theming.get-color-from-palette($palette);\n\n    @if (meta.type-of($background) == color) {\n      background-color: color.adjust($background, $alpha: -$selected-fade-amount);\n    }\n    @else {\n      // If we couldn't resolve to background to a color (e.g. it's a CSS variable),\n      // fall back to fading the content out via `opacity`.\n      opacity: $today-fade-amount;\n    }\n  }\n\n  .mat-calendar-body-today.mat-calendar-body-selected {\n    box-shadow: inset 0 0 0 $selected-today-box-shadow-width\n                theming.get-color-from-palette($palette, default-contrast);\n  }\n\n  .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover,\n  .cdk-keyboard-focused .mat-calendar-body-active,\n  .cdk-program-focused .mat-calendar-body-active {\n    & > .mat-calendar-body-cell-content {\n      @include _unselected-cell {\n        background-color: theming.get-color-from-palette($palette, 0.3);\n      }\n    }\n  }\n}\n\n// Utility mixin to target cells that aren't selected. Used to make selector easier to follow.\n@mixin _unselected-cell {\n  &:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {\n    @content;\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n  $disabled-color: theming.get-color-from-palette($foreground, disabled-text);\n\n  .mat-calendar-arrow {\n    border-top-color: theming.get-color-from-palette($foreground, icon);\n  }\n\n  // The prev/next buttons need a bit more specificity to\n  // avoid being overwritten by the .mat-icon-button.\n  .mat-datepicker-toggle,\n  .mat-datepicker-content .mat-calendar-next-button,\n  .mat-datepicker-content .mat-calendar-previous-button {\n    color: theming.get-color-from-palette($foreground, icon);\n  }\n\n  .mat-calendar-table-header {\n    color: theming.get-color-from-palette($foreground, hint-text);\n  }\n\n  .mat-calendar-table-header-divider::after {\n    background: theming.get-color-from-palette($foreground, divider);\n  }\n\n  .mat-calendar-body-label {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-calendar-body-cell-content,\n  .mat-date-range-input-separator {\n    color: theming.get-color-from-palette($foreground, text);\n    border-color: transparent;\n  }\n\n  .mat-calendar-body-disabled > .mat-calendar-body-cell-content {\n    @include _unselected-cell {\n      color: $disabled-color;\n    }\n  }\n\n  .mat-form-field-disabled .mat-date-range-input-separator {\n    color: $disabled-color;\n  }\n\n  .mat-calendar-body-in-preview {\n    $divider-color: theming.get-color-from-palette($foreground, divider);\n\n    @if meta.type-of($divider-color) == color {\n      // The divider color is set under the assumption that it'll be used\n      // for a solid border, but because we're using a dashed border for the\n      // preview range, we need to bump its opacity to ensure that it's visible.\n      color: rgba($divider-color, math.min(opacity($divider-color) * 2, 1));\n    }\n    @else {\n      color: $divider-color;\n    }\n  }\n\n  .mat-calendar-body-today {\n    @include _unselected-cell {\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: theming.get-color-from-palette($foreground, hint-text);\n    }\n  }\n\n  .mat-calendar-body-disabled > .mat-calendar-body-today {\n    @include _unselected-cell {\n      $color: theming.get-color-from-palette($foreground, hint-text);\n\n      @if (meta.type-of($color) == color) {\n        border-color: color.adjust($color, $alpha: -$today-fade-amount);\n      }\n      @else {\n        // If the color didn't resolve to a color value, but something like a CSS variable, we can't\n        // fade it out so we fall back to reducing the element opacity. Note that we don't use the\n        // $mat-datepicker-today-fade-amount, because hint text usually has some opacity applied\n        // to it already and we don't want them to stack on top of each other.\n        opacity: 0.5;\n      }\n    }\n  }\n\n  @include _color(map.get($config, primary));\n\n  .mat-datepicker-content {\n    @include private.private-theme-elevation(4, $config);\n    background-color: theming.get-color-from-palette($background, card);\n    color: theming.get-color-from-palette($foreground, text);\n\n    &.mat-accent {\n      @include _color(map.get($config, accent));\n    }\n\n    &.mat-warn {\n      @include _color(map.get($config, warn));\n    }\n  }\n\n  .mat-datepicker-content-touch {\n    @include private.private-theme-elevation(24, $config);\n  }\n\n  .mat-datepicker-toggle-active {\n    color: theming.get-color-from-palette(map.get($config, primary), text);\n\n    &.mat-accent {\n      color: theming.get-color-from-palette(map.get($config, accent), text);\n    }\n\n    &.mat-warn {\n      color: theming.get-color-from-palette(map.get($config, warn), text);\n    }\n  }\n\n  .mat-date-range-input-inner[disabled] {\n    color: theming.get-color-from-palette($foreground, disabled-text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-calendar {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-calendar-body {\n    font-size: $calendar-body-font-size;\n  }\n\n  .mat-calendar-body-label,\n  .mat-calendar-period-button {\n    font: {\n      size: typography-utils.font-size($config, button);\n      weight: typography-utils.font-weight($config, button);\n    }\n  }\n\n  .mat-calendar-table-header th {\n    font: {\n      size: $calendar-weekday-table-font-size;\n      weight: typography-utils.font-weight($config, body-1);\n    }\n  }\n}\n\n@mixin date-range-colors(\n  $range-color,\n  $comparison-color: rgba(#f9ab00, $range-fade-amount),\n  $overlap-color: #a8dab5,\n  $overlap-selected-color: color.adjust($overlap-color, $lightness: -30%)) {\n\n  .mat-calendar-body-in-range::before {\n    background: $range-color;\n  }\n\n  .mat-calendar-body-comparison-identical,\n  .mat-calendar-body-in-comparison-range::before {\n    background: $comparison-color;\n  }\n\n  .mat-calendar-body-comparison-bridge-start::before,\n  [dir='rtl'] .mat-calendar-body-comparison-bridge-end::before {\n    background: linear-gradient(to right, $range-color 50%, $comparison-color 50%);\n  }\n\n  .mat-calendar-body-comparison-bridge-end::before,\n  [dir='rtl'] .mat-calendar-body-comparison-bridge-start::before {\n    background: linear-gradient(to left, $range-color 50%, $comparison-color 50%);\n  }\n\n  .mat-calendar-body-in-range > .mat-calendar-body-comparison-identical,\n  .mat-calendar-body-in-comparison-range.mat-calendar-body-in-range::after {\n    background: $overlap-color;\n  }\n\n  .mat-calendar-body-comparison-identical.mat-calendar-body-selected,\n  .mat-calendar-body-in-comparison-range > .mat-calendar-body-selected {\n    background: $overlap-selected-color;\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-datepicker') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/style/private';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-dialog-container {\n    @include private.private-theme-elevation(24, $config);\n    background: theming.get-color-from-palette($background, dialog);\n    color: theming.get-color-from-palette($foreground, text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-dialog-title {\n    @include typography-utils.typography-level($config, title);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-dialog') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/density/private/compatibility';\n@use '../core/theming/theming';\n@use '../core/style/private';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use './expansion-variables';\n@use './expansion-mixins';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-expansion-panel {\n    @include private.private-theme-overridable-elevation(2, $config);\n    background: theming.get-color-from-palette($background, card);\n    color: theming.get-color-from-palette($foreground, text);\n  }\n\n  .mat-action-row {\n    border-top-color: theming.get-color-from-palette($foreground, divider);\n  }\n\n  @include expansion-mixins.private-expansion-focus {\n    background: theming.get-color-from-palette($background, hover);\n  }\n\n  // Disable the hover on touch devices since it can appear like it is stuck. We can't use\n  // `@media (hover)` above, because the desktop support browser support isn't great.\n  @media (hover: none) {\n    .mat-expansion-panel:not(.mat-expanded):not([aria-disabled='true'])\n      .mat-expansion-panel-header:hover {\n      background: theming.get-color-from-palette($background, card);\n    }\n  }\n\n  .mat-expansion-panel-header-title {\n    color: theming.get-color-from-palette($foreground, text);\n  }\n\n  .mat-expansion-panel-header-description,\n  .mat-expansion-indicator::after {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-expansion-panel-header[aria-disabled='true'] {\n    color: theming.get-color-from-palette($foreground, disabled-button);\n\n    .mat-expansion-panel-header-title,\n    .mat-expansion-panel-header-description {\n      color: inherit;\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-expansion-panel-header {\n    font: {\n      family: typography-utils.font-family($config, subheading-1);\n      size: typography-utils.font-size($config, subheading-1);\n      weight: typography-utils.font-weight($config, subheading-1);\n    }\n  }\n\n  .mat-expansion-panel-content {\n    @include typography-utils.typography-level($config, body-1);\n  }\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  $expanded-height: compatibility.private-density-prop-value(\n        expansion-variables.$header-density-config, $density-scale, expanded-height);\n  $collapsed-height: compatibility.private-density-prop-value(\n      expansion-variables.$header-density-config, $density-scale, collapsed-height);\n\n  @include compatibility.private-density-legacy-compatibility() {\n    .mat-expansion-panel-header {\n      height: $collapsed-height;\n\n      &.mat-expanded {\n        height: $expanded-height;\n      }\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-expansion') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n@use './form-field-fill-theme.scss';\n@use './form-field-legacy-theme.scss';\n@use './form-field-outline-theme.scss';\n@use './form-field-standard-theme.scss';\n\n// Color styles that apply to all appearances of the form-field.\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n  $is-dark-theme: map.get($config, is-dark);\n\n  // Label colors. Required is used for the `*` star shown in the label.\n  $label-color:\n    theming.get-color-from-palette($foreground, secondary-text, if($is-dark-theme, 0.7, 0.6));\n  $focused-label-color: theming.get-color-from-palette($primary, text);\n  $required-label-color: theming.get-color-from-palette($accent, text);\n\n  // Underline colors.\n  $underline-color-base:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 1, 0.87));\n  $underline-color-accent: theming.get-color-from-palette($accent, text);\n  $underline-color-warn: theming.get-color-from-palette($warn, text);\n  $underline-focused-color: theming.get-color-from-palette($primary, text);\n\n  .mat-form-field-label {\n    color: $label-color;\n  }\n\n  .mat-hint {\n    color: $label-color;\n  }\n\n  .mat-form-field.mat-focused .mat-form-field-label {\n    color: $focused-label-color;\n\n    &.mat-accent {\n      color: $underline-color-accent;\n    }\n\n    &.mat-warn {\n      color: $underline-color-warn;\n    }\n  }\n\n  .mat-focused .mat-form-field-required-marker {\n    color: $required-label-color;\n  }\n\n  .mat-form-field-ripple {\n    background-color: $underline-color-base;\n  }\n\n  .mat-form-field.mat-focused {\n    .mat-form-field-ripple {\n      background-color: $underline-focused-color;\n\n      &.mat-accent {\n        background-color: $underline-color-accent;\n      }\n\n      &.mat-warn {\n        background-color: $underline-color-warn;\n      }\n    }\n  }\n\n  .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) {\n    .mat-form-field-infix::after {\n      color: $underline-focused-color;\n    }\n\n    &.mat-accent .mat-form-field-infix::after {\n      color: $underline-color-accent;\n    }\n\n    &.mat-warn .mat-form-field-infix::after {\n      color: $underline-color-warn;\n    }\n  }\n\n  // Styling for the error state of the form field. Note that while the same can be\n  // achieved with the ng-* classes, we use this approach in order to ensure that the same\n  // logic is used to style the error state and to show the error messages.\n  .mat-form-field.mat-form-field-invalid {\n    .mat-form-field-label {\n      color: $underline-color-warn;\n\n      &.mat-accent,\n      .mat-form-field-required-marker {\n        color: $underline-color-warn;\n      }\n    }\n\n    .mat-form-field-ripple,\n    .mat-form-field-ripple.mat-accent {\n      background-color: $underline-color-warn;\n    }\n  }\n\n  .mat-error {\n    color: $underline-color-warn;\n  }\n\n  @include form-field-legacy-theme.legacy-color($config);\n  @include form-field-standard-theme.standard-color($config);\n  @include form-field-fill-theme.fill-color($config);\n  @include form-field-outline-theme.outline-color($config);\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _label-floating($font-scale, $infix-padding, $infix-margin-top) {\n  transform: translateY(-$infix-margin-top - $infix-padding + $dedupe)\n             scale($font-scale);\n  width: 100% / $font-scale + $dedupe;\n\n  $dedupe: $dedupe + 0.00001 !global;\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  // The unit-less line-height from the font config.\n  $line-height: typography-utils.line-height($config, input);\n\n  // The amount to scale the font for the floating label and subscript.\n  $subscript-font-scale: 0.75;\n  // The amount to scale the font for the prefix and suffix icons.\n  $prefix-suffix-icon-font-scale: 1.5;\n\n  // The padding on the infix. Mocks show half of the text size.\n  $infix-padding: 0.5em;\n  // The margin applied to the form-field-infix to reserve space for the floating label.\n  $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n  // Font size to use for the label and subscript text.\n  $subscript-font-size: $subscript-font-scale * 100%;\n  // Font size to use for the for the prefix and suffix icons.\n  $prefix-suffix-icon-font-size: $prefix-suffix-icon-font-scale * 100%;\n  // The space between the bottom of the .mat-form-field-flex area and the subscript wrapper.\n  // Mocks show half of the text size, but this margin is applied to an element with the subscript\n  // text font size, so we need to divide by the scale factor to make it half of the original text\n  // size.\n  $subscript-margin-top: 0.5em / $subscript-font-scale;\n  // The padding applied to the form-field-wrapper to reserve space for the subscript, since it's\n  // absolutely positioned. This is a combination of the subscript's margin and line-height, but we\n  // need to multiply by the subscript font scale factor since the wrapper has a larger font size.\n  $wrapper-padding-bottom: ($subscript-margin-top + $line-height) * $subscript-font-scale;\n\n  .mat-form-field {\n    @include typography-utils.typography-level($config, input);\n  }\n\n  .mat-form-field-wrapper {\n    padding-bottom: $wrapper-padding-bottom;\n  }\n\n  .mat-form-field-prefix,\n  .mat-form-field-suffix {\n    // Allow icons in a prefix or suffix to adapt to the correct size.\n    .mat-icon {\n      font-size: $prefix-suffix-icon-font-size;\n      line-height: $line-height;\n    }\n\n    // Allow icon buttons in a prefix or suffix to adapt to the correct size.\n    .mat-icon-button {\n      height: $prefix-suffix-icon-font-scale * 1em;\n      width: $prefix-suffix-icon-font-scale * 1em;\n\n      .mat-icon {\n        height: $line-height * 1em;\n        line-height: $line-height;\n      }\n    }\n  }\n\n  .mat-form-field-infix {\n    padding: $infix-padding 0;\n    // Throws off the baseline if we do it as a real margin, so we do it as a border instead.\n    border-top: $infix-margin-top solid transparent;\n  }\n\n  .mat-form-field-can-float {\n    &.mat-form-field-should-float .mat-form-field-label,\n    .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n      @include _label-floating(\n              $subscript-font-scale, $infix-padding, $infix-margin-top);\n    }\n\n    // Server-side rendered matInput with a label attribute but label not shown\n    // (used as a pure CSS stand-in for mat-form-field-should-float).\n    .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n        .mat-form-field-label {\n      @include _label-floating(\n              $subscript-font-scale, $infix-padding, $infix-margin-top);\n    }\n  }\n\n  .mat-form-field-label-wrapper {\n    top: -$infix-margin-top;\n    padding-top: $infix-margin-top;\n  }\n\n  .mat-form-field-label {\n    top: $infix-margin-top + $infix-padding;\n  }\n\n  .mat-form-field-underline {\n    // We want the underline to start at the end of the content box, not the padding box,\n    // so we move it up by the padding amount.\n    bottom: $wrapper-padding-bottom;\n  }\n\n  .mat-form-field-subscript-wrapper {\n    font-size: $subscript-font-size;\n    margin-top: $subscript-margin-top;\n\n    // We want the subscript to start at the end of the content box, not the padding box,\n    // so we move it up by the padding amount (adjusted for the smaller font size);\n    top: calc(100% - #{$wrapper-padding-bottom / $subscript-font-scale});\n  }\n\n  @include form-field-legacy-theme.legacy-typography($config);\n  @include form-field-standard-theme.standard-typography($config);\n  @include form-field-fill-theme.fill-typography($config);\n  @include form-field-outline-theme.outline-typography($config);\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  @include form-field-legacy-theme.private-form-field-legacy-density($density-scale);\n  @include form-field-standard-theme.private-form-field-standard-density($density-scale);\n  @include form-field-fill-theme.private-form-field-fill-density($density-scale);\n  @include form-field-outline-theme.private-form-field-outline-density($density-scale);\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/style/form-common';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n// Theme styles that only apply to the legacy appearance of the form-field.\n\n@mixin legacy-color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $is-dark-theme: map.get($config, is-dark);\n\n  $label-color: theming.get-color-from-palette($foreground, secondary-text);\n  $underline-color:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 0.7, 0.42));\n\n  .mat-form-field-appearance-legacy {\n    .mat-form-field-label {\n      color: $label-color;\n    }\n\n    .mat-hint {\n      color: $label-color;\n    }\n\n    .mat-form-field-underline {\n      background-color: $underline-color;\n    }\n\n    &.mat-form-field-disabled .mat-form-field-underline {\n      @include form-common.private-control-disabled-underline($underline-color);\n    }\n  }\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$legacy-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _label-floating($font-scale, $infix-padding, $infix-margin-top) {\n  // We use perspective to fix the text blurriness as described here:\n  // http://www.useragentman.com/blog/2014/05/04/fixing-typography-inside-of-2-d-css-transforms/\n  // This results in a small jitter after the label floats on Firefox, which the\n  // translateZ fixes.\n  transform: translateY(-$infix-margin-top - $infix-padding) scale($font-scale) perspective(100px)\n  translateZ(0.001px + $legacy-dedupe);\n  // The tricks above used to smooth out the animation on chrome and firefox actually make things\n  // worse on IE, so we don't include them in the IE version.\n  -ms-transform: translateY(-$infix-margin-top - $infix-padding + $legacy-dedupe)\n                  scale($font-scale);\n\n  width: 100% / $font-scale + $legacy-dedupe;\n\n  $legacy-dedupe: $legacy-dedupe + 0.00001 !global;\n}\n\n// Same as mixin above, but omits the translateZ for printing purposes.\n@mixin _label-floating-print($font-scale, $infix-padding, $infix-margin-top) {\n  // This results in a small jitter after the label floats on Firefox, which the\n  // translateZ fixes.\n  transform: translateY(-$infix-margin-top - $infix-padding + $legacy-dedupe)\n                  scale($font-scale);\n  // The tricks above used to smooth out the animation on chrome and firefox actually make things\n  // worse on IE, so we don't include them in the IE version.\n  $legacy-dedupe: $legacy-dedupe + 0.00001 !global;\n}\n\n@mixin legacy-typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  // The unit-less line-height from the font config.\n  $line-height: typography-utils.line-height($config, input);\n  // The amount to scale the font for the floating label and subscript.\n  $subscript-font-scale: 0.75;\n  // The amount of space between the top of the line and the top of the actual text\n  // (as a fraction of the font-size).\n  $line-spacing: ($line-height - 1) / 2;\n  // The padding on the infix. Mocks show half of the text size, but seem to measure from the edge\n  // of the text itself, not the edge of the line; therefore we subtract off the line spacing.\n  $infix-padding: 0.5em - $line-spacing;\n  // The margin applied to the form-field-infix to reserve space for the floating label.\n  $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n  // The space between the bottom of the .mat-form-field-flex area and the subscript wrapper.\n  // Mocks show half of the text size, but this margin is applied to an element with the subscript\n  // text font size, so we need to divide by the scale factor to make it half of the original text\n  // size. We again need to subtract off the line spacing since the mocks measure to the edge of the\n  // text, not the  edge of the line.\n  $subscript-margin-top: 0.5em / $subscript-font-scale - ($line-spacing * 2);\n  // The padding applied to the form-field-wrapper to reserve space for the subscript, since it's\n  // absolutely positioned. This is a combination of the subscript's margin and line-height, but we\n  // need to multiply by the subscript font scale factor since the wrapper has a larger font size.\n  $wrapper-padding-bottom: ($subscript-margin-top + $line-height) * $subscript-font-scale;\n\n  .mat-form-field-appearance-legacy {\n    .mat-form-field-wrapper {\n      padding-bottom: $wrapper-padding-bottom;\n    }\n\n    .mat-form-field-infix {\n      padding: $infix-padding 0;\n    }\n\n    &.mat-form-field-can-float {\n      &.mat-form-field-should-float .mat-form-field-label,\n      .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding, $infix-margin-top);\n      }\n\n      // @breaking-change 8.0.0 will rely on AutofillMonitor instead.\n      .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper\n      .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding, $infix-margin-top);\n      }\n\n      // Server-side rendered matInput with a label attribute but label not shown\n      // (used as a pure CSS stand-in for mat-form-field-should-float).\n      .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n      .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding, $infix-margin-top);\n      }\n    }\n\n    .mat-form-field-label {\n      top: $infix-margin-top + $infix-padding;\n    }\n\n    .mat-form-field-underline {\n      // We want the underline to start at the end of the content box, not the padding box,\n      // so we move it up by the padding amount.\n      bottom: $wrapper-padding-bottom;\n    }\n\n    .mat-form-field-subscript-wrapper {\n      margin-top: $subscript-margin-top;\n\n      // We want the subscript to start at the end of the content box, not the padding box,\n      // so we move it up by the padding amount (adjusted for the smaller font size);\n      top: calc(100% - #{$wrapper-padding-bottom / $subscript-font-scale});\n    }\n  }\n\n  // translateZ causes the label to not appear while printing, so we override it to not\n  // apply translateZ while printing\n  @media print {\n    .mat-form-field-appearance-legacy {\n      &.mat-form-field-can-float {\n        &.mat-form-field-should-float .mat-form-field-label,\n        .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n          @include _label-floating-print(\n                  $subscript-font-scale, $infix-padding, $infix-margin-top);\n        }\n\n        // @breaking-change 8.0.0 will rely on AutofillMonitor instead.\n        .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper\n        .mat-form-field-label {\n          @include _label-floating-print(\n                  $subscript-font-scale, $infix-padding, $infix-margin-top);\n        }\n\n        // Server-side rendered matInput with a label attribute but label not shown\n        // (used as a pure CSS stand-in for mat-form-field-should-float).\n        .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n        .mat-form-field-label {\n          @include _label-floating-print(\n                  $subscript-font-scale, $infix-padding, $infix-margin-top);\n        }\n      }\n    }\n  }\n}\n\n@mixin private-form-field-legacy-density($config-or-theme) {}\n\n@mixin legacy-theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field-legacy') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include legacy-color($color);\n    }\n    @if $density != null {\n      @include private-form-field-legacy-density($density);\n    }\n    @if $typography != null {\n      @include legacy-typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n// Theme styles that only apply to the fill appearance of the form-field.\n\n@mixin fill-color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $is-dark-theme: map.get($config, is-dark);\n\n  $fill-background:\n    theming.get-color-from-palette($foreground, base, if($is-dark-theme, 0.1, 0.04));\n  $fill-disabled-background:\n    theming.get-color-from-palette($foreground, base, if($is-dark-theme, 0.05, 0.02));\n  $underline-color:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 0.5, 0.42));\n  $label-disabled-color: theming.get-color-from-palette($foreground, disabled-text);\n\n  .mat-form-field-appearance-fill {\n    .mat-form-field-flex {\n      background-color: $fill-background;\n    }\n\n    &.mat-form-field-disabled .mat-form-field-flex {\n      background-color: $fill-disabled-background;\n    }\n\n    .mat-form-field-underline::before {\n      background-color: $underline-color;\n    }\n\n    &.mat-form-field-disabled {\n      .mat-form-field-label {\n        color: $label-disabled-color;\n      }\n\n      .mat-form-field-underline::before {\n        background-color: transparent;\n      }\n    }\n  }\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$fill-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _label-floating($font-scale, $infix-padding, $infix-margin-top) {\n  transform: translateY(-$infix-margin-top - $infix-padding + $fill-dedupe)\n             scale($font-scale);\n  width: 100% / $font-scale + $fill-dedupe;\n\n  $fill-dedupe: $fill-dedupe + 0.00001 !global;\n}\n\n@mixin fill-typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  // The unit-less line-height from the font config.\n  $line-height: typography-utils.line-height($config, input);\n  // The amount to scale the font for the floating label and subscript.\n  $subscript-font-scale: 0.75;\n  // The padding on top of the infix.\n  $infix-padding-top: 0.25em;\n  // The padding below the infix.\n  $infix-padding-bottom: 0.75em;\n  // The margin applied to the form-field-infix to reserve space for the floating label.\n  $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n  // The amount we offset the label from the input text in the fill appearance.\n  $fill-appearance-label-offset: -0.5em;\n\n  .mat-form-field-appearance-fill {\n    .mat-form-field-infix {\n      padding: $infix-padding-top 0 $infix-padding-bottom 0;\n    }\n\n    .mat-form-field-label {\n      top: $infix-margin-top + $infix-padding-top;\n      margin-top: $fill-appearance-label-offset;\n    }\n\n    &.mat-form-field-can-float {\n      &.mat-form-field-should-float .mat-form-field-label,\n      .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding-top + $fill-appearance-label-offset,\n                $infix-margin-top);\n      }\n\n      // Server-side rendered matInput with a label attribute but label not shown\n      // (used as a pure CSS stand-in for mat-form-field-should-float).\n      .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n      .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding-top + $fill-appearance-label-offset,\n                $infix-margin-top);\n      }\n    }\n  }\n}\n\n@mixin private-form-field-fill-density($config-or-theme) {}\n\n@mixin fill-theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field-fill') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include fill-color($color);\n    }\n    @if $density != null {\n      @include private-form-field-fill-density($density);\n    }\n    @if $typography != null {\n      @include fill-typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n// Theme styles that only apply to the outline appearance of the form-field.\n\n@mixin outline-color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $foreground: map.get($config, foreground);\n  $is-dark-theme: map.get($config, is-dark);\n\n  $label-disabled-color: theming.get-color-from-palette($foreground, disabled-text);\n  $outline-color:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 0.3, 0.12));\n  $outline-color-hover:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 1, 0.87));\n  $outline-color-primary: theming.get-color-from-palette($primary);\n  $outline-color-accent: theming.get-color-from-palette($accent);\n  $outline-color-warn: theming.get-color-from-palette($warn);\n  $outline-color-disabled:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 0.15, 0.06));\n\n  .mat-form-field-appearance-outline {\n    .mat-form-field-outline {\n      color: $outline-color;\n    }\n\n    .mat-form-field-outline-thick {\n      color: $outline-color-hover;\n    }\n\n    &.mat-focused {\n      .mat-form-field-outline-thick {\n        color: $outline-color-primary;\n      }\n\n      &.mat-accent .mat-form-field-outline-thick {\n        color: $outline-color-accent;\n      }\n\n      &.mat-warn .mat-form-field-outline-thick {\n        color: $outline-color-warn;\n      }\n    }\n\n    // Class repeated so that rule is specific enough to override focused accent color case.\n    &.mat-form-field-invalid.mat-form-field-invalid {\n      .mat-form-field-outline-thick {\n        color: $outline-color-warn;\n      }\n    }\n\n    &.mat-form-field-disabled {\n      .mat-form-field-label {\n        color: $label-disabled-color;\n      }\n\n      .mat-form-field-outline {\n        color: $outline-color-disabled;\n      }\n    }\n  }\n}\n\n// Used to make instances of the _mat-form-field-label-floating mixin negligibly different,\n// and prevent Google's CSS Optimizer from collapsing the declarations. This is needed because some\n// of the selectors contain pseudo-classes not recognized in all browsers. If a browser encounters\n// an unknown pseudo-class it will discard the entire rule set.\n$outline-dedupe: 0;\n\n// Applies a floating label above the form field control itself.\n@mixin _label-floating($font-scale, $infix-padding, $infix-margin-top) {\n  transform: translateY(-$infix-margin-top - $infix-padding + $outline-dedupe)\n  scale($font-scale);\n  width: 100% / $font-scale + $outline-dedupe;\n\n  $outline-dedupe: $outline-dedupe + 0.00001 !global;\n}\n\n@mixin outline-typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  // The unit-less line-height from the font config.\n  $line-height: typography-utils.line-height($config, input);\n  // The amount to scale the font for the floating label and subscript.\n  $subscript-font-scale: 0.75;\n  // The padding above and below the infix.\n  $infix-padding: 1em;\n  // The margin applied to the form-field-infix to reserve space for the floating label.\n  $infix-margin-top: 1em * $line-height * $subscript-font-scale;\n  // The space between the bottom of the .mat-form-field-flex area and the subscript wrapper.\n  // Mocks show half of the text size, but this margin is applied to an element with the subscript\n  // text font size, so we need to divide by the scale factor to make it half of the original text\n  // size.\n  $subscript-margin-top: 0.5em / $subscript-font-scale;\n  // The padding applied to the form-field-wrapper to reserve space for the subscript, since it's\n  // absolutely positioned. This is a combination of the subscript's margin and line-height, but we\n  // need to multiply by the subscript font scale factor since the wrapper has a larger font size.\n  $wrapper-padding-bottom: ($subscript-margin-top + $line-height) * $subscript-font-scale;\n  // The amount we offset the label from the input text in the outline appearance.\n  $outline-appearance-label-offset: -0.25em;\n\n  .mat-form-field-appearance-outline {\n    .mat-form-field-infix {\n      padding: $infix-padding 0 $infix-padding 0;\n    }\n\n    .mat-form-field-label {\n      top: $infix-margin-top + $infix-padding;\n      margin-top: $outline-appearance-label-offset;\n    }\n\n    &.mat-form-field-can-float {\n      &.mat-form-field-should-float .mat-form-field-label,\n      .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding + $outline-appearance-label-offset,\n                $infix-margin-top);\n      }\n\n      // Server-side rendered matInput with a label attribute but label not shown\n      // (used as a pure CSS stand-in for mat-form-field-should-float).\n      .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper\n      .mat-form-field-label {\n        @include _label-floating(\n                $subscript-font-scale, $infix-padding + $outline-appearance-label-offset,\n                $infix-margin-top);\n      }\n    }\n  }\n}\n\n@mixin private-form-field-outline-density($config-or-theme) {}\n\n@mixin outline-theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field-outline') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include outline-color($color);\n    }\n    @if $density != null {\n      @include private-form-field-outline-density($density);\n    }\n    @if $typography != null {\n      @include outline-typography($typography);\n    }\n  }\n}\n\n","@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/style/list-common';\n\n\n// Include this empty mixin for consistency with the other components.\n@mixin color($config-or-theme) {}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-grid-tile-header,\n  .mat-grid-tile-footer {\n    @include list-common.base(typography-utils.font-size($config, caption));\n    font-size: typography-utils.font-size($config, body-1);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-grid-list') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\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 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 base($secondary-font-size) {\n  .mat-line {\n    @include 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 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 wrapper-base() {\n  @include normalize-text();\n\n  display: flex;\n  flex-direction: column;\n  flex: auto;\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","@use 'sass:map';\n@use '../core/theming/palette';\n@use '../core/theming/theming';\n@use '../core/style/form-common';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/style/vendor-prefixes';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $foreground: map.get($config, foreground);\n\n  .mat-form-field-type-mat-native-select .mat-form-field-infix::after {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-input-element:disabled,\n  .mat-form-field-type-mat-native-select.mat-form-field-disabled .mat-form-field-infix::after {\n    color: theming.get-color-from-palette($foreground, disabled-text);\n  }\n\n  .mat-input-element {\n    caret-color: theming.get-color-from-palette($primary, text);\n\n    @include vendor-prefixes.input-placeholder {\n      color: form-common.private-control-placeholder-color($config);\n    }\n\n    // On dark themes we set the native `select` color to some shade of white,\n    // however the color propagates to all of the `option` elements, which are\n    // always on a white background inside the dropdown, causing them to blend in.\n    // Since we can't change background of the dropdown, we need to explicitly\n    // reset the color of the options to something dark.\n    @if (map.get($config, is-dark)) {\n      option {\n        color: palette.$dark-primary-text;\n      }\n\n      option:disabled {\n        color: palette.$dark-disabled-text;\n      }\n    }\n  }\n\n  .mat-form-field.mat-accent .mat-input-element {\n    caret-color: theming.get-color-from-palette($accent, text);\n  }\n\n  .mat-form-field.mat-warn .mat-input-element,\n  .mat-form-field-invalid .mat-input-element {\n    caret-color: theming.get-color-from-palette($warn, text);\n  }\n\n  .mat-form-field-type-mat-native-select.mat-form-field-invalid .mat-form-field-infix::after {\n    color: theming.get-color-from-palette($warn, text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  // The unit-less line-height from the font config.\n  $line-height: typography-utils.line-height($config, input);\n\n  // The amount of space between the top of the line and the top of the actual text\n  // (as a fraction of the font-size).\n  $line-spacing: ($line-height - 1) / 2;\n\n  // <input> elements seem to have their height set slightly too large on Safari causing the text to\n  // be misaligned w.r.t. the placeholder. Adding this margin corrects it.\n  input.mat-input-element {\n    margin-top: -$line-spacing * 1em;\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-input') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/style/private';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-menu-panel {\n    @include private.private-theme-overridable-elevation(4, $config);\n    background: theming.get-color-from-palette($background, 'card');\n  }\n\n  .mat-menu-item {\n    background: transparent;\n    color: theming.get-color-from-palette($foreground, 'text');\n\n    &[disabled] {\n      &,\n      &::after,\n      .mat-icon-no-color {\n        color: theming.get-color-from-palette($foreground, 'disabled');\n      }\n    }\n  }\n\n  .mat-menu-item .mat-icon-no-color,\n  .mat-menu-item-submenu-trigger::after {\n    color: theming.get-color-from-palette($foreground, 'icon');\n  }\n\n  .mat-menu-item:hover,\n  .mat-menu-item.cdk-program-focused,\n  .mat-menu-item.cdk-keyboard-focused,\n  .mat-menu-item-highlighted {\n    &:not([disabled]) {\n      background: theming.get-color-from-palette($background, 'hover');\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-menu-item {\n    font: {\n      family: typography-utils.font-family($config, body-1);\n      size: typography-utils.font-size($config, body-1);\n      weight: typography-utils.font-weight($config, body-1);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-menu') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/density/private/compatibility';\n@use './paginator-variables';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n\n  .mat-paginator {\n    background: theming.get-color-from-palette($background, 'card');\n  }\n\n  .mat-paginator,\n  .mat-paginator-page-size .mat-select-trigger {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-paginator-decrement,\n  .mat-paginator-increment {\n    border-top: 2px solid theming.get-color-from-palette($foreground, 'icon');\n    border-right: 2px solid theming.get-color-from-palette($foreground, 'icon');\n  }\n\n  .mat-paginator-first,\n  .mat-paginator-last {\n    border-top: 2px solid theming.get-color-from-palette($foreground, 'icon');\n  }\n\n  .mat-icon-button[disabled] {\n    .mat-paginator-decrement,\n    .mat-paginator-increment,\n    .mat-paginator-first,\n    .mat-paginator-last {\n      border-color: theming.get-color-from-palette($foreground, 'disabled');\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-paginator,\n  .mat-paginator-page-size .mat-select-trigger {\n    font: {\n      family: typography-utils.font-family($config, caption);\n      size: typography-utils.font-size($config, caption);\n    }\n  }\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  $height: compatibility.private-density-prop-value(paginator-variables.$density-config,\n    $density-scale, height);\n\n  @include compatibility.private-density-legacy-compatibility() {\n    .mat-paginator-container {\n      min-height: $height;\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-paginator') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/style/private';\n@use '../core/style/form-common';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n\n  .mat-select-value {\n    color: theming.get-color-from-palette($foreground, text);\n  }\n\n  .mat-select-placeholder {\n    color: form-common.private-control-placeholder-color($config);\n  }\n\n  .mat-select-disabled .mat-select-value {\n    color: theming.get-color-from-palette($foreground, disabled-text);\n  }\n\n  .mat-select-arrow {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-select-panel {\n    background: theming.get-color-from-palette($background, card);\n    @include private.private-theme-overridable-elevation(4, $config);\n\n    .mat-option.mat-selected:not(.mat-option-multiple) {\n      background: theming.get-color-from-palette($background, hover, 0.12);\n    }\n  }\n\n  .mat-form-field {\n    &.mat-focused {\n      &.mat-primary .mat-select-arrow {\n        color: theming.get-color-from-palette($primary, text);\n      }\n\n      &.mat-accent .mat-select-arrow {\n        color: theming.get-color-from-palette($accent, text);\n      }\n\n      &.mat-warn .mat-select-arrow {\n        color: theming.get-color-from-palette($warn, text);\n      }\n    }\n\n    .mat-select.mat-select-invalid .mat-select-arrow {\n      color: theming.get-color-from-palette($warn, text);\n    }\n\n    .mat-select.mat-select-disabled .mat-select-arrow {\n      color: theming.get-color-from-palette($foreground, disabled-text);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  // The unit-less line-height from the font config.\n  $line-height: typography-utils.line-height($config, input);\n\n  .mat-select {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-select-trigger {\n    height: $line-height * 1em;\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-select') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n@mixin _inner-content-theme($palette) {\n  .mat-slider-track-fill,\n  .mat-slider-thumb,\n  .mat-slider-thumb-label {\n    background-color: theming.get-color-from-palette($palette);\n  }\n\n  .mat-slider-thumb-label-text {\n    color: theming.get-color-from-palette($palette, default-contrast);\n  }\n\n  .mat-slider-focus-ring {\n    $opacity: 0.2;\n    $color: theming.get-color-from-palette($palette, default, $opacity);\n    background-color: $color;\n\n    // `mat-color` uses `rgba` for the opacity which won't work with\n    // CSS variables so we need to use `opacity` as a fallback.\n    @if (meta.type-of($color) != color) {\n      opacity: $opacity;\n    }\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  $mat-slider-off-color: theming.get-color-from-palette($foreground, slider-off);\n  $mat-slider-off-focused-color: theming.get-color-from-palette($foreground, slider-off-active);\n  $mat-slider-disabled-color: theming.get-color-from-palette($foreground, slider-off);\n  $mat-slider-labeled-min-value-thumb-color:\n    theming.get-color-from-palette($foreground, slider-min);\n  $mat-slider-labeled-min-value-thumb-label-color:\n    theming.get-color-from-palette($foreground, slider-off);\n  $mat-slider-tick-opacity: 0.7;\n  $mat-slider-tick-color:\n    theming.get-color-from-palette($foreground, base, $mat-slider-tick-opacity);\n  $mat-slider-tick-size: 2px;\n\n  .mat-slider-track-background {\n    background-color: $mat-slider-off-color;\n  }\n\n  .mat-primary {\n    @include _inner-content-theme($primary);\n  }\n\n  .mat-accent {\n    @include _inner-content-theme($accent);\n  }\n\n  .mat-warn {\n    @include _inner-content-theme($warn);\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      $opacity: 0.12;\n      $color: theming.get-color-from-palette($foreground, base, $opacity);\n      background-color: $color;\n\n      // `mat-color` uses `rgba` for the opacity which won't work with\n      // CSS variables so we need to use `opacity` as a fallback.\n      @if (meta.type-of($color) != color) {\n        opacity: $opacity;\n      }\n    }\n\n    &.mat-slider-thumb-label-showing {\n      .mat-slider-thumb,\n      .mat-slider-thumb-label {\n        background-color: $mat-slider-labeled-min-value-thumb-color;\n      }\n\n      &.cdk-focused {\n        .mat-slider-thumb,\n        .mat-slider-thumb-label {\n          background-color: $mat-slider-labeled-min-value-thumb-label-color;\n        }\n      }\n    }\n\n    &:not(.mat-slider-thumb-label-showing) {\n      .mat-slider-thumb {\n        border-color: $mat-slider-off-color;\n        background-color: transparent;\n      }\n\n      &:hover,\n      &.cdk-focused {\n        .mat-slider-thumb {\n          border-color: $mat-slider-off-focused-color;\n        }\n\n        &.mat-slider-disabled .mat-slider-thumb {\n          border-color: $mat-slider-disabled-color;\n        }\n      }\n    }\n  }\n\n  .mat-slider-has-ticks .mat-slider-wrapper::after {\n    border-color: $mat-slider-tick-color;\n\n    // `mat-color` uses `rgba` for the opacity which won't work with\n    // CSS variables so we need to use `opacity` as a fallback.\n    @if (meta.type-of($mat-slider-tick-color) != color) {\n      opacity: $mat-slider-tick-opacity;\n    }\n  }\n\n  .mat-slider-horizontal .mat-slider-ticks {\n    background-image: repeating-linear-gradient(to right, $mat-slider-tick-color,\n        $mat-slider-tick-color $mat-slider-tick-size, transparent 0, transparent);\n    // Firefox doesn't draw the gradient correctly with 'to right'\n    // (see https://bugzilla.mozilla.org/show_bug.cgi?id=1314319).\n    background-image: -moz-repeating-linear-gradient(0.0001deg, $mat-slider-tick-color,\n        $mat-slider-tick-color $mat-slider-tick-size, transparent 0, transparent);\n\n    // `mat-color` uses `rgba` for the opacity which won't work with\n    // CSS variables so we need to use `opacity` as a fallback.\n    @if (meta.type-of($mat-slider-tick-color) != color) {\n      opacity: $mat-slider-tick-opacity;\n    }\n  }\n\n  .mat-slider-vertical .mat-slider-ticks {\n    background-image: repeating-linear-gradient(to bottom, $mat-slider-tick-color,\n        $mat-slider-tick-color $mat-slider-tick-size, transparent 0, transparent);\n\n    // `mat-color` uses `rgba` for the opacity which won't work with\n    // CSS variables so we need to use `opacity` as a fallback.\n    @if (meta.type-of($mat-slider-tick-color) != color) {\n      opacity: $mat-slider-tick-opacity;\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-slider-thumb-label-text {\n    font: {\n      family: typography-utils.font-family($config);\n      size: typography-utils.font-size($config, caption);\n      weight: typography-utils.font-weight($config, body-2);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-slider') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/style/private';\n@use '../core/theming/palette';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n@mixin _checked-color($palette, $thumb-checked-hue) {\n  &.mat-checked {\n    .mat-slide-toggle-thumb {\n      background-color: theming.get-color-from-palette($palette, $thumb-checked-hue);\n    }\n\n    .mat-slide-toggle-bar {\n      // Opacity is determined from the specs for the selection controls.\n      // See: https://material.io/design/components/selection-controls.html#specs\n      background-color: theming.get-color-from-palette($palette, $thumb-checked-hue, 0.54);\n    }\n\n    .mat-ripple-element {\n      // Set no opacity for the ripples because the ripple opacity will be adjusted dynamically\n      // based on the type of interaction with the slide-toggle (e.g. for hover, focus)\n      background-color: theming.get-color-from-palette($palette, $thumb-checked-hue);\n    }\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $is-dark: map.get($config, is-dark);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  // Color hues are based on the specs which briefly show the hues that are applied to a switch.\n  // The 2018 specs no longer describe how dark switches should look like. Due to the lack of\n  // information for dark themed switches, we partially keep the old behavior that is based on\n  // the previous specifications. For the checked color we always use the `default` hue because\n  // that follows MDC and also makes it easier for people to create a custom theme without needing\n  // to specify each hue individually.\n  $thumb-unchecked-hue: if($is-dark, 400, 50);\n  $thumb-checked-hue: default;\n\n  $bar-unchecked-color: theming.get-color-from-palette($foreground, disabled);\n  $ripple-unchecked-color: theming.get-color-from-palette($foreground, base);\n\n  .mat-slide-toggle {\n    @include _checked-color($accent, $thumb-checked-hue);\n\n    &.mat-primary {\n      @include _checked-color($primary, $thumb-checked-hue);\n    }\n\n    &.mat-warn {\n      @include _checked-color($warn, $thumb-checked-hue);\n    }\n\n    &:not(.mat-checked) .mat-ripple-element {\n      // Set no opacity for the ripples because the ripple opacity will be adjusted dynamically\n      // based on the type of interaction with the slide-toggle (e.g. for hover, focus)\n      background-color: $ripple-unchecked-color;\n    }\n  }\n\n  .mat-slide-toggle-thumb {\n    @include private.private-theme-elevation(1, $config);\n    background-color: theming.get-color-from-palette(palette.$grey-palette, $thumb-unchecked-hue);\n  }\n\n  .mat-slide-toggle-bar {\n    background-color: $bar-unchecked-color;\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-slide-toggle-content {\n    font-family: typography-utils.font-family($config);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-slide-toggle') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/density/private/compatibility';\n@use './stepper-variables';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n\n  .mat-step-header {\n    &.cdk-keyboard-focused,\n    &.cdk-program-focused,\n    &:hover {\n      background-color: theming.get-color-from-palette($background, hover);\n    }\n\n    // On touch devices the :hover state will linger on the element after a tap.\n    // Reset it via `@media` after the declaration, because the media query isn't\n    // supported by all browsers yet.\n    @media (hover: none) {\n      &:hover {\n        background: none;\n      }\n    }\n\n    .mat-step-label,\n    .mat-step-optional {\n      // TODO(josephperrott): Update to using a corrected disabled-text contrast\n      // instead of secondary-text.\n      color: theming.get-color-from-palette($foreground, secondary-text);\n    }\n\n    .mat-step-icon {\n      // TODO(josephperrott): Update to using a corrected disabled-text contrast\n      // instead of secondary-text.\n      background-color: theming.get-color-from-palette($foreground, secondary-text);\n      color: theming.get-color-from-palette($primary, default-contrast);\n    }\n\n    .mat-step-icon-selected,\n    .mat-step-icon-state-done,\n    .mat-step-icon-state-edit {\n      background-color: theming.get-color-from-palette($primary);\n      color: theming.get-color-from-palette($primary, default-contrast);\n    }\n\n    &.mat-accent {\n      .mat-step-icon {\n        color: theming.get-color-from-palette($accent, default-contrast);\n      }\n\n      .mat-step-icon-selected,\n      .mat-step-icon-state-done,\n      .mat-step-icon-state-edit {\n        background-color: theming.get-color-from-palette($accent);\n        color: theming.get-color-from-palette($accent, default-contrast);\n      }\n    }\n\n    &.mat-warn {\n      .mat-step-icon {\n        color: theming.get-color-from-palette($warn, default-contrast);\n      }\n\n      .mat-step-icon-selected,\n      .mat-step-icon-state-done,\n      .mat-step-icon-state-edit {\n        background-color: theming.get-color-from-palette($warn);\n        color: theming.get-color-from-palette($warn, default-contrast);\n      }\n    }\n\n    .mat-step-icon-state-error {\n      background-color: transparent;\n      color: theming.get-color-from-palette($warn, text);\n    }\n\n    .mat-step-label.mat-step-label-active {\n      color: theming.get-color-from-palette($foreground, text);\n    }\n\n    .mat-step-label.mat-step-label-error {\n      color: theming.get-color-from-palette($warn, text);\n    }\n  }\n\n  .mat-stepper-horizontal, .mat-stepper-vertical {\n    background-color: theming.get-color-from-palette($background, card);\n  }\n\n  .mat-stepper-vertical-line::before {\n    border-left-color: theming.get-color-from-palette($foreground, divider);\n  }\n\n  .mat-horizontal-stepper-header::before,\n  .mat-horizontal-stepper-header::after,\n  .mat-stepper-horizontal-line {\n    border-top-color: theming.get-color-from-palette($foreground, divider);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-stepper-vertical, .mat-stepper-horizontal {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-step-label {\n    font: {\n      size: typography-utils.font-size($config, body-1);\n      weight: typography-utils.font-weight($config, body-1);\n    };\n  }\n\n  .mat-step-sub-label-error {\n    font-weight: normal;\n  }\n\n  .mat-step-label-error {\n    font-size: typography-utils.font-size($config, body-2);\n  }\n\n  .mat-step-label-selected {\n    font: {\n      size: typography-utils.font-size($config, body-2);\n      weight: typography-utils.font-weight($config, body-2);\n    };\n  }\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  $height: compatibility.private-density-prop-value(stepper-variables.$density-config,\n    $density-scale, height);\n  $vertical-padding: ($height - stepper-variables.$label-header-height) / 2;\n\n  @include compatibility.private-density-legacy-compatibility() {\n    .mat-horizontal-stepper-header {\n      height: $height;\n    }\n\n    .mat-stepper-label-position-bottom .mat-horizontal-stepper-header,\n    .mat-vertical-stepper-header {\n      padding: $vertical-padding stepper-variables.$side-gap;\n    }\n\n    // Ensures that the vertical lines for the step content exceed into the step\n    // headers with a given distance (`$mat-stepper-line-gap`) to the step icon.\n    .mat-stepper-vertical-line::before {\n      top: stepper-variables.$line-gap - $vertical-padding;\n      bottom: stepper-variables.$line-gap - $vertical-padding;\n    }\n\n    // Ensures that the horizontal lines for the step header are centered vertically.\n    .mat-stepper-label-position-bottom .mat-horizontal-stepper-header {\n      &::after, &::before {\n        top: $vertical-padding + stepper-variables.$label-header-height / 2;\n      }\n    }\n\n    // Ensures that the horizontal line for the step content is aligned centered vertically.\n    .mat-stepper-label-position-bottom .mat-stepper-horizontal-line {\n      top: $vertical-padding + stepper-variables.$label-header-height / 2;\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-stepper') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n  $header-border: 1px solid theming.get-color-from-palette($foreground, divider);\n\n  .mat-tab-nav-bar,\n  .mat-tab-header {\n    border-bottom: $header-border;\n  }\n\n  .mat-tab-group-inverted-header {\n    .mat-tab-nav-bar,\n    .mat-tab-header {\n      border-top: $header-border;\n      border-bottom: none;\n    }\n  }\n\n  .mat-tab-label, .mat-tab-link {\n    color: theming.get-color-from-palette($foreground, text);\n\n    &.mat-tab-disabled {\n      color: theming.get-color-from-palette($foreground, disabled-text);\n    }\n  }\n\n  .mat-tab-header-pagination-chevron {\n    border-color: theming.get-color-from-palette($foreground, text);\n  }\n\n  .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n    border-color: theming.get-color-from-palette($foreground, disabled-text);\n  }\n\n  // Remove header border when there is a background color\n  .mat-tab-group[class*='mat-background-'] .mat-tab-header,\n  .mat-tab-nav-bar[class*='mat-background-'] {\n    border-bottom: none;\n    border-top: none;\n  }\n\n  .mat-tab-group, .mat-tab-nav-bar {\n    $theme-colors: (\n      primary: $primary,\n      accent: $accent,\n      warn: $warn\n    );\n\n    @each $name, $color in $theme-colors {\n      // Set the foreground color of the tabs\n      &.mat-#{$name} {\n        @include _label-focus-color($color);\n        @include _ink-bar-color($color);\n\n        // Override ink bar when background color is the same\n        &.mat-background-#{$name} {\n          > .mat-tab-header, > .mat-tab-link-container {\n            @include _ink-bar-color($color, default-contrast);\n          }\n        }\n      }\n    }\n\n    @each $name, $color in $theme-colors {\n      // Set background color of the tabs and override focus color\n      &.mat-background-#{$name} {\n        @include _label-focus-color($color);\n        @include _tabs-background($color);\n      }\n    }\n  }\n}\n\n@mixin _ink-bar-color($color, $hue: default) {\n  .mat-ink-bar {\n    background-color: theming.get-color-from-palette($color, $hue);\n  }\n}\n\n@mixin _label-focus-color($tab-focus-color) {\n  .mat-tab-label,\n  .mat-tab-link {\n    &.cdk-keyboard-focused,\n    &.cdk-program-focused {\n      &:not(.mat-tab-disabled) {\n        background-color: theming.get-color-from-palette($tab-focus-color, lighter, 0.3);\n      }\n    }\n  }\n}\n\n@mixin _tabs-background($background-color) {\n  // Note that these selectors target direct descendants so\n  // that the styles don't apply to any nested tab groups.\n\n  // Set background color for the tab group\n  > .mat-tab-header, > .mat-tab-link-container, > .mat-tab-header-pagination {\n    background-color: theming.get-color-from-palette($background-color);\n  }\n\n  // Set labels to contrast against background\n  > .mat-tab-header .mat-tab-label, > .mat-tab-link-container .mat-tab-link {\n    color: theming.get-color-from-palette($background-color, default-contrast);\n\n    &.mat-tab-disabled {\n      color: theming.get-color-from-palette($background-color, default-contrast, 0.4);\n    }\n  }\n\n  // Set pagination chevrons to contrast background\n  > .mat-tab-header .mat-tab-header-pagination-chevron,\n  > .mat-tab-header-pagination .mat-tab-header-pagination-chevron,\n  > .mat-tab-link-container .mat-focus-indicator::before,\n  > .mat-tab-header .mat-focus-indicator::before {\n    border-color: theming.get-color-from-palette($background-color, default-contrast);\n  }\n\n  > .mat-tab-header .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron,\n  > .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {\n    border-color: theming.get-color-from-palette($background-color, default-contrast, 0.4);\n  }\n\n  // Set ripples color to be the contrast color of the new background. Otherwise the ripple\n  // color will be based on the app background color.\n  > .mat-tab-header .mat-ripple-element,\n  > .mat-tab-link-container .mat-ripple-element,\n  > .mat-tab-header-pagination .mat-ripple-element {\n    background-color: theming.get-color-from-palette($background-color, default-contrast, 0.12);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-tab-group {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-tab-label, .mat-tab-link {\n    font: {\n      family: typography-utils.font-family($config, button);\n      size: typography-utils.font-size($config, button);\n      weight: typography-utils.font-weight($config, button);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-tabs') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/density/private/compatibility';\n@use '../core/style/variables';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use './toolbar-variables';\n\n@mixin _height($height) {\n  .mat-toolbar-multiple-rows {\n    min-height: $height;\n  }\n  .mat-toolbar-row, .mat-toolbar-single-row {\n    height: $height;\n  }\n}\n\n@mixin _palette-styles($palette) {\n  background: theming.get-color-from-palette($palette);\n  color: theming.get-color-from-palette($palette, default-contrast);\n}\n\n@mixin _form-field-overrides {\n  .mat-form-field-underline,\n  .mat-form-field-ripple,\n  .mat-focused .mat-form-field-ripple {\n    background-color: currentColor;\n  }\n\n  .mat-form-field-label,\n  .mat-focused .mat-form-field-label,\n  .mat-select-value,\n  .mat-select-arrow,\n  .mat-form-field.mat-focused .mat-select-arrow {\n    color: inherit;\n  }\n\n  .mat-input-element {\n    caret-color: currentColor;\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-toolbar {\n    background: theming.get-color-from-palette($background, app-bar);\n    color: theming.get-color-from-palette($foreground, text);\n\n    &.mat-primary {\n      @include _palette-styles($primary);\n    }\n\n    &.mat-accent {\n      @include _palette-styles($accent);\n    }\n\n    &.mat-warn {\n      @include _palette-styles($warn);\n    }\n\n    @include _form-field-overrides;\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-toolbar,\n  .mat-toolbar h1,\n  .mat-toolbar h2,\n  .mat-toolbar h3,\n  .mat-toolbar h4,\n  .mat-toolbar h5,\n  .mat-toolbar h6 {\n    @include typography-utils.typography-level($config, title);\n    margin: 0;\n  }\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  $height-desktop: compatibility.private-density-prop-value(\n      toolbar-variables.$desktop-density-config, $density-scale, height);\n  $height-mobile: compatibility.private-density-prop-value(\n      toolbar-variables.$mobile-density-config, $density-scale, height);\n\n  @include compatibility.private-density-legacy-compatibility() {\n    // Set the default height for the toolbar.\n    @include _height($height-desktop);\n\n    // As per specs, toolbars should have a different height in mobile devices. This has been\n    // specified in the old guidelines and is still observable in the new specifications by\n    // looking at the spec images. See: https://material.io/design/components/app-bars-top.html#anatomy\n    @media (variables.$xsmall) {\n      @include _height($height-mobile);\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-toolbar') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n$target-height: 22px;\n$font-size: 10px;\n$vertical-padding: ($target-height - $font-size) / 2;\n\n$handset-target-height: 30px;\n$handset-font-size: 14px;\n$handset-vertical-padding:\n    ($handset-target-height - $handset-font-size) / 2;\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n\n  .mat-tooltip {\n    background: theming.get-color-from-palette($background, tooltip, 0.9);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-tooltip {\n    font-family: typography-utils.font-family($config);\n    font-size: $font-size;\n    padding-top: $vertical-padding;\n    padding-bottom: $vertical-padding;\n  }\n\n  .mat-tooltip-handset {\n    font-size: $handset-font-size;\n    padding-top: $handset-vertical-padding;\n    padding-bottom: $handset-vertical-padding;\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-tooltip') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/style/list-common';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-list-base {\n    .mat-list-item {\n      color: theming.get-color-from-palette($foreground, text);\n    }\n\n    .mat-list-option {\n      color: theming.get-color-from-palette($foreground, text);\n    }\n\n    .mat-subheader {\n      color: theming.get-color-from-palette($foreground, secondary-text);\n    }\n  }\n\n  .mat-list-item-disabled {\n    background-color: theming.get-color-from-palette($background, disabled-list-option);\n  }\n\n  .mat-list-option,\n  .mat-nav-list .mat-list-item,\n  .mat-action-list .mat-list-item {\n    &:hover, &:focus {\n      background: theming.get-color-from-palette($background, 'hover');\n    }\n  }\n\n  .mat-list-single-selected-option {\n    &, &:hover, &:focus {\n      background: theming.get-color-from-palette($background, hover, 0.12);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  $font-family: typography-utils.font-family($config);\n\n  .mat-list-item {\n    font-family: $font-family;\n  }\n\n  .mat-list-option {\n    font-family: $font-family;\n  }\n\n  // Default list\n  .mat-list-base {\n    .mat-list-item {\n      font-size: typography-utils.font-size($config, subheading-2);\n      @include list-common.base(typography-utils.font-size($config, body-1));\n    }\n\n    .mat-list-option {\n      font-size: typography-utils.font-size($config, subheading-2);\n      @include list-common.base(typography-utils.font-size($config, body-1));\n    }\n\n    .mat-subheader {\n      font-family: typography-utils.font-family($config, body-2);\n      font-size: typography-utils.font-size($config, body-2);\n      font-weight: typography-utils.font-weight($config, body-2);\n    }\n  }\n\n  // Dense list\n  .mat-list-base[dense] {\n    .mat-list-item {\n      font-size: typography-utils.font-size($config, caption);\n      @include list-common.base(typography-utils.font-size($config, caption));\n    }\n\n    .mat-list-option {\n      font-size: typography-utils.font-size($config, caption);\n      @include list-common.base(typography-utils.font-size($config, caption));\n    }\n\n    .mat-subheader {\n      font-family: $font-family;\n      font-size: typography-utils.font-size($config, caption);\n      font-weight: typography-utils.font-weight($config, body-2);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-list') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../theming/theming';\n@use '../typography/typography';\n@use '../typography/typography-utils';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n\n  .mat-option {\n    color: theming.get-color-from-palette($foreground, text);\n\n    &:hover:not(.mat-option-disabled),\n    &:focus:not(.mat-option-disabled) {\n      background: theming.get-color-from-palette($background, hover);\n    }\n\n    // In multiple mode there is a checkbox to show that the option is selected.\n    &.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {\n      background: theming.get-color-from-palette($background, hover);\n    }\n\n    &.mat-active {\n      background: theming.get-color-from-palette($background, hover);\n      color: theming.get-color-from-palette($foreground, text);\n    }\n\n    &.mat-option-disabled {\n      color: theming.get-color-from-palette($foreground, hint-text);\n    }\n  }\n\n  .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {\n    color: theming.get-color-from-palette($primary, text);\n  }\n\n  .mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {\n    color: theming.get-color-from-palette($accent, text);\n  }\n\n  .mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {\n    color: theming.get-color-from-palette($warn, text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-option {\n    font: {\n      family: typography-utils.font-family($config);\n      size: typography-utils.font-size($config, subheading-2);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-option') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../theming/theming';\n@use '../typography/typography';\n@use '../typography/typography-utils';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n\n  .mat-optgroup-label {\n    color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-optgroup-disabled .mat-optgroup-label {\n    color: theming.get-color-from-palette($foreground, hint-text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-optgroup-label {\n    @include typography-utils.typography-level($config, body-2);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-optgroup') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/theming/theming';\n@use '../core/theming/palette';\n@use '../core/style/private';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $is-dark-theme: map.get($config, is-dark);\n  $accent: map.get($config, accent);\n\n  .mat-snack-bar-container {\n    // Use the primary text on the dark theme, even though the lighter one uses\n    // a secondary, because the contrast on the light primary text is poor.\n    color: if($is-dark-theme, palette.$dark-primary-text, palette.$light-secondary-text);\n    background: if($is-dark-theme, map.get(palette.$grey-palette, 50), #323232);\n\n    @include private.private-theme-elevation(6, $config);\n  }\n\n  .mat-simple-snackbar-action {\n    color: if($is-dark-theme, inherit, theming.get-color-from-palette($accent, text));\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-simple-snackbar {\n    font: {\n      family: typography-utils.font-family($config, body-1);\n      size: typography-utils.font-size($config, body-1);\n    }\n  }\n\n  .mat-simple-snackbar-action {\n    line-height: 1;\n    font: {\n      family: inherit;\n      size: inherit;\n      weight: typography-utils.font-weight($config, button);\n    }\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-snack-bar') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/density/private/compatibility';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use './tree-variables';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-tree {\n    background: theming.get-color-from-palette($background, 'card');\n  }\n\n  .mat-tree-node,\n  .mat-nested-tree-node {\n    color: theming.get-color-from-palette($foreground, text);\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-tree {\n    font-family: typography-utils.font-family($config);\n  }\n\n  .mat-tree-node,\n  .mat-nested-tree-node {\n    font-weight: typography-utils.font-weight($config, body-1);\n    font-size: typography-utils.font-size($config, body-1);\n  }\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  $height: compatibility.private-density-prop-value(tree-variables.$density-config,\n    $density-scale, height);\n\n  @include compatibility.private-density-legacy-compatibility() {\n    .mat-tree-node {\n      min-height: $height;\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-tree') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n","@use '../../../cdk/a11y';\n\n@mixin ripple() {\n  // The host element of an mat-ripple directive should always have a position of \"absolute\" or\n  // \"relative\" so that the ripples inside are correctly positioned relatively to the container.\n  .mat-ripple {\n    overflow: hidden;\n\n    // By default, every ripple container should have position: relative in favor of creating an\n    // easy API for developers using the MatRipple directive.\n    position: relative;\n\n    // Promote containers that have ripples to a new layer. We want to target `:not(:empty)`,\n    // because we don't want all ripple containers to have their own layer since they're used in a\n    // lot of places and the layer is only relevant while animating. Note that ideally we'd use\n    // the `contain` property here (see #13175), because `:empty` can be broken by having extra\n    // text inside the element, but it isn't very well supported yet.\n    &:not(:empty) {\n      transform: translateZ(0);\n    }\n  }\n\n  .mat-ripple.mat-ripple-unbounded {\n    overflow: visible;\n  }\n\n  .mat-ripple-element {\n    position: absolute;\n    border-radius: 50%;\n    pointer-events: none;\n\n    transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);\n    transform: scale(0);\n\n    // In high contrast mode the ripple is opaque, causing it to obstruct the content.\n    @include a11y.high-contrast(active, off) {\n      display: none;\n    }\n  }\n}\n","@mixin a11y-visually-hidden {\n  .cdk-visually-hidden {\n    border: 0;\n    clip: rect(0 0 0 0);\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    padding: 0;\n    position: absolute;\n    width: 1px;\n\n    // This works around a Chrome bug that can cause the tab to crash when large amounts of\n    // non-English text get wrapped: https://bugs.chromium.org/p/chromium/issues/detail?id=1201444\n    white-space: nowrap;\n\n    // Avoid browsers rendering the focus ring in some cases.\n    outline: 0;\n\n    // Avoid some cases where the browser will still render the native controls (see #9049).\n    -webkit-appearance: none;\n    -moz-appearance: none;\n  }\n}\n\n// @deprecated Use `a11y-visually-hidden`.\n@mixin a11y {\n  @include a11y-visually-hidden;\n}\n\n/// Emits the mixin's content nested under `$selector-context` if `$selector-context`\n/// is non-empty.\n/// @param selector-context The selector under which to nest the mixin's content.\n@mixin _optionally-nest-content($selector-context) {\n  @if ($selector-context == '') {\n    @content;\n  }\n  @else {\n    #{$selector-context} {\n      @content;\n    }\n  }\n}\n\n/// Applies styles for users in high contrast mode. Note that this only applies\n/// to Microsoft browsers. Chrome can be included by checking for the `html[hc]`\n/// attribute, however Chrome handles high contrast differently.\n///\n/// @param target Which kind of high contrast setting to target. Defaults to `active`, can be\n///    `white-on-black` or `black-on-white`.\n/// @param encapsulation Whether to emit styles for view encapsulation. Values are:\n///     * `on` - works for `Emulated`, `Native`, and `ShadowDom`\n///     * `off` - works for `None`\n///     * `any` - works for all encapsulation modes by emitting the CSS twice (default).\n@mixin high-contrast($target: active, $encapsulation: 'any') {\n  @if ($target != 'active' and $target != 'black-on-white' and $target != 'white-on-black') {\n    @error 'Unknown cdk-high-contrast value \"#{$target}\" provided. ' +\n           'Allowed values are \"active\", \"black-on-white\", and \"white-on-black\"';\n  }\n\n  @if ($encapsulation != 'on' and $encapsulation != 'off' and $encapsulation != 'any') {\n    @error 'Unknown cdk-high-contrast encapsulation \"#{$encapsulation}\" provided. ' +\n           'Allowed values are \"on\", \"off\", and \"any\"';\n  }\n\n  // If the selector context has multiple parts, such as `.section, .region`, just doing\n  // `.cdk-high-contrast-xxx #{&}` will only apply the parent selector to the first part of the\n  // context. We address this by nesting the selector context under .cdk-high-contrast.\n  @at-root {\n    $selector-context: #{&};\n\n    @if ($encapsulation != 'on') {\n      // Note that if this selector is updated, the same change has to be made inside\n      // `_overlay.scss` which can't depend on this mixin due to some infrastructure limitations.\n      .cdk-high-contrast-#{$target} {\n        @include _optionally-nest-content($selector-context) {\n          @content;\n        }\n      }\n    }\n\n    @if ($encapsulation != 'off') {\n      .cdk-high-contrast-#{$target} :host {\n        @include _optionally-nest-content($selector-context) {\n          @content;\n        }\n      }\n    }\n  }\n}\n","// We want overlays to always appear over user content, so set a baseline\n// very high z-index for the overlay container, which is where we create the new\n// stacking context for all overlays.\n$overlay-container-z-index: 1000 !default;\n$overlay-z-index: 1000 !default;\n$overlay-backdrop-z-index: 1000 !default;\n\n// Background color for all of the backdrops\n$overlay-backdrop-color: rgba(0, 0, 0, 0.32) !default;\n\n// Default backdrop animation is based on the Material Design swift-ease-out.\n$backdrop-animation-duration: 400ms !default;\n$backdrop-animation-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;\n\n\n@mixin overlay() {\n  .cdk-overlay-container, .cdk-global-overlay-wrapper {\n    // Disable events from being captured on the overlay container.\n    pointer-events: none;\n\n    // The container should be the size of the viewport.\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n  }\n\n  // The overlay-container is an invisible element which contains all individual overlays.\n  .cdk-overlay-container {\n    position: fixed;\n    z-index: $overlay-container-z-index;\n\n    &:empty {\n      // Hide the element when it doesn't have any child nodes. This doesn't\n      // include overlays that have been detached, rather than disposed.\n      display: none;\n    }\n  }\n\n  // We use an extra wrapper element in order to use make the overlay itself a flex item.\n  // This makes centering the overlay easy without running into the subpixel rendering\n  // problems tied to using `transform` and without interfering with the other position\n  // strategies.\n  .cdk-global-overlay-wrapper {\n    display: flex;\n    position: absolute;\n    z-index: $overlay-z-index;\n  }\n\n  // A single overlay pane.\n  .cdk-overlay-pane {\n    // Note: it's important for this one to start off `absolute`,\n    // in order for us to be able to measure it correctly.\n    position: absolute;\n    pointer-events: auto;\n    box-sizing: border-box;\n    z-index: $overlay-z-index;\n\n    // For connected-position overlays, we set `display: flex` in\n    // order to force `max-width` and `max-height` to take effect.\n    display: flex;\n    max-width: 100%;\n    max-height: 100%;\n  }\n\n  .cdk-overlay-backdrop {\n    // TODO(jelbourn): reuse sidenav fullscreen mixin.\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n\n    z-index: $overlay-backdrop-z-index;\n    pointer-events: auto;\n    -webkit-tap-highlight-color: transparent;\n    transition: opacity $backdrop-animation-duration $backdrop-animation-timing-function;\n    opacity: 0;\n\n    &.cdk-overlay-backdrop-showing {\n      opacity: 1;\n\n      // Note that we can't import and use the `high-contrast` mixin from `_a11y.scss`, because\n      // this file will be copied to the top-level `cdk` package when putting together the files\n      // for npm. Any relative import paths we use here will become invalid once the file is copied.\n      .cdk-high-contrast-active & {\n        // In high contrast mode the rgba background will become solid\n        // so we need to fall back to making it opaque using `opacity`.\n        opacity: 0.6;\n      }\n    }\n  }\n\n  .cdk-overlay-dark-backdrop {\n    background: $overlay-backdrop-color;\n  }\n\n  .cdk-overlay-transparent-backdrop {\n    // Note: as of Firefox 57, having the backdrop be `background: none` will prevent it from\n    // capturing the user's mouse scroll events. Since we also can't use something like\n    // `rgba(0, 0, 0, 0)`, we work around the inconsistency by not setting the background at\n    // all and using `opacity` to make the element transparent.\n    &, &.cdk-overlay-backdrop-showing {\n      opacity: 0;\n    }\n  }\n\n  // Overlay parent element used with the connected position strategy. Used to constrain the\n  // overlay element's size to fit within the viewport.\n  .cdk-overlay-connected-position-bounding-box {\n    position: absolute;\n    z-index: $overlay-z-index;\n\n    // We use `display: flex` on this element exclusively for centering connected overlays.\n    // When *not* centering, a top/left/bottom/right will be set which overrides the normal\n    // flex layout.\n    display: flex;\n\n    // We use the `column` direction here to avoid some flexbox issues in Edge\n    // when using the \"grow after open\" options.\n    flex-direction: column;\n\n    // Add some dimensions so the element has an `innerText` which some people depend on in tests.\n    min-width: 1px;\n    min-height: 1px;\n  }\n\n  // Used when disabling global scrolling.\n  .cdk-global-scrollblock {\n    position: fixed;\n\n    // Necessary for the content not to lose its width. Note that we're using 100%, instead of\n    // 100vw, because 100vw includes the width plus the scrollbar, whereas 100% is the width\n    // that the element had before we made it `fixed`.\n    width: 100%;\n\n    // Note: this will always add a scrollbar to whatever element it is on, which can\n    // potentially result in double scrollbars. It shouldn't be an issue, because we won't\n    // block scrolling on a page that doesn't have a scrollbar in the first place.\n    overflow-y: scroll;\n  }\n}\n","// Structural styles for the autosize text fields.\n@mixin text-field-autosize() {\n  // Remove the resize handle on autosizing textareas, because whatever height\n  // the user resized to will be overwritten once they start typing again.\n  textarea.cdk-textarea-autosize {\n    resize: none;\n  }\n\n  // This class is temporarily applied to the textarea when it is being measured. It is immediately\n  // removed when measuring is complete. We use `!important` rules here to make sure user-specified\n  // rules do not interfere with the measurement.\n  textarea.cdk-textarea-autosize-measuring {\n    @include _autosize-measuring-base;\n    height: auto !important;\n    overflow: hidden !important;\n  }\n\n  // Similar to the `cdk-textarea-autosize-measuring` class, but only applied on Firefox. We need\n  // to use this class, because Firefox has a bug where changing the `overflow` breaks the user's\n  // ability to undo/redo what they were typing (see #16629). This class is only scoped to Firefox,\n  // because the measurements there don't seem to be affected by the `height: 0`, whereas on other\n  // browsers they are, e.g. Chrome detects longer text and IE does't resize back to normal.\n  // Identical issue report: https://bugzilla.mozilla.org/show_bug.cgi?id=448784\n  textarea.cdk-textarea-autosize-measuring-firefox {\n    @include _autosize-measuring-base;\n    height: 0 !important;\n  }\n}\n\n// Core styles that enable monitoring autofill state of text fields.\n@mixin text-field-autofill() {\n  // Keyframes that apply no styles, but allow us to monitor when an text field becomes autofilled\n  // by watching for the animation events that are fired when they start. Note: the /*!*/ comment is\n  // needed to prevent LibSass from stripping the keyframes out.\n  // Based on: https://medium.com/@brunn/detecting-autofilled-fields-in-javascript-aed598d25da7\n  @keyframes cdk-text-field-autofill-start {/*!*/}\n  @keyframes cdk-text-field-autofill-end {/*!*/}\n\n  .cdk-text-field-autofill-monitored:-webkit-autofill {\n    // Since Chrome 80 we need a 1ms delay, or the animationstart event won't fire.\n    animation: cdk-text-field-autofill-start 0s 1ms;\n  }\n\n  .cdk-text-field-autofill-monitored:not(:-webkit-autofill) {\n    // Since Chrome 80 we need a 1ms delay, or the animationstart event won't fire.\n    animation: cdk-text-field-autofill-end 0s 1ms;\n  }\n}\n\n@mixin _autosize-measuring-base {\n  // Having 2px top and bottom padding seems to fix a bug where Chrome gets an incorrect\n  // measurement. We just have to account for it later and subtract it off the final result.\n  padding: 2px 0 !important;\n  box-sizing: content-box !important;\n}\n\n// Used to generate UIDs for keyframes used to change the text field autofill styles.\n$autofill-color-frame-count: 0;\n\n// Mixin used to apply custom background and foreground colors to an autofilled text field.\n// Based on: https://stackoverflow.com/questions/2781549/\n// removing-input-background-colour-for-chrome-autocomplete#answer-37432260\n@mixin text-field-autofill-color($background, $foreground:'') {\n  @keyframes cdk-text-field-autofill-color-#{$autofill-color-frame-count} {\n    to {\n      background: $background;\n      @if $foreground != '' { color: $foreground; }\n    }\n  }\n\n  &:-webkit-autofill {\n    animation: cdk-text-field-autofill-color-#{$autofill-color-frame-count} both;\n  }\n\n  &.cdk-text-field-autofill-monitored:-webkit-autofill {\n    // Since Chrome 80 we need a 1ms delay for cdk-text-field-autofill-start, or the animationstart\n    // event won't fire.\n    animation: cdk-text-field-autofill-start 0s 1ms,\n               cdk-text-field-autofill-color-#{$autofill-color-frame-count} both;\n  }\n\n  $autofill-color-frame-count: $autofill-color-frame-count + 1 !global;\n}\n\n// @deprecated Use `autosize` and `autofill` instead.\n@mixin text-field {\n  @include text-field-autosize();\n  @include text-field-autofill();\n}\n","@use '../../cdk/overlay';\n@use '../../cdk/a11y';\n@use '../../cdk/text-field';\n\n// Core styles that can be used to apply material design treatments to any element.\n@use './ripple/ripple';\n@use './focus-indicators/focus-indicators';\n@use './typography/all-typography';\n\n// Mixin that renders all of the core styles that are not theme-dependent.\n@mixin core($typography-config: null) {\n  @include all-typography.all-component-typographies($typography-config);\n  @include ripple.ripple();\n  @include a11y.a11y-visually-hidden();\n  @include overlay.overlay();\n  @include text-field.text-field-autosize();\n  @include text-field.text-field-autofill();\n\n  @include focus-indicators.private-strong-focus-indicators-positioning();\n  @include _mdc-core();\n}\n\n// Mixin that renders all of the core MDC styles. Private mixin included with `mat-core`.\n@mixin _mdc-core() {\n  @include _mdc-strong-focus-indicators-positioning();\n}\n\n// Mixin that ensures focus indicator host elements are positioned so that the focus indicator\n// pseudo element within is positioned relative to the host. Private mixin included within\n// `_mat-mdc-core`.\n@mixin _mdc-strong-focus-indicators-positioning() {\n  .mat-mdc-focus-indicator {\n    position: relative;\n  }\n}\n","@use 'sass:map';\n@use 'sass:meta';\n@use '../theming/theming';\n\n// Colors for the ripple elements.\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $foreground-base: map.get($foreground, base);\n  $color-opacity: 0.1;\n\n  .mat-ripple-element {\n    // If the ripple color is resolves to a color *type*, we can use it directly, otherwise\n    // (e.g. it resolves to a CSS variable) we fall back to using the color and setting an opacity.\n    @if (meta.type-of($foreground-base) == color) {\n      background-color: rgba($foreground-base, $color-opacity);\n    }\n    @else {\n      background-color: $foreground-base;\n      opacity: $color-opacity;\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-ripple') {\n    $color: theming.get-color-config($theme);\n    @if $color != null {\n      @include color($color);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../../theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $is-dark-theme: map.get($config, is-dark);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, 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: theming.get-color-from-palette(map.get($config, foreground), secondary-text);\n\n    &::after {\n      color: theming.get-color-from-palette($background, background);\n    }\n  }\n\n  .mat-pseudo-checkbox-disabled {\n    color: $disabled-color;\n  }\n\n  .mat-primary .mat-pseudo-checkbox-checked,\n  .mat-primary .mat-pseudo-checkbox-indeterminate {\n    background: theming.get-color-from-palette(map.get($config, primary));\n  }\n\n  // Default to the accent color. Note that the pseudo checkboxes are meant to inherit the\n  // theme from their parent, rather than implementing their own theming, which is why we\n  // don't attach to the `mat-*` classes. Also note that this needs to be below `.mat-primary`\n  // in order to allow for the color to be overwritten if the checkbox is inside a parent that\n  // has `mat-accent` and is placed inside another parent that has `mat-primary`.\n  .mat-pseudo-checkbox-checked,\n  .mat-pseudo-checkbox-indeterminate,\n  .mat-accent .mat-pseudo-checkbox-checked,\n  .mat-accent .mat-pseudo-checkbox-indeterminate {\n    background: theming.get-color-from-palette(map.get($config, accent));\n  }\n\n  .mat-warn .mat-pseudo-checkbox-checked,\n  .mat-warn .mat-pseudo-checkbox-indeterminate {\n    background: theming.get-color-from-palette(map.get($config, warn));\n  }\n\n  .mat-pseudo-checkbox-checked,\n  .mat-pseudo-checkbox-indeterminate {\n    &.mat-pseudo-checkbox-disabled {\n      background: $disabled-color;\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-pseudo-checkbox') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use 'theming/theming';\n@use './style/private';\n@use './ripple/ripple-theme';\n@use './option/option-theme';\n@use './option/optgroup-theme';\n@use './selection/pseudo-checkbox/pseudo-checkbox-theme';\n@use './style/elevation';\n\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  // Wrapper element that provides the theme background when the user's content isn't\n  // inside of a `mat-sidenav-container`. Note that we need to exclude the ampersand\n  // selector in case the mixin is included at the top level.\n  .mat-app-background#{if(&, ', &.mat-app-background', '')} {\n    $background: map.get($config, background);\n    $foreground: map.get($config, foreground);\n\n    background-color: theming.get-color-from-palette($background, background);\n    color: theming.get-color-from-palette($foreground, text);\n  }\n\n  // Provides external CSS classes for each elevation value. Each CSS class is formatted as\n  // `mat-elevation-z$zValue` where `$zValue` corresponds to the z-space to which the element is\n  // elevated.\n  @for $zValue from 0 through 24 {\n    .#{elevation.$prefix}#{$zValue} {\n      @include private.private-theme-elevation($zValue, $config);\n    }\n  }\n\n  // Marker that is used to determine whether the user has added a theme to their page.\n  @at-root {\n    .mat-theme-loaded-marker {\n      display: none;\n    }\n  }\n}\n\n// Mixin that renders all of the core styles that depend on the theme.\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  // Wrap the sub-theme includes in the duplicate theme styles mixin. This ensures that\n  // there won't be multiple warnings. e.g. if `mat-core-theme` reports a warning, then\n  // the imported themes (such as `mat-ripple-theme`) should not report again.\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-core') {\n    @include ripple-theme.theme($theme);\n    @include option-theme.theme($theme);\n    @include optgroup-theme.theme($theme);\n    @include pseudo-checkbox-theme.theme($theme);\n\n    $color: theming.get-color-config($theme);\n    @if $color != null {\n      @include color($color);\n    }\n  }\n}\n","@use 'sass:map';\n@use 'sass:math';\n@use 'sass:meta';\n@use '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://material.io/design/environment/elevation.html\n// Examples:\n//\n//\n// .mat-foo {\n//   @include $mat-elevation(2);\n//\n//   &:active {\n//     @include $mat-elevation(8);\n//   }\n// }\n//\n// <div id=\"external-card\" class=\"mat-elevation-z2\"><p>Some content</p></div>\n//\n// For an explanation of the design behind how elevation is implemented, see the design doc at\n// https://goo.gl/Kq0k9Z.\n\n// Colors for umbra, penumbra, and ambient shadows. As described in the design doc, each elevation\n// level is created using a set of 3 shadow values, one for umbra (the shadow representing the\n// space completely obscured by an object relative to its light source), one for penumbra (the\n// space partially obscured by an object), and one for ambient (the space which contains the object\n// itself). For a further explanation of these terms and their meanings, see\n// https://en.wikipedia.org/wiki/Umbra,_penumbra_and_antumbra.\n\n// Maps for the different shadow sets and their values within each z-space. These values were\n// created by taking a few reference shadow sets created by Google's Designers and interpolating\n// all of the values between them.\n\n@function _get-umbra-map($color, $opacity) {\n  $shadow-color: if(meta.type-of($color) == color, rgba($color, $opacity * 0.2), $color);\n\n  @return (\n    0: '0px 0px 0px 0px #{$shadow-color}',\n    1: '0px 2px 1px -1px #{$shadow-color}',\n    2: '0px 3px 1px -2px #{$shadow-color}',\n    3: '0px 3px 3px -2px #{$shadow-color}',\n    4: '0px 2px 4px -1px #{$shadow-color}',\n    5: '0px 3px 5px -1px #{$shadow-color}',\n    6: '0px 3px 5px -1px #{$shadow-color}',\n    7: '0px 4px 5px -2px #{$shadow-color}',\n    8: '0px 5px 5px -3px #{$shadow-color}',\n    9: '0px 5px 6px -3px #{$shadow-color}',\n    10: '0px 6px 6px -3px #{$shadow-color}',\n    11: '0px 6px 7px -4px #{$shadow-color}',\n    12: '0px 7px 8px -4px #{$shadow-color}',\n    13: '0px 7px 8px -4px #{$shadow-color}',\n    14: '0px 7px 9px -4px #{$shadow-color}',\n    15: '0px 8px 9px -5px #{$shadow-color}',\n    16: '0px 8px 10px -5px #{$shadow-color}',\n    17: '0px 8px 11px -5px #{$shadow-color}',\n    18: '0px 9px 11px -5px #{$shadow-color}',\n    19: '0px 9px 12px -6px #{$shadow-color}',\n    20: '0px 10px 13px -6px #{$shadow-color}',\n    21: '0px 10px 13px -6px #{$shadow-color}',\n    22: '0px 10px 14px -6px #{$shadow-color}',\n    23: '0px 11px 14px -7px #{$shadow-color}',\n    24: '0px 11px 15px -7px #{$shadow-color}'\n  );\n}\n\n@function _get-penumbra-map($color, $opacity) {\n  $shadow-color: if(meta.type-of($color) == color, rgba($color, $opacity * 0.14), $color);\n\n  @return (\n    0: '0px 0px 0px 0px #{$shadow-color}',\n    1: '0px 1px 1px 0px #{$shadow-color}',\n    2: '0px 2px 2px 0px #{$shadow-color}',\n    3: '0px 3px 4px 0px #{$shadow-color}',\n    4: '0px 4px 5px 0px #{$shadow-color}',\n    5: '0px 5px 8px 0px #{$shadow-color}',\n    6: '0px 6px 10px 0px #{$shadow-color}',\n    7: '0px 7px 10px 1px #{$shadow-color}',\n    8: '0px 8px 10px 1px #{$shadow-color}',\n    9: '0px 9px 12px 1px #{$shadow-color}',\n    10: '0px 10px 14px 1px #{$shadow-color}',\n    11: '0px 11px 15px 1px #{$shadow-color}',\n    12: '0px 12px 17px 2px #{$shadow-color}',\n    13: '0px 13px 19px 2px #{$shadow-color}',\n    14: '0px 14px 21px 2px #{$shadow-color}',\n    15: '0px 15px 22px 2px #{$shadow-color}',\n    16: '0px 16px 24px 2px #{$shadow-color}',\n    17: '0px 17px 26px 2px #{$shadow-color}',\n    18: '0px 18px 28px 2px #{$shadow-color}',\n    19: '0px 19px 29px 2px #{$shadow-color}',\n    20: '0px 20px 31px 3px #{$shadow-color}',\n    21: '0px 21px 33px 3px #{$shadow-color}',\n    22: '0px 22px 35px 3px #{$shadow-color}',\n    23: '0px 23px 36px 3px #{$shadow-color}',\n    24: '0px 24px 38px 3px #{$shadow-color}'\n  );\n}\n\n@function _get-ambient-map($color, $opacity) {\n  $shadow-color: if(meta.type-of($color) == color, rgba($color, $opacity * 0.12), $color);\n\n  @return (\n    0: '0px 0px 0px 0px #{$shadow-color}',\n    1: '0px 1px 3px 0px #{$shadow-color}',\n    2: '0px 1px 5px 0px #{$shadow-color}',\n    3: '0px 1px 8px 0px #{$shadow-color}',\n    4: '0px 1px 10px 0px #{$shadow-color}',\n    5: '0px 1px 14px 0px #{$shadow-color}',\n    6: '0px 1px 18px 0px #{$shadow-color}',\n    7: '0px 2px 16px 1px #{$shadow-color}',\n    8: '0px 3px 14px 2px #{$shadow-color}',\n    9: '0px 3px 16px 2px #{$shadow-color}',\n    10: '0px 4px 18px 3px #{$shadow-color}',\n    11: '0px 4px 20px 3px #{$shadow-color}',\n    12: '0px 5px 22px 4px #{$shadow-color}',\n    13: '0px 5px 24px 4px #{$shadow-color}',\n    14: '0px 5px 26px 4px #{$shadow-color}',\n    15: '0px 6px 28px 5px #{$shadow-color}',\n    16: '0px 6px 30px 5px #{$shadow-color}',\n    17: '0px 6px 32px 5px #{$shadow-color}',\n    18: '0px 7px 34px 6px #{$shadow-color}',\n    19: '0px 7px 36px 6px #{$shadow-color}',\n    20: '0px 8px 38px 7px #{$shadow-color}',\n    21: '0px 8px 40px 7px #{$shadow-color}',\n    22: '0px 8px 42px 7px #{$shadow-color}',\n    23: '0px 9px 44px 8px #{$shadow-color}',\n    24: '0px 9px 46px 8px #{$shadow-color}'\n  );\n}\n\n// The default duration value for elevation transitions.\n$transition-duration: 280ms !default;\n\n// The default easing value for elevation transitions.\n$transition-timing-function: variables.$fast-out-slow-in-timing-function;\n\n// The default color for elevation shadows.\n$color: black !default;\n\n// The default opacity scaling value for elevation shadows.\n$opacity: 1 !default;\n\n// Prefix for elevation-related selectors.\n$prefix: 'mat-elevation-z';\n\n// Applies the correct css rules to an element to give it the elevation specified by $zValue.\n// The $zValue must be between 0 and 24.\n@mixin elevation($zValue, $color: $color, $opacity: $opacity) {\n  @if meta.type-of($zValue) != number or not math.is-unitless($zValue) {\n    @error '$zValue must be a unitless number';\n  }\n  @if $zValue < 0 or $zValue > 24 {\n    @error '$zValue must be between 0 and 24';\n  }\n\n  box-shadow: #{map.get(_get-umbra-map($color, $opacity), $zValue)},\n              #{map.get(_get-penumbra-map($color, $opacity), $zValue)},\n              #{map.get(_get-ambient-map($color, $opacity), $zValue)};\n}\n\n// Applies the elevation to an element in a manner that allows\n// consumers to override it via the Material elevation classes.\n@mixin overridable-elevation(\n    $zValue,\n    $color: $color,\n    $opacity: $opacity) {\n  &:not([class*='#{$prefix}']) {\n    @include elevation($zValue, $color, $opacity);\n  }\n}\n\n// Returns a string that can be used as the value for a transition property for elevation.\n// Calling this function directly is useful in situations where a component needs to transition\n// more than one property.\n//\n// .foo {\n//   transition: mat-elevation-transition-property-value(), opacity 100ms ease;\n// }\n@function private-transition-property-value(\n    $duration: $transition-duration,\n    $easing: $transition-timing-function) {\n  @return box-shadow #{$duration} #{$easing};\n}\n\n// Applies the correct css rules needed to have an element transition between elevations.\n// This mixin should be applied to elements whose elevation values will change depending on their\n// context (e.g. when active or disabled).\n//\n// NOTE(traviskaufman): Both this mixin and the above function use default parameters so they can\n// be used in the same way by clients.\n@mixin elevation-transition(\n    $duration: $transition-duration,\n    $easing: $transition-timing-function) {\n  transition: private-transition-property-value($duration, $easing);\n}\n","@use 'sass:map';\n@use '../core/style/private';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n\n  .mat-autocomplete-panel {\n    @include private.private-theme-overridable-elevation(4, $config);\n    background: theming.get-color-from-palette($background, card);\n    color: theming.get-color-from-palette($foreground, text);\n\n    // Selected options in autocompletes should not be gray, but we\n    // only want to override the background for selected options if\n    // they are *not* in hover or focus state. This change has to be\n    // made here because base option styles are shared between the\n    // autocomplete and the select.\n    .mat-option.mat-selected:not(.mat-active):not(:hover) {\n      background: theming.get-color-from-palette($background, card);\n\n      &:not(.mat-option-disabled) {\n        color: theming.get-color-from-palette($foreground, text);\n      }\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-autocomplete') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/style/private';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n@use '../core/density/private/compatibility';\n@use './button-toggle-variables';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $background: map.get($config, background);\n  $divider-color: theming.get-color-from-palette($foreground, divider);\n\n  .mat-button-toggle-standalone,\n  .mat-button-toggle-group {\n    @include private.private-theme-elevation(2, $config);\n  }\n\n  .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,\n  .mat-button-toggle-group-appearance-standard {\n    box-shadow: none;\n  }\n\n  .mat-button-toggle {\n    color: theming.get-color-from-palette($foreground, hint-text);\n\n    .mat-button-toggle-focus-overlay {\n      background-color: theming.get-color-from-palette($background, focused-button);\n    }\n  }\n\n  .mat-button-toggle-appearance-standard {\n    color: theming.get-color-from-palette($foreground, text);\n    background: theming.get-color-from-palette($background, card);\n\n    .mat-button-toggle-focus-overlay {\n      background-color: theming.get-color-from-palette($background, focused-button, 1);\n    }\n  }\n\n  .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {\n    border-left: solid 1px $divider-color;\n  }\n\n  [dir='rtl'] .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {\n    border-left: none;\n    border-right: solid 1px $divider-color;\n  }\n\n  .mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical {\n    .mat-button-toggle + .mat-button-toggle {\n      border-left: none;\n      border-right: none;\n      border-top: solid 1px $divider-color;\n    }\n  }\n\n  .mat-button-toggle-checked {\n    background-color: theming.get-color-from-palette($background, selected-button);\n    color: theming.get-color-from-palette($foreground, secondary-text);\n\n    &.mat-button-toggle-appearance-standard {\n      color: theming.get-color-from-palette($foreground, text);\n    }\n  }\n\n  .mat-button-toggle-disabled {\n    color: theming.get-color-from-palette($foreground, disabled-button);\n    background-color: theming.get-color-from-palette($background, disabled-button-toggle);\n\n    &.mat-button-toggle-appearance-standard {\n      background: theming.get-color-from-palette($background, card);\n    }\n\n    &.mat-button-toggle-checked {\n      background-color: theming.get-color-from-palette($background, selected-disabled-button);\n    }\n  }\n\n  .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,\n  .mat-button-toggle-group-appearance-standard {\n    border: solid 1px $divider-color;\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-button-toggle {\n    font-family: typography-utils.font-family($config);\n  }\n}\n\n@mixin density($config-or-theme) {\n  $density-scale: theming.get-density-config($config-or-theme);\n  $standard-height: compatibility.private-density-prop-value(\n      button-toggle-variables.$standard-density-config, $density-scale, height);\n\n  @include compatibility.private-density-legacy-compatibility() {\n    .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {\n      line-height: $standard-height;\n    }\n  }\n}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-button-toggle') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n\n  .mat-divider {\n    border-top-color: theming.get-color-from-palette($foreground, divider);\n  }\n\n  .mat-divider-vertical {\n    border-right-color: theming.get-color-from-palette($foreground, divider);\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-divider') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@mixin private-expansion-focus {\n  .mat-expansion-panel {\n    & .mat-expansion-panel-header.cdk-keyboard-focused,\n    & .mat-expansion-panel-header.cdk-program-focused,\n    &:not(.mat-expanded) .mat-expansion-panel-header:hover {\n      &:not([aria-disabled='true']) {\n        @content;\n      }\n    }\n  }\n}\n","@use 'sass:map';\n@use '../theming/theming';\n\n// Renders a gradient for showing the dashed line when the input is disabled.\n// Unlike using a border, a gradient allows us to adjust the spacing of the dotted line\n// to match the Material Design spec.\n@mixin private-control-disabled-underline($color) {\n  background-image: linear-gradient(to right, $color 0%, $color 33%, transparent 0%);\n  background-size: 4px 100%;\n  background-repeat: repeat-x;\n}\n\n// Figures out the color of the placeholder for a form control.\n// Used primarily to prevent the various form controls from\n// becoming out of sync since these colors aren't in a palette.\n@function private-control-placeholder-color($config) {\n  $foreground: map.get($config, foreground);\n  $is-dark-theme: map.get($config, is-dark);\n  @return theming.get-color-from-palette($foreground, secondary-text,\n    if($is-dark-theme, 0.5, 0.42));\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/style/form-common';\n\n\n// Theme styles that only apply to the standard appearance of the form-field.\n\n@mixin standard-color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $foreground: map.get($config, foreground);\n  $is-dark-theme: map.get($config, is-dark);\n  $underline-color:\n    theming.get-color-from-palette($foreground, divider, if($is-dark-theme, 0.7, 0.42));\n\n  .mat-form-field-appearance-standard {\n    .mat-form-field-underline {\n      background-color: $underline-color;\n    }\n\n    &.mat-form-field-disabled .mat-form-field-underline {\n      @include form-common.private-control-disabled-underline($underline-color);\n    }\n  }\n}\n\n@mixin standard-typography($config-or-theme) {}\n\n@mixin private-form-field-standard-density($config-or-theme) {}\n\n@mixin standard-theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-form-field-standard') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include standard-color($color);\n    }\n    @if $density != null {\n      @include private-form-field-standard-density($density);\n    }\n    @if $typography != null {\n      @include standard-typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-icon {\n    &.mat-primary {\n      color: theming.get-color-from-palette($primary, text);\n    }\n\n    &.mat-accent {\n      color: theming.get-color-from-palette($accent, text);\n    }\n\n    &.mat-warn {\n      color: theming.get-color-from-palette($warn, text);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-icon') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n","// stylelint-disable material/no-prefixes\n@mixin user-select($value) {\n  -webkit-user-select: $value;\n  -moz-user-select: $value;\n  -ms-user-select: $value;\n  user-select: $value;\n}\n\n@mixin input-placeholder {\n  &::placeholder {\n    @content;\n  }\n\n  &::-moz-placeholder {\n    @content;\n  }\n\n  &::-webkit-input-placeholder {\n    @content;\n  }\n\n  &:-ms-input-placeholder {\n    @content;\n  }\n}\n\n@mixin cursor-grab {\n  cursor: -webkit-grab;\n  cursor: grab;\n}\n\n@mixin cursor-grabbing {\n  cursor: -webkit-grabbing;\n  cursor: grabbing;\n}\n\n@mixin backface-visibility($value) {\n  -webkit-backface-visibility: $value;\n  backface-visibility: $value;\n}\n\n@mixin position-sticky($important: false) {\n  position: -webkit-sticky #{if($important, '!important', '')};\n  position: sticky #{if($important, '!important', '')};\n}\n// stylelint-enable\n","@use 'sass:map';\n@use 'sass:meta';\n@use 'sass:color';\n@use '../core/theming/theming';\n\n// Approximates the correct buffer color by using a mix between the theme color\n// and the theme's background color.\n@function _get-buffer-color($theme, $background) {\n  $theme-color: theming.get-color-from-palette($theme);\n  // Return fallback color if the theme uses variables to define colors.\n  @if (meta.type-of($theme-color) != 'color' or meta.type-of($background) != 'color') {\n    @return theming.get-color-from-palette($theme, lighter);\n  }\n  @return color.mix($theme-color, $background, $weight: 25%);\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get(map.get($config, background), background);\n\n  .mat-progress-bar-background {\n    fill: _get-buffer-color($primary, $background);\n  }\n\n  .mat-progress-bar-buffer {\n    background-color: _get-buffer-color($primary, $background);\n  }\n\n  .mat-progress-bar-fill::after {\n    background-color: theming.get-color-from-palette($primary);\n  }\n\n  .mat-progress-bar.mat-accent {\n    .mat-progress-bar-background {\n      fill: _get-buffer-color($accent, $background);\n    }\n\n    .mat-progress-bar-buffer {\n      background-color: _get-buffer-color($accent, $background);\n    }\n\n    .mat-progress-bar-fill::after {\n      background-color: theming.get-color-from-palette($accent);\n    }\n  }\n\n  .mat-progress-bar.mat-warn {\n    .mat-progress-bar-background {\n      fill: _get-buffer-color($warn, $background);\n    }\n\n    .mat-progress-bar-buffer {\n      background-color: _get-buffer-color($warn, $background);\n    }\n\n    .mat-progress-bar-fill::after {\n      background-color: theming.get-color-from-palette($warn);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-progress-bar') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n\n","@use 'sass:map';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n\n  .mat-progress-spinner, .mat-spinner {\n    circle {\n      stroke: theming.get-color-from-palette($primary);\n    }\n\n    &.mat-accent circle {\n      stroke: theming.get-color-from-palette($accent);\n    }\n\n    &.mat-warn circle {\n      stroke: theming.get-color-from-palette($warn);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-progress-spinner') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:map';\n@use '../core/theming/theming';\n@use '../core/typography/typography';\n@use '../core/typography/typography-utils';\n\n@mixin _color($palette) {\n  &.mat-radio-checked .mat-radio-outer-circle {\n    border-color: theming.get-color-from-palette($palette);\n  }\n\n  .mat-radio-inner-circle,\n  .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple),\n  &.mat-radio-checked .mat-radio-persistent-ripple,\n  &:active .mat-radio-persistent-ripple {\n    background-color: theming.get-color-from-palette($palette);\n  }\n}\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-radio-outer-circle {\n    border-color: theming.get-color-from-palette($foreground, secondary-text);\n  }\n\n  .mat-radio-button {\n    &.mat-primary {\n      @include _color($primary);\n    }\n\n    &.mat-accent {\n      @include _color($accent);\n    }\n\n    &.mat-warn {\n      @include _color($warn);\n    }\n\n    // This needs extra specificity, because the classes above are combined\n    // (e.g. `.mat-radio-button.mat-accent`) which increases their specificity a lot.\n    // TODO: consider making the selectors into descendants (`.mat-primary .mat-radio-button`).\n    &.mat-radio-disabled {\n      &.mat-radio-checked .mat-radio-outer-circle,\n      .mat-radio-outer-circle {\n        border-color: theming.get-color-from-palette($foreground, disabled);\n      }\n\n      .mat-radio-ripple .mat-ripple-element,\n      .mat-radio-inner-circle {\n        background-color: theming.get-color-from-palette($foreground, disabled);\n      }\n\n      .mat-radio-label-content {\n        color: theming.get-color-from-palette($foreground, disabled);\n      }\n    }\n\n    // Switch this to a solid color since we're using `opacity`\n    // to control how opaque the ripple should be.\n    .mat-ripple-element {\n      background-color: map.get($foreground, base);\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {\n  $config: typography.private-typography-to-2014-config(\n      theming.get-typography-config($config-or-theme));\n  .mat-radio-button {\n    font-family: typography-utils.font-family($config);\n  }\n}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-radio') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:color';\n@use 'sass:map';\n@use 'sass:meta';\n@use '../core/style/private';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $primary: map.get($config, primary);\n  $accent: map.get($config, accent);\n  $warn: map.get($config, warn);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  $drawer-background-color: theming.get-color-from-palette($background, dialog);\n  $drawer-container-background-color:  theming.get-color-from-palette($background, background);\n  $drawer-push-background-color: theming.get-color-from-palette($background, dialog);\n  $drawer-side-border: solid 1px theming.get-color-from-palette($foreground, divider);\n\n  .mat-drawer-container {\n    background-color: $drawer-container-background-color;\n    color: theming.get-color-from-palette($foreground, text);\n  }\n\n  .mat-drawer {\n    background-color: $drawer-background-color;\n    color: theming.get-color-from-palette($foreground, text);\n\n    &.mat-drawer-push {\n      background-color: $drawer-push-background-color;\n    }\n\n    &:not(.mat-drawer-side) {\n      // The elevation of z-16 is noted in the design specifications.\n      // See https://material.io/design/components/navigation-drawer.html\n      @include private.private-theme-elevation(16, $config);\n    }\n  }\n\n  .mat-drawer-side {\n    border-right: $drawer-side-border;\n\n    &.mat-drawer-end {\n      border-left: $drawer-side-border;\n      border-right: none;\n    }\n  }\n\n  [dir='rtl'] .mat-drawer-side {\n    border-left: $drawer-side-border;\n    border-right: none;\n\n    &.mat-drawer-end {\n      border-left: none;\n      border-right: $drawer-side-border;\n    }\n  }\n\n  .mat-drawer-backdrop.mat-drawer-shown {\n    $opacity: 0.6;\n    $backdrop-color: theming.get-color-from-palette($background, card, $opacity);\n\n    @if (meta.type-of($backdrop-color) == color) {\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      background-color: color.invert($backdrop-color);\n    }\n    @else {\n      // If we couldn't resolve the backdrop color to a color value, fall back to using\n      // `opacity` to make it opaque since its end value could be a solid color.\n      background-color: $backdrop-color;\n      opacity: $opacity;\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-sidenav') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","@use 'sass:color';\n@use 'sass:map';\n@use 'sass:meta';\n@use '../core/theming/theming';\n\n@mixin color($config-or-theme) {\n  $config: theming.get-color-config($config-or-theme);\n  $background: map.get($config, background);\n  $foreground: map.get($config, foreground);\n\n  .mat-sort-header-arrow {\n    $table-background: theming.get-color-from-palette($background, 'card');\n    $text-color: theming.get-color-from-palette($foreground, secondary-text);\n\n    // Because the arrow is made up of multiple elements that are stacked on top of each other,\n    // we can't use the semi-transparent color from the theme directly. If the value is a color\n    // *type*, we convert it into a solid color by taking the opacity from the rgba value and\n    // using the value to determine the percentage of the background to put into foreground\n    // when mixing the colors together. Otherwise, if it resolves to something different\n    // (e.g. it resolves to a CSS variable), we use the color directly.\n    @if (meta.type-of($table-background) == color and meta.type-of($text-color) == color) {\n      $text-opacity: opacity($text-color);\n      color: color.mix($table-background, rgba($text-color, 1), (1 - $text-opacity) * 100%);\n    }\n    @else {\n      color: $text-color;\n    }\n  }\n}\n\n@mixin typography($config-or-theme) {}\n\n@mixin _density($config-or-theme) {}\n\n@mixin theme($theme-or-color-config) {\n  $theme: theming.private-legacy-get-theme($theme-or-color-config);\n  @include theming.private-check-duplicate-theme-styles($theme, 'mat-sort') {\n    $color: theming.get-color-config($theme);\n    $density: theming.get-density-config($theme);\n    $typography: theming.get-typography-config($theme);\n\n    @if $color != null {\n      @include color($color);\n    }\n    @if $density != null {\n      @include _density($density);\n    }\n    @if $typography != null {\n      @include typography($typography);\n    }\n  }\n}\n","html {\n  font-size: 62.5%;\n}\n\nbody {\n  font-family: $main-font;\n  margin: 0;\n  color: $darkgray;\n  @include font-size(16);\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\nh1, h2, h3, h4, h5, h6 {\n  color: $deepgray;\n  margin-bottom: 0;\n  font-weight: 500;\n}\n\nh1 {\n  @include font-size(40);\n  display: inline-block;\n  margin: 1.6rem 0;\n\n  @media screen and (max-width: 600px) {\n    margin-top: 0;\n  }\n}\n\nh2 {\n  border-top: 1px solid $lightgray;\n  clear: both;\n  @include font-size(32);\n  margin-top: 4rem;\n  padding-top: 4rem;\n\n  @include marketing-pages($extraSelectors: ('.page-api'), $nestParentSelector: true) {\n    border-top: 0;\n    margin-top: 2rem;\n    padding-top: 0;\n  }\n}\n\nh3 {\n  @include font-size(24);\n  margin-top: 3rem;\n  clear: both;\n}\n\nh4 {\n  @include font-size(20);\n  margin-top: 3rem;\n  clear: both;\n}\n\nh5 {\n  @include font-size(18);\n  margin-top: 2rem;\n  clear: both;\n}\n\nh6 {\n  @include font-size(16);\n  color: $mediumgray;\n  margin-top: 2rem;\n  clear: both;\n}\n\nh2,\nh3,\nh4,\nh5,\nh6 {\n  a {\n    font-size: inherit;\n  }\n\n  @media screen and (max-width: 600px) {\n    margin: 8px 0;\n  }\n}\n\n.mat-tab-body-wrapper h2 {\n  margin-top: 0;\n}\n\np,\nol,\nul,\nli,\ninput,\na {\n  @include font-size(16);\n  @include line-height(32);\n  font-family: inherit;\n  font-weight: 400;\n  color: $darkgray;\n\n  & > em {\n    @include letter-spacing(0.3);\n  }\n}\n\np {\n  margin: 1em 0;\n}\n\np + ul {\n  margin-top: 4px;\n}\n\nol {\n  li,\n  p {\n    margin: 4px 0;\n  }\n}\n\nol ol {\n  list-style-type: lower-alpha;\n\n  ol {\n    list-style-type: lower-roman;\n  }\n}\n\nli {\n  padding-bottom: 8px;\n  @include line-height(24);\n\n  p {\n    margin: 0;\n  }\n}\n\na {\n  text-decoration: none;\n}\n\n.app-toolbar a {\n  @include font-size(16);\n  font-weight: 400;\n  color: $white;\n  font-family: $main-font;\n  text-transform: uppercase;\n}\n\nstrong {\n  font-weight: 500;\n}\n\ntable {\n  border-collapse: collapse;\n  border-radius: 2px;\n  border-spacing: 0;\n  margin: 12px 0 32px;\n}\n\ntable tbody th {\n  max-width: 100px;\n  padding: 13px 32px;\n  text-align: left;\n}\n\ntd {\n  font-weight: 400;\n  padding: 8px 30px;\n\n  > p,\n  ul {\n    &:first-child {\n      margin-top: 0;\n    }\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n}\n\nth {\n  @include font-size(16);\n  font-weight: 500;\n  padding: 13px 32px;\n  text-align: left;\n}\n\ncode {\n  font-family: $code-font;\n  font-size: 90%;\n  color: $darkgray;\n}\n\n.sidenav-content a {\n  color: $blue;\n\n  &:hover {\n    text-decoration: underline;\n  }\n}\n\n// The following css rule adds an icon to external links in the docs area, based on the classes that are applied to the\n// `doc-viewer` component when it is displaying docs for the different areas of the documentation.\n// We add the icon to all external links which are identified as absolute links (those that start with `http:` or https:`).\n// For more info see PR #36601.\n@include docs-pages {\n  aio-doc-viewer {\n    // The docs-viewer also contain links to GitHub (e.g. the \"edit this page\" icon) identified with\n    // the `.github-links` class. We don't want to add the external link icon to these links.\n    :not(.github-links) {\n      > a {\n        &[href^=\"http:\"],\n        &[href^=\"https:\"] {\n          display: inline-flex;\n          padding-right: calc(1em + 0.25rem);\n          position: relative;\n\n          &::after {\n            content: \"open_in_new\";\n            font-family: \"Material Icons\";\n            position: absolute;\n            right: 0;\n          }\n        }\n      }\n    }\n  }\n}\n\n.error-text {\n  color: $brightred;\n}\n","// TYPOGRAPHY\n$main-font: \"Roboto\",\"Helvetica Neue Light\",\"Helvetica Neue\",Helvetica,Arial,\"Lucida Grande\",sans-serif;\n$code-font: \"Roboto Mono\", monospace;\n\n// Z-LAYER\n$layer-1: 1;\n$layer-2: 2;\n$layer-3: 3;\n$layer-4: 4;\n$layer-5: 5;\n\n// COLOR PALETTE\n$blue: #1976D2;\n$darkblue: #1669bb;\n$accentblue: #1E88E5;\n$brightred: #DD0031;\n$darkred: #C3002F;\n$white: #FFFFFF;\n$offwhite: #FAFAFA;\n$tangerine: #DDA302;\n$darkgoldenrod: #C3A300;\n$backgroundgray: #F1F1F1;\n$superlightgray: #F2F2F2;\n$lightgray: #DBDBDB;\n$lightboxgray: #EBEBEB;\n$mist: #ECEFF1;\n$mediumgray: #6E6E6E;\n$darkgray: #444444;\n$deepgray: #333333;\n$black: #0A1014;\n$orange: #FF9800;\n$darkorange: #940;\n$anti-pattern: $brightred;\n\n// API & CODE COLORS\n$amber-700: #FFA000;\n$blue-400: #42A5F5;\n$blue-500: #2196F3;\n$blue-600: #1E88E5;\n$blue-800: #1565C0;\n$blue-900: #0D47A1;\n$blue-grey-50: #ECEFF1;\n$blue-grey-100: #CFD8DC;\n$blue-grey-200: #B0BEC5;\n$blue-grey-300: #90A4AE;\n$blue-grey-400: #78909C;\n$blue-grey-500: #607D8B;\n$blue-grey-600: #546E7A;\n$blue-grey-700: #455A64;\n$blue-grey-800: #37474F;\n$blue-grey-900: #263238;\n$codegreen: #17ff0b;\n$green-500: #4CAF50;\n$green-800: #2E7D32;\n$light-green-600: #7CB342;\n$pink-600: #D81B60;\n$purple-600: #8E24AA;\n$teal-500: #009688;\n$lightgrey: #F5F6F7;\n\n// STATE COLORS\n$focus-outline-ondark: rgba($white, 0.8);\n$focus-outline-onlight: $accentblue;\n\n// GRADIENTS\n$bluegradient: linear-gradient(145deg,$blue-900,$blue-400);\n$redgradient: linear-gradient(145deg,$darkred,$brightred);\n\n// API LABEL COLOR AND SYMBOLS MAP\n$api-symbols: (\n  all: (\n    content: ' ',\n    background: $white\n  ),\n  class: (\n    content: 'C',\n    background: $blue-500\n  ),\n  const: (\n    content: 'K',\n    background: $mediumgray\n  ),\n  decorator: (\n    content: '@',\n    background: $blue-800\n  ),\n  directive: (\n    content: 'D',\n    background: $pink-600\n  ),\n  enum: (\n    content: 'E',\n    background: $amber-700\n  ),\n  function: (\n    content: 'F',\n    background: $green-500\n  ),\n  interface: (\n    content: 'I',\n    background: $teal-500\n  ),\n  let: (\n    content: 'K',\n    background: $mediumgray\n  ),\n  ngmodule: (\n    content: 'M',\n    background: $darkorange\n  ),\n  package: (\n    content: 'Pk',\n    background: $purple-600\n  ),\n  pipe: (\n    content: 'P',\n    background: $blue-grey-600\n  ),\n  type-alias: (\n    content: 'T',\n    background: $light-green-600\n  ),\n  var: (\n    content: 'K',\n    background: $mediumgray\n  ),\n);\n\n// OTHER\n$small-breakpoint-width: 840px;\n$phone-breakpoint: 480px;\n$tablet-breakpoint: 800px;\n","// REM Font Adjustments\n@mixin font-size($sizeValue) {\n  font-size: ($sizeValue) + px;\n  font-size: ($sizeValue / 10) + rem;\n}\n\n@mixin letter-spacing($spacingValue) {\n  letter-spacing: ($spacingValue) + px;\n  letter-spacing: ($spacingValue / 10) + rem;\n}\n\n@mixin line-height($heightValue) {\n  line-height: ($heightValue) + px;\n  line-height: ($heightValue / 10) + rem;\n}\n\n// PLACEHOLDER\n// NOTE: Vendor-prefixed selectors must be on separate blocks, because one invalid/unknown\n//       selector will invalidate the whole block.\n@mixin placeholder {\n  &:-ms-input-placeholder      { @content; }  // IE\n  &::-ms-input-placeholder     { @content; }  // Edge\n  &::-webkit-input-placeholder { @content; }  // QQ Browser\n  &::placeholder               { @content; }  // Chrome/Firefox/Safari\n}\n\n@mixin rotate($degrees) {\n  -moz-transform: rotate($degrees);\n  -webkit-transform: rotate($degrees);\n  -o-transform: rotate($degrees);\n  -ms-transform: rotate($degrees);\n  transform: rotate($degrees);\n  transition: transform 150ms;\n  transition-timing-function: ease-in-out;\n}\n\n@mixin codeblock($bgcolor) {\n    background-color: $bgcolor;\n    border-radius: 5px;\n    padding: 20px;\n    margin: 0 auto; // was 24\n    border: 0.5px solid $lightgray;\n}\n\n// INFO CARD SKELETON\n@mixin card($height, $width) {\n  height: $height;\n  width: $width;\n  background-color: $white;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12);\n  box-sizing: border-box;\n  transition: box-shadow .5s;\n\n  &:hover {\n    box-shadow: 0 8px 8px rgba($black, 0.24), 0 0 8px rgba($black, 0.12);\n    text-decoration: none;\n  }\n}\n\n@mixin deploy-theme($mainColor, $gradientTargetColor) {\n  .mat-toolbar.mat-primary, footer {\n    background: linear-gradient(145deg, $mainColor, $gradientTargetColor);\n  }\n\n  .vertical-menu-item {\n    &.selected, &:hover {\n      color: $mainColor;\n    }\n  }\n\n  .toc-inner ul.toc-list li {\n    &.active a {\n      color: $mainColor;\n\n      &:before {\n        background-color: $mainColor;\n      }\n    }\n\n    &:hover a {\n      color: $mainColor;\n    }\n  }\n}\n\n/// Define some styles for docs (i.e. non-marketing) pages.\n///\n/// @example scss - Example SCSS:\n///   .foo {\n///     @include docs-pages {\n///       .bar {\n///         color: orange;\n///       }\n///     }\n///   }\n///\n///   .baz {\n///     @include docs-pages($nestParentSelector: true) {\n///       .qux {\n///         color: orange;\n///       }\n///     }\n///   }\n///\n/// @example css - Output CSS:\n///   .foo .folder-api .bar, .foo .folder-cli .bar, ... {\n///     color: orange;\n///   }\n///\n///   .folder-api .baz .qux, .folder-cli .baz .qux, ... {\n///     color: orange;\n///   }\n///\n/// @param {boolean} $nestParentSelector\n///   If true, the parent selector (`&`) is nested inside the docs pages selectors.\n@mixin docs-pages($nestParentSelector: false) {\n  $selectors: (\n    '.folder-api',\n    '.folder-cli',\n    '.folder-docs',\n    '.folder-errors',\n    '.folder-guide',\n    '.folder-start',\n    '.folder-tutorial',\n  );\n\n  @if $nestParentSelector and & {\n    @at-root #{selector-nest(#{$selectors}, &)} {\n      @content;\n    }\n  } @else {\n    #{$selectors} {\n      @content;\n    }\n  }\n}\n\n/// Define some styles for marketing (i.e. non-docs) pages.\n///\n/// @example scss - Example SCSS:\n///   .foo {\n///     @include marketing-pages {\n///       .bar {\n///         color: orange;\n///       }\n///     }\n///   }\n///\n///   .baz {\n///     @include marketing-pages($extraSelectors: ('.other-page'), $nestParentSelector: true) {\n///       .qux {\n///         color: orange;\n///       }\n///     }\n///   }\n///\n/// @example css - Output CSS:\n///   .foo .page-about .bar, .foo .page-contribute .bar, ... {\n///     color: orange;\n///   }\n///\n///   .page-about .baz .qux, .page-contribute .baz .qux, ..., .other-page .baz .qux {\n///     color: orange;\n///   }\n///\n/// @param {string[]} $extraSelectors\n///   A list of additional page selectors to apply the styles to.\n/// @param {boolean} $nestParentSelector\n///   If true, the parent selector (`&`) is nested inside the marketing pages selectors.\n@mixin marketing-pages($extraSelectors: (), $nestParentSelector: false) {\n  $marketingPagesSelectors: (\n    '.page-about',\n    '.page-contribute',\n    '.page-events',\n    '.page-features',\n    '.page-home',\n    '.page-presskit',\n    '.page-resources',\n  );\n  $selectors: join($marketingPagesSelectors, $extraSelectors, $separator: comma);\n\n  @if $nestParentSelector and & {\n    @at-root #{selector-nest(#{$selectors}, &)} {\n      @content;\n    }\n  } @else {\n    #{$selectors} {\n      @content;\n    }\n  }\n}\n",".sidenav-container {\n  width: 100%;\n  height: 100vh;\n}\n\n.sidenav-content {\n  display: block;  // This is required for browsers that do not recognize `<main>` as a block\n                   // element (such as IE11).\n  min-height: 100vh;\n  padding: 80px 3rem 2rem;\n  max-width: 50em;\n  margin: 0 auto;\n\n  @media screen and (max-width: 600px) {\n    min-height: 450px;\n    padding: 80px 2rem 1rem;\n  }\n\n  @media screen and (max-width: 480px) {\n    padding: 80px 1rem 1rem;\n  }\n\n  @include marketing-pages(\n      $extraSelectors: ('.page-api', '.page-file-not-found', '.page-guide-cheatsheet'),\n      $nestParentSelector: true) {\n    max-width: none;\n  }\n\n  button {\n    min-width: 24px;\n  }\n}\n\naio-menu {\n  @media (max-width: 600px) {\n    display: none;\n  }\n}\n",".no-animations aio-doc-viewer > * {\n  // Disable view transition animations.\n  transition: none !important;\n}\n","footer {\n  position: relative;\n  @include line-height(24);\n  flex: 1;\n  padding: 48px;\n  z-index: 0;\n  background-color: $blue;\n  font-weight: 300;\n\n  aio-footer {\n    position: relative;\n    z-index: 0;\n\n    & > * {\n      color: $white;\n      max-width: 50em;\n    }\n\n    .footer-block {\n      margin: 0 24px;\n      vertical-align: top;\n    }\n\n    a {\n      color: $white;\n      text-decoration: none;\n      z-index: 20;\n      position: relative;\n\n      &:hover {\n        text-decoration: underline;\n      }\n\n      &:visited {\n        text-decoration: none;\n      }\n\n      &:focus {\n        // `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.\n        outline: 1px solid rgba($white, 0.8);\n        outline-offset: 2px;\n      }\n    }\n\n    h3 {\n      @include font-size(16);\n      text-transform: uppercase;\n      font-weight: 400;\n      margin: 8px 0 12px;\n      color: $white;\n\n      @media (max-width: 600px) {\n        @include font-size(14);\n      }\n    }\n\n    p {\n      text-align: center;\n      margin: 10px auto 5px;\n\n      @media (max-width: 480px) {\n        text-align: left;\n      }\n    }\n\n    div.grid-fluid {\n      display: -ms-flexbox;\n      display: -webkit-flex;\n      display: flex;\n      justify-content: center;\n      text-align: left;\n      margin: 0 auto 40px;\n\n      ul {\n        list-style-position: inside;\n        padding: 0px;\n        margin: 0px;\n\n        li {\n          list-style-type: none;\n          padding: 4px 0;\n          text-align: left;\n        }\n      }\n\n      @media (max-width: 480px) {\n        flex-direction: column;\n\n        .footer-block {\n          margin: 8px 24px;\n        }\n      }\n    }\n  }\n\n  &::after {\n    content: \"\";\n    position: absolute;\n    z-index: -1;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    background: url(\"/assets/images/logos/angular/angular_whiteTransparent_withMargin.png\")\n        top 0 left 0 repeat,\n      url(\"/assets/images/logos/angular/angular_whiteTransparent_withMargin.png\")\n        top 80px left 160px repeat;\n    opacity: 0.05;\n    background-size: 320px auto;\n  }\n}\n","html, body {\n  height: 100%;\n}\n\nbody,\n.content {\n  background-color: $white;\n}\n\n.center-layout {\n  margin: 0 auto;\n  max-width: 62.5em;\n}\n\n.center-layout-wide {\n  margin: 0 auto;\n  max-width: 84em;\n}\n\n.github-links + .content h1 {\n  max-width: 90%;\n}\n\n.clear {\n  clear: both;\n}\n\n.l-flex-wrap {\n  display: flex;\n  flex-wrap: wrap;\n}\n\n.flex-center {\n  display: flex;\n  justify-content: center;\n}\n\n.center {\n  text-align: center;\n}\n\n.visually-hidden {\n  position: absolute !important;\n  top: -9999px !important;\n  left: -9999px !important;\n}\n",".hero {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  position: absolute;\n  width: 100%;\n  min-height: 480px;\n  height: 80vh;\n  max-height: 560px;\n  box-sizing: border-box;\n  padding: 48px 48px 32px 48px;\n  overflow: hidden;\n  transform: skewY(8deg);\n  transform-origin: 100%;\n\n  @media (max-width: 480px) {\n    max-height: 486px;\n    padding-top: 40px;\n    transform: none;\n  }\n\n  .hero-title {\n    display: inline-block;\n    @include font-size(28);\n    font-weight: 400;\n    @include line-height(48);\n    margin: 0 8px 0 0;\n    text-transform: uppercase;\n\n    &.is-standard-case {\n      text-transform: none;\n    }\n  }\n}\n\nsection#intro {\n  display: flex;\n  align-items: center;\n  position: relative;\n  width: 900px;\n  height: 480px;\n  margin: 0 auto -32px;\n  padding: 48px 0 0;\n  color: $white;\n\n  @media (max-width: 780px) {\n    flex-direction: column;\n    justify-content: center;\n    width: 100%;\n    max-width: 100vw;\n    padding: 40px 0 32px;\n\n    button {\n      margin: 0;\n      height: 60px;\n    }\n  }\n\n  .homepage-container {\n    width: 100%;\n    max-width: 1040px;\n    margin: 0 auto;\n    margin-top: -7%;\n    padding-top: 0;\n    padding-bottom: 0;\n\n    @media  (max-width: 780px) {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      width: 100%;\n      max-width: 100%;\n      padding: 0;\n    }\n  }\n\n  .hero-headline {\n    @include font-size(40);\n    @include line-height(64);\n    font-weight: 500;\n    margin: 32px 0;\n\n    &:after {\n      display: none;\n    }\n\n    @media (max-width: 780px) {\n      text-align: center;\n    }\n\n    @media (max-width: 575px) {\n      @include font-size(32);\n      @include line-height(50);\n    }\n  }\n\n  .hero-logo {\n    display: flex;\n\n    @media (max-width: 780px) {\n      justify-content: center;\n    }\n\n    img {\n      width: 400px;\n      height: 400px;\n      margin-bottom: 8px;\n      max-width: none;\n      padding: 0;\n      filter: drop-shadow(0 2px 2px rgba($black, 0.24));\n\n      @media (max-width: 780px) {\n        width: 250px;\n        height: 250px;\n      }\n    }\n  }\n}\n\n.announcement-bar {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  justify-content: space-around;\n  align-items: center;\n  max-width: 50vw;\n  margin: 0 auto;\n  padding: 16px;\n  background-color: $white;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12);\n  box-sizing: border-box;\n  transition: all 0.3s ease-in;\n\n  @media (max-width: 991px) {\n    flex-direction: column;\n    text-align: center;\n    padding: 32px 16px;\n  }\n\n  @media (max-width: 768px) {\n    width: 100%;\n    max-width: none;\n  }\n\n  & > * {\n    margin: 8px;\n  }\n\n  .button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 40px;\n    min-width: 160px;\n    @include font-size(16);\n    color: $white;\n    background-color: $blue;\n    border-radius: 48px;\n    box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);\n    box-sizing: border-box;\n    cursor: pointer;\n\n    &:hover {\n      color: rgba($white, 0.7);\n    }\n  }\n\n  .material-icons {\n    display: none;\n    right: 0;\n    position: static;\n    transition: all 0.3s ease-in;\n    @include font-size(16);\n  }\n\n  p {\n    @include font-size(16);\n    margin: 8px;\n    text-align: center;\n  }\n}\n\n// ANGULAR LINE\n.background-sky {\n  background-color: $blue;\n  background: $bluegradient;\n  color: $white;\n}\n\n.home-row .card {\n  @include card(70%, auto);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  position: relative;\n  width: 70%;\n  min-width: 350px;\n  height: auto;\n  margin: auto;\n  padding: 24px;\n  box-shadow: 0 6px 6px rgba(10, 16, 20, 0.15), 0 0 52px rgba(10, 16, 20, 0.12);\n\n  @media (max-width: 600px) {\n    margin: 16px auto 0;\n\n    h2 {\n      margin: 0;\n    }\n\n    img {\n      max-width: none;\n      height: 70px;\n    }\n  }\n\n  @media (max-width: 1300px) {\n    img {\n      height: 70px;\n      max-width: none;\n    }\n  }\n\n  img {\n    margin: 16px ;\n  }\n\n  .card-text-container {\n    margin: 0 16px;\n\n    p {\n      text-align: left;\n      color: $darkgray;\n      margin: 0;\n      padding: 8px 0;\n    }\n  }\n\n\n  &:hover {\n    h2 {\n      color: $blue;\n    }\n  }\n}\n\n.button.hero-cta {\n  padding: 2px 34px 0;\n  @include font-size(18);\n  font-weight: 600;\n  @include line-height(40);\n  background-color: $white;\n  border-radius: 48px;\n  box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);\n  box-sizing: border-box;\n  cursor: pointer;\n\n  &:hover {\n    opacity: 0.9;\n  }\n}\n\n@include marketing-pages {\n  .sidenav-content {\n    padding: 0 0 3rem;\n  }\n\n  article {\n    padding: 3rem;\n\n    @media (max-width: 800px) {\n      padding: 2.2rem;\n    }\n  }\n}\n\n.page-home {\n  .sidenav-content {\n    padding-bottom: 0;\n  }\n}\n\n.cta-bar {\n  &.announcement-bar {\n    background: none;\n    box-shadow: none;\n  }\n\n  .hero-cta {\n    color: $blue;\n  }\n}\n\n.text-headline {\n  @include font-size(20);\n  font-weight: 500;\n  color: $blue;\n  margin-top: 10px;\n  text-transform: uppercase;\n}\n\naio-shell:not(.view-SideNav) {\n  mat-sidenav-container.sidenav-container {\n    max-width: none;\n  }\n}\n\ndiv[layout=row]{\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    box-sizing: border-box;\n\n    @media (max-width: 480px) {\n      display: block;\n  }\n}\n\n.layout-row {\n    flex-direction: row;\n}\n\n.home-rows {\n    overflow: hidden;\n    @media (max-width: 600px) {\n      margin: 0;\n    }\n}\n\n.background-superhero-paper {\n    background-size: 100%;\n    background-blend-mode: multiply;\n}\n\n.home-row {\n  max-width: 920px;\n  margin: 32px auto;\n\n  .promo-img-container, .text-container {\n    max-width: 50%;\n\n    @media(max-width: 480px) {\n      max-width: 100%;\n      text-align: center;\n\n      &:nth-child(even) {\n        flex-direction: column-reverse;\n      }\n    }\n  }\n\n  .text-block {\n    padding-right: 15%;\n\n    @media(max-width: 600px) {\n      padding: 0;\n    }\n  }\n\n  .promo-img-container {\n    p {\n      margin: 0 20px;\n    }\n\n    img {\n      max-width: 90% !important;\n    }\n  }\n}\n\n.marketing-banner {\n  background-color: lighten($blue, 10);\n  margin-top: 64px;\n  padding: 32px;\n\n  @media (max-width: 600px) {\n    margin-top: 56px;\n    padding: 18px;\n  }\n\n  .banner-headline {\n    text-transform: uppercase;\n    @include font-size(24);\n    font-weight: 300;\n    color: $white;\n    margin: 0;\n    -webkit-margin-before: 0;\n    -webkit-margin-after: 0;\n\n    @media (max-width: 600px) {\n      @include font-size(18);\n      font-weight: 400;\n    }\n\n    &:after {\n      display: none;\n    }\n  }\n\n  .page-features & {\n    margin-bottom: 20px;\n  }\n}\n",".nf-container {\n    align-items: center;\n    padding: 32px;\n}\n\n.nf-response {\n    margin: 32px;\n    height: 100%;\n    flex-direction: column;\n\n    h1 {\n      @include font-size(48);\n      color: $blue;\n        text-transform: uppercase;\n        margin: 8px 0;\n    }\n}\n\n.nf-icon.material-icons {\n    color: $blue;\n    @include font-size(100);\n    position: static;\n}\n","// Disable sidenav animations for the initial render.\n.starting.mat-drawer-transition .mat-drawer-content {\n  transition: none;\n}\n\nmat-sidenav-container.sidenav-container {\n  background-color: $white;\n  min-height: 100%;\n  height: auto !important;\n  max-width: 100%;\n  margin: 0;\n  transform: none;\n\n  &.has-floating-toc {\n    max-width: 82%;\n  }\n\n  .sidenav-content {\n    height: auto;\n  }\n\n  mat-sidenav.sidenav {\n    position: fixed;\n    top: 64px;\n    bottom: 0;\n    left: 0;\n    min-width: 260px;\n    background-color: $superlightgray;\n    border-right: 1px solid $lightgray;\n\n    @media (max-width: 599px) {\n      top: 56px;\n    }\n\n    // Angular Version Selector\n    .doc-version {\n      padding: 8px;\n      border-top: 1px solid $lightgray;\n    }\n  }\n}\n\naio-nav-menu {\n  display: block;\n  margin: 0 auto;\n  max-width: 268px;\n\n  &:first-of-type {\n    margin-top: 16px;\n  }\n\n  &:last-of-type {\n    margin-bottom: 16px;\n  }\n\n  ul, a {\n    margin: 0;\n  }\n\n  aio-nav-item {\n    .vertical-menu-item {\n      box-sizing: border-box;\n      color: $darkgray;\n      cursor: pointer;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      overflow-wrap: break-word;\n      padding: 8px;\n      text-decoration: none;\n      text-align: left;\n      width: 100%;\n      word-wrap: break-word;\n\n      &:hover {\n        background-color: $lightgray;\n        color: $blue;\n        text-shadow: 0 0 5px $white;\n      }\n\n      &:focus {\n        outline: $focus-outline-onlight auto 2px;\n      }\n\n      &.selected {\n        color: $darkblue;\n      }\n\n      span {\n        padding-right: 32px;\n      }\n\n      //icons _within_ nav\n      .mat-icon {\n        height: 24px;\n        width: 24px;\n      }\n    }\n\n    button.vertical-menu-item {\n      border: none;\n      background-color: transparent;\n      margin: 0;\n      width: 100%;\n    }\n\n    .heading-children {\n      &.expanded {\n        visibility: visible;\n        opacity: 1;\n        padding-left: 0;\n        max-height: 4000px; // Arbitrary max-height. Can increase if needed. Must have measurement to transition height.\n        transition: visibility 500ms, opacity 500ms, max-height 500ms;\n        transition-timing-function: ease-in-out;\n      }\n\n      &.collapsed {\n        overflow: hidden;  // Needed to prevent unnecessary sidenav scrollbar.\n        visibility: hidden;\n        padding-left: 0;\n        opacity: 0;\n        max-height: 1px; // Must have measurement to transition height.\n        transition: visibility 275ms, opacity 275ms, max-height 280ms;\n        transition-timing-function: ease-out;\n      }\n\n      .no-animations &.expanded,\n      .no-animations &.collapsed {\n        transition: none !important;\n      }\n    }\n\n    .level-1 {\n      @include font-size(16);\n      @include line-height(28);\n      font-weight: 400;\n      padding-left: 20px;\n      margin: 0;\n      transition: background-color 0.2s;\n    }\n\n    .level-2 {\n      @include font-size(14);\n      @include line-height(24);\n      font-weight: 400;\n      margin: 0;\n      padding-left: 36px;\n    }\n\n    .level-3 {\n      @include font-size(14);\n      @include line-height(24);\n      margin: 0;\n      padding-left: 44px;\n    }\n\n    .level-4 {\n      @include font-size(14);\n      @include line-height(24);\n      margin: 0;\n      padding-left: 52px;\n    }\n\n    .level-1, .level-2, .level-3 {\n      &.collapsed > .mat-icon {\n        @include rotate(0deg);\n      }\n\n      &.expanded > .mat-icon {\n        @include rotate(90deg);\n      }\n    }\n  }\n}\n","// VARIABLES\n$showTopMenuWidth: 1048px;\n$hideTopMenuWidth: $showTopMenuWidth - 1;\n$hamburgerShownMargin: 0 8px 0 0;\n$hamburgerHiddenMargin: 0 16px 0 -64px;\n\n// DOCS PAGE / STANDARD: TOPNAV TOOLBAR FIXED\nmat-toolbar.app-toolbar {\n  position: fixed;\n  top: 0;\n  right: 0;\n  left: 0;\n  z-index: 10;\n  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n\n  // HOME PAGE OVERRIDE: TOPNAV TOOLBAR\n  .page-home & {\n    background-color: $blue;\n\n    @media (min-width: 481px) {\n      &:not(.transitioning) {\n        background-color: transparent;\n        box-shadow: none;\n        position: absolute;\n        transition: background-color 0.2s linear;\n      }\n    }\n  }\n\n  // DOCS PAGES OVERRIDE: HAMBURGER\n  @include docs-pages($nestParentSelector: true) {\n    @media (min-width: $showTopMenuWidth) {\n      .hamburger {\n        // Hamburger shown on non-marketing pages even on large screens.\n        margin: $hamburgerShownMargin;\n      }\n    }\n  }\n\n  mat-toolbar-row {\n    padding: 0 16px 0 0;\n  }\n\n  mat-icon {\n    color: $white;\n  }\n\n  // HAMBURGER BUTTON\n  .hamburger {\n    height: 100%;\n    margin: $hamburgerShownMargin;\n    padding: 0;\n\n    @media (min-width: $showTopMenuWidth) {\n      // Hamburger hidden by default on large screens.\n      // (Will be shown per doc.)\n      margin: $hamburgerHiddenMargin;\n    }\n\n    @media (max-width: 480px) {\n      min-width: 15%;\n    }\n\n    &:not(.starting) {\n      transition-duration: 0.4s;\n      transition-property: color, margin;\n      transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);\n    }\n\n    &:hover {\n      color: $offwhite;\n    }\n\n    & .mat-icon {\n      color: $white;\n      position: inherit;\n    }\n  }\n\n  // HOME NAV-LINK\n  .nav-link.home {\n    cursor: pointer;\n    margin: 0 16px 0 0;\n    padding: 8px 0;\n\n    &:focus {\n      // `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.\n      outline: 1px solid $focus-outline-ondark;\n      outline-offset: 4px;\n    }\n\n    @media screen and (max-width: $hideTopMenuWidth) {\n      padding: 4px 0;\n    }\n\n    @media screen and (max-width: 480px) {\n      margin-right: 8px;\n    }\n\n    img {\n      position: relative;\n      margin-top: -21px;\n      top: 12px;\n      height: 40px;\n\n      @media (max-width: $hideTopMenuWidth) {\n        &:hover {\n          transform: scale(1.1);\n        }\n      }\n    }\n  }\n\n  // TOP MENU\n  aio-top-menu {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    width: 80%;\n\n    ul {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      list-style-position: inside;\n      padding: 0px;\n      margin: 0px;\n\n      li {\n        padding-bottom: 2px;\n        list-style-type: none;\n        cursor: pointer;\n\n        &:focus {\n          outline: none;\n        }\n\n        a.nav-link {\n          margin: 0 4px;\n          padding: 0px;\n          cursor: pointer;\n\n          .nav-link-inner {\n            border-radius: 4px;\n            padding: 8px 16px;\n\n            &:hover {\n              background: rgba($white, 0.15);\n            }\n          }\n\n          &:focus {\n            outline: none;\n\n            .nav-link-inner {\n              background: rgba($white, 0.15);\n              border-radius: 1px;\n              box-shadow: 0 0 1px 2px $focus-outline-ondark;\n            }\n          }\n\n          &:active {\n            .nav-link-inner {\n              background: rgba($white, 0.15);\n            }\n          }\n        }\n\n        &.selected {\n          a.nav-link {\n            .nav-link-inner {\n              background: rgba($white, 0.15);\n            }\n          }\n        }\n      }\n    }\n  }\n\n  // SEARCH BOX\n  aio-search-box.search-container {\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    width: 100%;\n    min-width: 150px;\n    height: 100%;\n    margin-right: 16px;\n\n    input {\n      color: $darkgray;\n      border: none;\n      border-radius: 100px;\n      background-color: $white;\n      padding: 5px 16px;\n      margin-left: 8px;\n      width: 180px;\n      max-width: 240px;\n      height: 50%;\n      -webkit-appearance: none;\n\n      &:focus {\n        outline: none;\n      }\n\n      @include placeholder {\n        @include font-size(14);\n        color: $mediumgray;\n      }\n\n      @media (min-width: 1000px) {\n        transition: width 0.4s ease-in-out;\n\n        &:focus {\n          width: 80%;\n        }\n      }\n\n      @media (max-width: 480px) {\n        width: 150px;\n      }\n    }\n  }\n\n  // EXTERNAL LINK ICONS\n  .toolbar-external-icons-container {\n    display: flex;\n    flex-direction: row;\n    flex-shrink: 0; // This is required for the icons to be displayed correctly in IE11.\n    height: 100%;\n\n    a {\n      display: flex;\n      align-items: center;\n      padding: 24px;\n      margin: 0 -16px;\n\n      &:focus {\n        // `outline-offset` is not applied on Chrome on Windows, if `outline-style` is `auto.\n        outline: 1px solid $focus-outline-ondark;\n        outline-offset: -16px;\n      }\n\n      @media screen and (max-width: 480px) {\n        margin: 0 0 0 8px;\n        padding: 0;\n      }\n\n      &:hover {\n        opacity: 0.8;\n      }\n\n      img {\n        height: 24px;\n      }\n    }\n  }\n}\n",".alert {\n    padding: 16px;\n    margin: 24px 0px;\n    @include font-size(14);\n    color: $darkgray;\n    width: 100%;\n    box-sizing: border-box;\n    clear: both;\n\n    h1, h2, h3, h4, h5, h6 {\n      font-weight: 500;\n    }\n\n    &.is-critical {\n        border-left: 8px solid $brightred;\n        background-color: rgba($brightred, 0.05);\n\n        h1, h2, h3, h4, h5, h6 {\n            color: $brightred;\n        }\n    }\n\n    &.is-important {\n        border-left: 8px solid $orange;\n        background-color: rgba($orange, 0.05);\n\n        h1, h2, h3, h4, h5, h6 {\n            color: $orange;\n        }\n    }\n\n    &.is-helpful {\n        border-left: 8px solid $blue;\n        background-color: rgba($blue, 0.05);\n\n        h1, h2, h3, h4, h5, h6 {\n            color: $blue;\n        }\n    }\n\n    &.archive-warning {\n      background-color: $darkred;\n      border-radius: 4px;\n      margin-bottom: 1rem;\n\n      * {\n        color: $white;\n      }\n\n      a {\n        color: $white;\n        font-weight: bold;\n        text-decoration: underline;\n\n        &:hover {\n          opacity: 0.9;\n        }\n      }\n    }\n\n    > * {\n        margin: 8px 16px;\n    }\n}\n","/* API LIST STYLES */\n\naio-api-list {\n  .api-filter {\n    display: flex;\n    margin: 0 auto;\n\n    @media (max-width: 600px) {\n      flex-direction: column;\n      margin: 16px auto;\n    }\n\n    /* API FILTER MENU */\n    aio-select {\n      width: 200px;\n\n      @media screen and (max-width: 600px) {\n        width: 100%;\n      }\n    }\n\n    .form-select-menu,\n    .form-search {\n      margin: 8px;\n\n      @media screen and (max-width: 600px) {\n        margin-left: 0;\n      }\n    }\n\n    aio-select:first-child {\n      .form-select-menu {\n        margin-left: 0;\n      }\n    }\n\n    .form-search {\n      position: relative;\n      float: left;\n\n      input {\n        box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12);\n        box-sizing: border-box;\n        border: 1px solid $white;\n        border-radius: 4px;\n        color: $darkgray;\n        @include font-size(14);\n        @include line-height(32);\n        outline: none;\n        padding: 4px 16px 4px 32px;\n        transition: all .2s;\n        width: 182px;\n\n        @include placeholder {\n          @include font-size(14);\n          color: $mediumgray;\n        }\n\n        &:focus {\n          border: 1px solid $blue-400;\n          box-shadow: 0 2px 2px rgba($blue-400, 0.24), 0 0 2px rgba($blue-400, 0.12);\n        }\n\n        @media screen and (max-width: 600px) {\n          width: 100%;\n        }\n      }\n\n      .material-icons {\n        color: $blue-grey-600;\n        @include font-size(20);\n        left: 8px;\n        pointer-events: none;\n        position: absolute;\n        top: 12px;\n        width: 20px;\n        z-index: $layer-1;\n      }\n    }\n\n    /* API SEARCH ICON */\n    .material-icons {\n      right: 48px;\n    }\n  }\n\n  /* LAYOUT */\n\n  .api-list-container {\n    display: flex;\n    flex-direction: column;\n    padding: 16px 0;\n    position: relative;\n\n    @media handheld and (max-width: $phone-breakpoint),\n    screen and (max-device-width: $phone-breakpoint),\n    screen and (max-width: $tablet-breakpoint) {\n      padding: 24px 0 0;\n    }\n\n    h2 {\n      margin-top: 16px;\n      margin-bottom: 16px;\n    }\n\n    /* API CLASS LIST */\n    .api-list {\n      list-style: none;\n      margin: 0 0 32px -8px;\n      padding: 0;\n      overflow: hidden;\n\n      @media screen and (max-width: 600px) {\n        margin: 0 0 0 -8px;\n      }\n\n      li {\n        @include font-size(14);\n        margin: 8px 0;\n        @include line-height(14);\n        padding: 0;\n        float: left;\n        width: 33%;\n        overflow: hidden;\n        min-width: 330px;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n\n        a {\n          color: $blue-grey-600;\n          @include line-height(16);\n          padding: 0 16px;\n          text-decoration: none;\n          transition: all .3s;\n\n          &:hover {\n            background: $blue-grey-50;\n            color: $blue-500;\n          }\n\n          &.deprecated-api-item {\n            text-decoration: line-through;\n          }\n        }\n      }\n    }\n  }\n}\n",".api-body {\n  max-width: 1200px;\n\n  h1 {\n    margin-top: -4px;\n  }\n\n  details.overloads {\n    box-shadow: none;\n\n    .icon-action-header {\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      justify-content: space-between;\n\n      a {\n        display: flex;\n      }\n    }\n\n    .detail-contents {\n      padding: 0;\n      border: 1px solid $lightgray;\n      border-radius: 2px;\n      box-shadow: none;\n\n      > *:not(hr) {\n        margin: 16px 24px;\n      }\n    }\n\n    summary {\n      height: inherit;\n      padding: 0;\n\n      h4 {\n        margin: 0;\n        clear: left;\n      }\n      .actions {\n        display: flex;\n        color: $blue;\n        @include font-size(14);\n      }\n      .show-all {\n        display: initial;\n      }\n      .collapse-all {\n        display: none;\n      }\n    }\n\n    &[open] > summary {\n      .show-all {\n        display: none;\n      }\n      .collapse-all {\n        display: initial;\n      }\n    }\n  }\n\n  details.overload {\n    box-shadow: none;\n    margin: 0;\n  }\n\n  table {\n    margin: 12px 0 24px;\n\n    &.item-table {\n      td {\n        padding: 32px;\n      }\n    }\n\n    &.list-table {\n      td {\n        padding: 16px 24px;\n      }\n    }\n\n    &.parameters-table {\n      margin-top: 0;\n      @include font-size(14);\n      box-shadow: none;\n\n      tr {\n        @media screen and (max-width: 480px) {\n          display: flex;\n          flex-direction: column;\n        }\n\n        td:first-child {\n          font-weight: 600;\n          padding-left: 16px;\n          width: 20%;\n        }\n      }\n\n      td {\n        padding: 8px 8px 8px 0;\n        border: 0;\n        vertical-align: top;\n      }\n    }\n\n    &.property-table {\n      td {\n        vertical-align: top;\n      }\n    }\n\n    &.method-table,\n    &.option-table,\n    &.list-table {\n      td > code {\n        background-color: inherit;\n        white-space: pre-wrap;\n      }\n\n      .with-github-links {\n        align-items: center;\n        display: flex;\n        justify-content: space-between;\n\n      .github-links {\n        a {\n          color: $mediumgray;\n\n          .material-icons:hover {\n            background: none;\n            color: $blue;\n          }\n        }\n      }\n    }\n\n      h3 {\n        margin: 6px 0;\n        font-weight: 500;\n        clear: left;\n      }\n\n      h4 {\n        @include font-size(14);\n        font-weight: bold;\n        margin-top: 12px;\n      }\n    }\n\n    th {\n      text-transform: none;\n      @include font-size(16);\n      font-weight: bold;\n    }\n\n    tr {\n      border-bottom: 1px solid $lightgray;\n\n      &:last-child {\n        border-bottom: none;\n      }\n    }\n\n    td {\n      vertical-align: middle;\n    }\n\n    // This is overriding a style here:\n    // https://github.com/angular/angular/blob/95993e1/aio/src/styles/2-modules/_table.scss#L58-L62\n    tbody > tr > td tr td:first-child {\n      @media screen and (max-width: 480px) {\n        background-color: inherit;\n      }\n    }\n\n    hr {\n      margin: 16px 0;\n    }\n\n    .short-description {\n      margin-left: 0;\n    }\n  }\n\n  .class-overview {\n    position: relative;\n\n    code-example {\n      clear: left;\n    }\n  }\n\n  .member-name .pln {\n    font-weight: 700;\n  }\n\n  .short-description {\n    margin-top: 8px;\n  }\n\n  .api-heading {\n    @include font-size(14);\n    margin: 16px;\n  }\n\n  .from-constructor,\n  .read-only-property,\n  .write-only-property {\n    @include font-size(12);\n    font-weight: 600;\n    @include letter-spacing(0.5);\n    font-style: italic;\n    background-color: $lightgray;\n    border-radius: 4px;\n    padding: 4px 6px;\n  }\n\n  .selector-list,\n  .inherited-members-list {\n    ul {\n      padding: 0;\n\n      li {\n        list-style: none;\n        margin-bottom: 12px;\n      }\n    }\n  }\n\n  .selector-list {\n    li,\n    a {\n      font-weight: bold;\n\n      i {\n        font-weight: normal;\n      }\n    }\n  }\n}\n\n.github-links {\n  float: right;\n\n  .material-icons {\n    border-radius: 4px;\n    padding: 4px;\n    @include font-size(20);\n\n    &:hover {\n      background-color: $mist;\n    }\n  }\n}\n\n.breadcrumb-container {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n}\n\n.api-header {\n  display: flex;\n  align-items: center;\n  margin-top: -4px;\n\n  @media screen and (max-width: 600px) {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  h1 {\n    @include font-size(24);\n    margin: 0;\n  }\n}\n\n.deprecated-api-item {\n  text-decoration: line-through;\n}\n","/* API SYMBOLS */\n\n/* SYMBOL CLASS */\n\n.symbol {\n  border-radius: 2px;\n  box-shadow: 0 1px 2px rgba($black, .24);\n  color: $white;\n  display: inline-block;\n  @include font-size(10);\n  font-weight: 600;\n  @include line-height(16);\n  margin-right: 8px;\n  text-align: center;\n  width: 16px;\n\n  // SYMBOL TYPES\n  // Symbol mapping variables in *constants*\n  @each $name, $symbol in $api-symbols {\n    &.#{$name} {\n      background: map-get($symbol, background);\n\n      &:before {\n        content: map-get($symbol, content);\n      }\n    }\n  }\n}\n","/* Button Styles */\n\nbutton {\n  font-family: inherit;\n}\n\n// This rule overrides some Angular Material styles defined for `.mat-button`\n// (hence we include `.mat-button` in the selector).\na.button.mat-button,\n.button {\n  color: inherit;\n  display: inline-block;\n  @include line-height(32);\n  padding: 0px 16px;\n  @include font-size(14);\n  font-weight: 400;\n  border-radius: 3px;\n  text-decoration: none;\n  text-transform: uppercase;\n  overflow: hidden;\n  border: none;\n\n  // SIZES\n  &.button-small {\n    @include font-size(12);\n    @include line-height(24);\n    padding: 0px 8px;\n  }\n\n  &.button-large {\n    @include font-size(15);\n    @include line-height(48);\n    padding: 0px 24px;\n  }\n\n  &.button-x-large {\n    @include font-size(16);\n    @include line-height(56);\n    padding: 0px 24px;\n  }\n\n\n  // COLORS\n\n  &.button-secondary {\n    background: $mediumgray;\n    color: rgba($white, .87);\n  }\n\n  &.button-plain {\n    background: $white;\n    color: rgba($darkgray, .87);\n  }\n\n  &.button-subtle {\n    background: $mediumgray;\n    color: darken($offwhite, 10%);\n\n    &:hover {\n      color: rgba($white, 0.7);\n    }\n  }\n\n  &.button-blue {\n    background: $blue;\n    color: rgba($white, .87);\n\n    &:hover {\n      color: rgba($white, 0.7);\n    }\n  }\n\n  &.button-banner {\n    background: $darkgray;\n    color: rgba($white, .87);\n  }\n}\n\n.cta-bar {\n  text-align: center;\n\n  .button {\n    margin: 0px 8px;\n    box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);\n    transition: all .2s ease-in-out;\n    &:hover {\n        transform: scale(1.1);\n        color: $offwhite;\n    }\n  }\n}\n\n\n.group-buttons {\n  margin: 16px auto 32px;\n\n  // This rule overrides some Angular Material styles defined for `.mat-button`\n  // (hence we include `.mat-button` in the selector).\n  a.button.mat-button.filter-button {\n    background-color: rgba($blue, 0.2);\n    border-radius: 4px;\n    @include font-size(16);\n    @include line-height(48);\n    margin: 8px;\n    padding: 0px 16px;\n    width: 168px;\n\n    &.selected,\n    &:hover {\n      background-color: $blue;\n      color: $white;\n    }\n\n    @media (max-width: 480px) {\n      @include font-size(14);\n      width: auto;\n    }\n  }\n}\n\n[mat-button], [mat-raised-button], [mat-button], [mat-raised-button] {\n  text-transform: uppercase;\n}\n",".callout {\n  @extend .alert;\n  padding: 0px;\n  border-left: none !important;\n  border-radius: 4px;\n\n  header {\n    color: $white;\n    @include line-height(24);\n    font-weight: 500;\n    padding: 8px 16px;\n    margin: 0;\n    text-transform: uppercase;\n    border-radius: 4px 4px 0 0;\n  }\n\n  p {\n    padding: 16px;\n    margin: 0px;\n    @include font-size(14);\n  }\n\n  > *:not(:first-child) {\n    padding: 16px 24px;\n  }\n\n  &.is-critical {\n    border-color: $brightred;\n    background: rgba($brightred, 0.05);\n\n    header {\n      background: $brightred;\n    }\n  }\n\n  &.is-important {\n    border-color: $orange;\n    background: rgba($orange, 0.05);\n\n    header {\n      background: $amber-700;\n    }\n  }\n\n  &.is-helpful {\n    border-color: $blue;\n    background: rgba($blue, 0.05);\n\n    header {\n      background: $blue;\n    }\n  }\n}\n",".card-container {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  justify-content: center;\n  margin: 16px 0;\n\n  .docs-card {\n    @include card(194px, 35%);\n    max-width: 340px;\n    min-width: 300px;\n    margin: 24px 16px;\n    padding-bottom: 48px;\n    position: relative;\n\n    @media screen and (max-width: 600px) {\n      width: 100%;\n      margin: 8px auto;\n      max-width: none;\n    }\n\n    section {\n      color: $blue;\n      @include font-size(20);\n      @include line-height(24);\n      margin: 0;\n      padding: 32px 0 24px;\n      text-transform: none;\n      text-align: center;\n    }\n\n    p {\n      color: $darkgray;\n      @include font-size(13);\n      @include line-height(24);\n      padding: 0 16px;\n      margin: 0;\n      text-align: center;\n    }\n\n    .card-footer {\n      color: $darkblue;\n      background-color: rgba($blue, 0.1);\n      bottom: 0;\n      border-top: 0.5px solid $lightgray;\n      box-sizing: border-box;\n      @include line-height(48);\n      left: 0;\n      position: absolute;\n      right: 0;\n      text-align: right;\n\n      a {\n        color: $mediumgray;\n        @include font-size(13);\n      }\n    }\n  }\n}\n\n.card-section {\n  @include card(auto, 90%);\n  padding: 16px 32px;\n  margin: 16px 0;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n\n  // Removes on-hover effect from card mixin\n  &:hover {\n    box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12);\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin: 8px 0;\n  }\n\n  a,\n  .button,\n  button {\n    text-align: center;\n  }\n}\n",".cli-name {\n  font-weight: bold;\n\n  .kwd { color: initial }  /* override code format */\n}\n\n.cli-option-syntax {\n  white-space: pre;\n}\n","code-example,\ncode-tabs {\n  clear: both;\n  display: block;\n\n  code {\n    overflow: auto;\n  }\n\n  ol {\n    list-style: decimal;\n  }\n\n  .mat-card {\n    padding: 0;\n    border-radius: 5px;\n  }\n}\n\ncode-example {\n  &:not(.no-box) {\n    background-color: rgba($backgroundgray, 0.2);\n    border: 0.5px solid $lightgray;\n    border-radius: 5px;\n    color: $darkgray;\n    margin: 16px auto;\n  }\n\n  &.no-box {\n    pre.prettyprint {\n      margin: 0;\n    }\n\n    code {\n      background-color: transparent;\n    }\n  }\n\n  code {\n    overflow: auto;\n  }\n\n  // TERMINAL / SHELL TEXT STYLES\n  &[language=sh], &[language=bash] {\n    background-color: $darkgray;\n  }\n\n  header {\n    background-color: $accentblue;\n    border-radius: 5px 5px 0 0;\n    color: $offwhite;\n    @include font-size(16);\n    padding: 8px 16px;\n  }\n}\n\ncode-tabs {\n  margin: 16px 0;\n\n  .code-tab-group {\n    .mat-tab-label {\n      &:hover {\n        background: rgba(black, 0.04);\n      }\n    }\n\n    .mat-tab-body {\n      overflow-y: hidden;\n\n      .mat-tab-body-content {\n        height: auto;\n        transform: none;\n\n        .fadeIn {\n          animation: opacity 2s ease-in;\n        }\n      }\n    }\n  }\n}\n\ncode-example.avoid header,\ncode-example.avoidFile header {\n  border: 2px solid $anti-pattern;\n  background: $anti-pattern;\n}\n\ncode-example.avoid,\ncode-example.avoidFile,\ncode-tabs.avoid mat-tab-body,\ncode-tabs.avoidFile mat-tab-body {\n  border: 0.5px solid $anti-pattern;\n}\n\naio-code {\n  pre.prettyprint {\n    position: relative;\n    display: flex;\n    min-height: 32px;\n    margin: 16px 24px;\n    white-space: pre-wrap;\n    align-items: center;\n\n    code {\n      a {\n        color: inherit;\n      }\n\n      span {\n        @include line-height(24);\n      }\n\n      ol.linenums {\n        margin: 0;\n        color: lighten($mediumgray, 25%);\n\n        li {\n          margin: 0;\n          font-family: $code-font;\n          font-size: 90%;\n          @include line-height(24);\n\n          &::marker {\n            color: lighten($mediumgray, 25%);\n          }\n        }\n      }\n\n      .code-missing {\n        color: $darkred;\n      }\n    }\n\n    .copy-button {\n      position: absolute;\n      top: -7px;\n      right: -19px;\n      padding: 0;\n      overflow: visible; // This is required for the button to be displayed correctly in IE11.\n\n      color: $blue-grey-200;\n      background-color: transparent;\n      border: none;\n      cursor: pointer;\n\n      &:hover {\n        color: $mediumgray;\n      }\n    }\n\n    &.lang-sh, &.lang-bash {\n      .copy-button {\n        color: $mediumgray;\n\n        &:hover {\n          color: $lightgray;\n        }\n      }\n    }\n  }\n}\n\n.sidenav-content {\n  code {\n    a {\n      color: $darkblue;\n      font-size: inherit;\n      font-weight: inherit;\n    }\n  }\n\n  :not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(pre) {\n    > code {\n      background-color: rgba($lightgray, 0.5);\n      border-radius: 4px;\n      color: $deepgray;\n      padding: 0 4px;\n    }\n\n    &:not(a) > code {\n      padding: 4px;\n    }\n  }\n\n  .page-guide-cheatsheet & {\n    td:first-of-type,\n    th {\n      code {\n        background-color: inherit;\n        padding: 0;\n        white-space: pre-wrap;\n      }\n    }\n  }\n\n  .code-anchor {\n    cursor: pointer;\n    text-decoration: none;\n    font-size: inherit;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n}\n\n/* PRETTY PRINTING STYLES for prettify.js. */\n\n/* The following class|color styles are derived from https://github.com/google/code-prettify/blob/master/src/prettify.css*/\n\n/* SPAN elements with the classes below are added by prettyprint. */\n.pln { color: #000 }  /* plain text */\n\n@media screen {\n  .str { color: #800 }  /* string content */\n  .kwd { color: #00f }  /* a keyword */\n  .com { color: #060 }  /* a comment */\n  .typ { color: red }  /* a type name */\n  .lit { color: #08c }  /* a literal value */\n  /* punctuation, lisp open bracket, lisp close bracket */\n  .pun, .opn, .clo { color: #660 }\n  .tag { color: #008 }  /* a markup tag name */\n  .atn { color: #606 }  /* a markup attribute name */\n  .atv { color: #800 }  /* a markup attribute value */\n  .dec, .var { color: #606 }  /* a declaration; a variable name */\n  .fun { color: red }  /* a function name */\n}\n\n/* Use higher contrast and text-weight for printable form. */\n@media print, projection {\n  .str { color: #060 }\n  .kwd { color: #006; font-weight: bold }\n  .com { color: #600; font-style: italic }\n  .typ { color: #404; font-weight: bold }\n  .lit { color: #044 }\n  .pun, .opn, .clo { color: #440 }\n  .tag { color: #006; font-weight: bold }\n  .atn { color: #404 }\n  .atv { color: #060 }\n}\n\n/* SHELL / TERMINAL CODE BLOCKS */\n\ncode-example {\n  &[language=sh], &[language=bash] {\n    .pnk, .blk, .pln, .otl, .kwd, .typ, .tag, .str, .atv, .atn, .com, .lit, .pun, .dec {\n      color: $codegreen;\n    }\n  }\n}\n",".contribute-container {\n  h2 {\n    margin: 0;\n  }\n\n  .card-section {\n    justify-content: space-between;\n\n    @media (max-width: 600px) {\n      flex-direction: column;\n    }\n\n    > :first-child {\n      margin-right: 2rem;\n      width: 67%;\n\n      @media (max-width: 600px) {\n        width: 100%;\n      }\n    }\n\n    &:last-child {\n      margin-bottom: 0;\n    }\n\n    .button {\n      @media (max-width: 600px) {\n        margin-top: 14px;\n      }\n    }\n  }\n}\n","aio-contributor-list {\n  .contributor-group {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n  }\n\n  @media handheld and (max-width: 480px), screen and (max-width: 900px) {\n    .grid-fluid {\n      margin-left: 20px;\n      margin-right: 20px;\n      float: none;\n      display: block;\n      width: auto;\n    }\n  }\n}\n\naio-contributor {\n  background: $white;\n  margin: 8px;\n  position: relative;\n  cursor: pointer;\n  border-radius: 4px;\n  box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n  transition: all .3s;\n  perspective: 800px;\n\n  @media (hover) {\n    &:hover {\n      transform: translate3d(0,-3px,0);\n      box-shadow: 0 8px 8px rgba(10, 16, 20, 0.24), 0 0 8px rgba(10, 16, 20, 0.12);\n\n      .contributor-image {\n        transform: scale(1.05);\n      }\n\n      .contributor-info {\n        opacity: 1;\n      }\n    }\n  }\n\n  .contributor-info {\n    background: rgba($darkgray, 0.5);\n    height: 168px;\n    width: 168px;\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    text-align: center;\n    /* There is no point in hiding this if we can't hover to show it. */\n    @media (hover) { opacity: 0; }\n    border-radius: 50%;\n\n    .info-item {\n      color: $white;\n      display: flex;\n      @include font-size(14);\n      font-weight: 500;\n      margin: 8px;\n      padding: 0;\n\n      &:hover {\n        color: $lightgray;\n        text-decoration: none;\n      }\n\n      &.icon {\n        min-width: 20px;\n        width: 20px;\n\n        mat-icon {\n          height: 20px;\n          width: 20px;\n\n          &.link-icon {\n            margin-top: -7px;\n            transform: rotateZ(45deg);\n          }\n        }\n      }\n    }\n  }\n\n  .contributor-card {\n    width: 250px;\n    height: 270px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: space-between;\n    position: relative;\n    overflow: hidden;\n    border-radius: 4px;\n    transform-style:preserve-3d;\n    transition:transform ease 500ms;\n\n    h3 {\n      margin: 8px 0;\n    }\n\n    .card-front, .card-back {\n      width: 100%;\n      height: 100%;\n      text-align: center;\n      display: flex;\n      flex-direction: column;\n      box-sizing: border-box;\n    }\n\n    .card-front {\n      justify-content: center;\n    }\n\n    .card-back {\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n      justify-content: center;\n      padding: 16px 24px;\n      transform:rotateY(180deg);\n\n      section {\n        display: none;\n      }\n\n      p {\n        margin: 8px 0;\n        @include font-size(12);\n        @include line-height(14);\n        text-align: left;\n      }\n    }\n\n    &.flipped {\n      transform:rotateY(180deg);\n\n      .card-front {\n        display: none;\n      }\n    }\n  }\n\n  .contributor-image {\n    display: flex;\n    justify-content: center;\n    border-radius: 50%;\n    align-items: center;\n    height: 168px;\n    width: 168px;\n    background-size: cover;\n    background-position: center;\n    margin: 8px auto;\n    border: 2px solid $lightgray;\n    transition: all .2s ease-in-out;\n  }\n\n  p {\n    cursor: pointer;\n    @include font-size(14);\n    @include line-height(18);\n    margin: 8px 16px;\n    text-overflow: ellipsis;\n    overflow-y: auto;\n    font-weight: 400;\n  }\n}\n","/*\n * General styling to make detail/summary tags look a bit more material\n * To get the best out of it you should structure your usage like this:\n *\n * ```html\n * <details>\n *   <summary>Some title</summary>\n *   <div class=\"details-content\">\n *     Some content\n *   </div>\n * </details>\n * ```\n */\n\ndetails {\n  box-shadow: 0 1px 4px 0 rgba($black, 0.37);\n\n  > summary {\n    cursor: pointer;\n    @include font-size(16);\n    position: relative;\n    padding: 16px 24px;\n    color: $black;\n    height: 16px;\n    display: block; // Remove the built in details marker in FF\n    overflow: hidden;\n\n    &::-webkit-details-marker {\n      display: none; // Remove the built in details marker in webkit\n    }\n\n    // Rotate the icon\n    i.material-icons.expand {\n      @include rotate(0deg);\n\n      @at-root #{selector-replace(&, 'details', 'details[open]')} {\n        @include rotate(180deg);\n      }\n    }\n\n    > h2 {\n      margin: 0;\n      padding: 0;\n      border: none;\n      display: inline;\n    }\n  }\n\n  .detail-contents {\n    padding: 16px 24px;\n  }\n}\n","\n.error-list {\n  display: grid;\n  list-style: none;\n  padding: 0;\n  overflow: hidden;\n\n  @media screen and (max-width: 600px) {\n    margin: 0 0 0 -8px;\n  }\n\n  li {\n    @include font-size(14);\n    margin: 8px 0;\n    @include line-height(14);\n    padding: 0;\n    float: left;\n    overflow: hidden;\n    min-width: 220px;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    .symbol {\n      &.runtime {\n        background: $green-500;\n      }\n\n      &.compiler {\n        background: $blue-500;\n      }\n    }\n\n    .symbol.runtime:before {\n      content: \"R\";\n    }\n\n    .symbol.compiler:before {\n      content: \"C\";\n    }\n\n    a {\n      color: $blue-grey-600;\n      display: inline-block;\n      @include line-height(16);\n      padding: 0 16px 0;\n      text-decoration: none;\n      transition: all .3s;\n      overflow: hidden;\n      text-overflow: ellipsis;\n\n      &:hover {\n        background: $blue-grey-50;\n        color: $blue-500;\n      }\n    }\n  }\n}\n\n.error-video-container {\n  position: relative;\n  padding-bottom: 56.25%; /* 16:9 */\n  height: 0;\n\n  iframe {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n  }\n}\n","// FEATURES MARKETING PAGE SPECIFIC STYLES\n\n.feature-section {\n  margin: 0 0 32px;\n\n  .feature-header, .text-headline {\n    text-align: center;\n  }\n\n  .feature-header img {\n    margin: 16px;\n    max-width: 70px;\n  }\n\n  .feature-title {\n    @include font-size(16);\n    font-weight: 500;\n    margin: 8px 0px;\n    clear: both;\n  }\n\n  .feature-row {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-around;  // This is required for browsers that do not support\n                                    // `space-evenly` (such as IE11).\n    justify-content: space-evenly;\n\n    @media (max-width: 1057px) {\n      flex-direction: column;\n    }\n\n    .feature {\n      max-width: 300px;\n      margin: 0 16px;\n\n      @media (max-width: 1057px) {\n        max-width: 100%;\n        padding: 8px 10%;\n      }\n\n      @media (max-width: 768px) {\n        padding: 8px 0;\n      }\n    }\n  }\n}\n",".filetree {\n  background: $white;\n  border: 4px solid $lightgray;\n  border-radius: 4px;\n  margin: 0 0 24px 0;\n  padding: 16px 32px;\n\n  .file {\n    display: block;\n    @include letter-spacing(0.3);\n    @include line-height(32);\n    color: $darkgray;\n  }\n\n  .children {\n    padding-left: 24px;\n    position: relative;\n    overflow: hidden;\n\n    .file {\n      position: relative;\n\n      &:before {\n        content: '';\n        left: -18px;\n        bottom: 16px;\n        width: 16px;\n        height: 9999px;\n        position: absolute;\n        border-width: 0 0 1px 1px;\n        border-style: solid;\n        border-color: $lightgray;\n        border-radius: 0 0 0 3px;\n      }\n    }\n  }\n}\n",".reviewed {\n  color: lighten($darkgray, 10);\n  @include font-size(13);\n  font-style: italic;\n  text-align: right;\n}",".sidenav-content {\n  h1, h2, h3, h4, h5, h6 {\n\n    .header-link {\n      color: $mediumgray;\n      margin: 0 6px;\n      text-decoration: none;\n      user-select: none;\n      visibility: hidden;\n      display: inline-flex;\n      vertical-align: middle;\n    }\n\n    &:hover .header-link {\n      visibility: visible;\n    }\n  }\n}\n","hr {\n    border: none;\n    background: $lightgray;\n    height: 1px;\n}\n",".content {\n  img {\n\n    &.right {\n      clear: both;\n      float: right;\n      margin-left: 20px;\n      margin-bottom: 20px;\n    }\n\n    &.left {\n      clear: both;\n      float: left;\n      margin-right: 20px;\n      margin-bottom: 20px;\n    }\n\n    @media (max-width: 1300px) {\n      max-width: 100%;\n      height: auto;\n      margin: auto;\n    }\n\n    @media (max-width: 600px) {\n      float: none !important;\n      &.right {\n        margin-left: 0;\n      }\n      &.left {\n        margin-right: 0;\n      }\n    }\n  }\n\n  .lightbox {\n    margin: 0;\n    margin-top: 14px;\n    margin-bottom: 14px;\n    border-radius: 1px;\n    background: $white;\n    border: 1px solid $lightgray;\n    padding: 32px;\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, .2);\n    margin: 16px 0;\n    background-color: $lightboxgray;\n    width: 100%;\n    display: flex;\n    justify-content: center;\n\n    img {\n      max-width: 100%;\n      height: auto;\n      padding: 8px;\n      margin: auto;\n      box-shadow: 0 2px 2px rgba(10, 16, 20, 0.24), 0 0 2px rgba(10, 16, 20, 0.12);\n      border-radius: 4px;\n      background-color: $white;\n    }\n  }\n}\n",".api-header label {\n  border-radius: 4px;\n  padding: 2px 10px;\n  display: inline;\n  @include font-size(12);\n  color: $white;\n  margin-right: 8px;\n  font-weight: 500;\n  text-transform: uppercase;\n\n  @media screen and (max-width: 600px) {\n    display: block;\n    margin: 4px 0;\n  }\n\n  &.api-status-label {\n    background-color: $mediumgray;\n\n    &.deprecated, &.security, &.impure-pipe {\n      background-color: $brightred;\n    }\n  }\n\n  &.api-type-label {\n    background-color: $accentblue;\n\n    @each $name, $symbol in $api-symbols {\n      &.#{$name} {\n        background: map-get($symbol, background);\n      }\n    }\n  }\n\n  &.page-label {\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    background-color: $mist;\n    color: $mediumgray;\n    margin-bottom: 8px;\n    width: 140px;\n\n    .material-icons {\n      margin-right: 8px;\n    }\n  }\n\n  &.property-type-label {\n    @include font-size(12);\n    background-color: $darkgray;\n    color: $white;\n    text-transform: none;\n  }\n}\n","$notificationHeight: 56px;\n\n// we need to override some of the toolbar styling\n.app-toolbar mat-toolbar-row.notification-container {\n  padding: 0;\n  height: auto;\n  overflow: hidden;\n}\n\naio-notification {\n  background: $darkgray;\n  display: flex;\n  position: relative;\n  align-items: center;\n  width: 100%;\n  height: $notificationHeight;\n  justify-content: center;\n\n  @media (max-width: 430px) {\n    justify-content: flex-start;\n    padding-left: 10px;\n  }\n\n  .close-button {\n    position: absolute;\n    top: 0;\n    right: 0;\n    width: $notificationHeight;\n    height: $notificationHeight;\n    background: $darkgray;\n  }\n\n  .content {\n    max-width: calc(100% - #{$notificationHeight});\n    background: $darkgray;\n    text-transform: none;\n    padding: 0;\n\n    > * {\n      display: flex;\n    }\n\n    .icon {\n      margin-right: 10px;\n      @media (max-width: 464px) {\n        display: none;\n      }\n    }\n\n    .message {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      margin-right: 10px;\n    }\n\n    .action-button {\n      background: $brightred;\n      border-radius: 15px;\n      text-transform: uppercase;\n      padding: 0 10px;\n      @include font-size(12);\n      @media (max-width: 780px) {\n        display: none;\n      }\n    }\n  }\n}\n\n// Here are all the hacks to make the content and sidebars the right height\n// when the notification is visible\n.aio-notification-show {\n  .toc-container {\n    top: 76px + $notificationHeight;\n  }\n\n  .search-results {\n    padding-top: $notificationHeight;\n  }\n\n  mat-sidenav-container.sidenav-container {\n    .sidenav-content {\n      padding-top: 80px + $notificationHeight;\n    }\n\n    mat-sidenav.sidenav {\n      top: 64px + $notificationHeight;\n\n      @media (max-width: 600px) {\n        top: 56px + $notificationHeight;\n      }\n    }\n  }\n}\n\n@include marketing-pages {\n  &.aio-notification-show {\n    mat-sidenav-container.sidenav-container {\n      .sidenav-content {\n        padding-top: $notificationHeight;\n      }\n    }\n  }\n}\n\n// Animate the content when the notification bar is dismissed\n// this should be kept in sync with the animation durations in\n// - aio/src/app/layout/notification/notification.component.ts\n// - aio/src/app/app.component.ts : notificationDismissed()\n.aio-notification-animating {\n  .sidenav-content {\n    transition: padding-top 250ms ease;\n  }\n\n  mat-sidenav.sidenav, .toc-container {\n    transition: top 250ms ease;\n  }\n}\n",".progress-bar-container {\n  height: 2px;\n  overflow: hidden;\n  position: fixed;\n  top: 0;\n  width: 100vw;\n  z-index: 11;\n}\n",".presskit-container {\n  padding: 0 32px 32px 32px;\n\n  img {\n    height: 128px;\n    width: auto;\n  }\n\n  .presskit-section {\n    &:not(:first-child) {\n      border-top: 1px solid $lightgray;\n      margin-top: 4rem;\n      padding-top: 2rem;\n    }\n\n    .presskit-icon-group {\n      display: flex;\n      flex-wrap: wrap;\n\n      .presskit-icon-item {\n        align-items: center;\n        display: flex;\n        margin: 1rem;\n        width: calc(50% - 2rem);\n\n        @media screen and (max-width: 600px) {\n          align-items: flex-start;\n          flex-direction: column;\n          margin-bottom: 2rem;\n        }\n\n        .presskit-image-container {\n          flex: none;\n          margin-right: 2rem;\n\n          @media (max-width: 600px) {\n            width: 100%;\n            margin-right: 0;\n          }\n\n          .transparent-img {\n            background-color: $deepgray;\n            border-radius: 50%;\n          }\n        }\n\n        .presskit-links-container {\n          list-style-type: none;\n          margin-bottom: 0;\n          padding: 0;\n\n          a {\n            padding-right: 3rem;\n            position: relative;\n\n            &::after {\n              content: \"cloud_download\";\n              font-family: \"Material Icons\";\n              @include font-size(24);\n              position: absolute;\n              right: 0;\n            }\n          }\n        }\n      }\n    }\n  }\n}\n","aio-resource-list {\n  .showcase {\n    transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n    box-shadow: 0 1px 4px 0 rgba($black, 0.37);\n    border-radius: 4px;\n    margin-bottom: 8px * 6;\n  }\n\n  .resource-item {\n    h4 {\n      margin: 0;\n      @include line-height(24);\n    }\n\n    p {\n      margin: 0;\n    }\n  }\n\n  .subcategory-title {\n    padding: 16px 23px;\n    margin: 0;\n    background-color: $mist;\n  }\n\n  .resource-row-link {\n    display: flex;\n    flex-direction: column;\n    border: transparent solid 1px;\n    padding: 16px 23px 16px 23px;\n    transition: all .3s;\n\n    &:hover {\n      text-decoration: none;\n      border-color: rgba($blue, 0.5);\n      border-radius: 4px;\n      box-shadow: 0 8px 8px rgba(1, 67, 163, .24), 0 0 8px rgba(1, 67, 163, .12), 0 6px 18px rgba(43, 133, 231, .12);\n      transform: translateY(-2px);\n    }\n  }\n}\n",".roadmap-done-details {\n  padding: 0 20px 20px;\n  margin: 0 -20px;\n}\n\n.roadmap-done-summary {\n  margin: 0 -20px;\n  font-size: 3.2rem;\n  height: 40px;\n  padding-bottom: 0;\n  display: list-item;\n  user-select: none;\n}\n","aio-search-results {\n  z-index: 10;\n\n  .search-results {\n    display: flex;\n    flex-direction: row;\n    overflow: auto;\n    padding: 0px 32px;\n    border-top: 68px solid transparent;\n    width: auto;\n    max-height: 95vh;\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    z-index: 5;\n    background-color: $darkgray;\n    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3);\n    box-sizing: border-box;\n\n    .search-area {\n      margin: 0 auto;\n      padding: 16px;\n\n      .search-section-header {\n        @include font-size(16);\n        font-weight: 400;\n        margin: 10px 0px 5px;\n        text-transform: uppercase;\n        color: $white;\n      }\n\n      ul {\n        margin: 0;\n        padding: 0;\n\n        li {\n          list-style: none;\n        }\n\n        .search-result-item {\n          @include font-size(14);\n          @include line-height(24);\n          color: $lightgray;\n          display: inline-block;\n          font-weight: normal;\n          padding: 0.6rem 0;\n\n          &a {\n            text-decoration: none;\n          }\n\n          &:hover {\n            color: $white;\n          }\n        }\n\n        &.priority-pages {\n          padding: 0.5rem 0;\n\n          .search-result-item {\n            font-weight: bold;\n          }\n        }\n      }\n    }\n\n    .no-results {\n      color: $white;\n      text-align: center;\n      margin: 16px;\n    }\n\n    a {\n      color: $white;\n      font-weight: 500;\n    }\n\n    @media (max-width: 600px) {\n      display: block;\n    }\n  }\n\n  &.embedded {\n    .search-results {\n      padding: 0;\n      color: inherit;\n      max-height: 100%;\n      position: relative;\n      background-color: inherit;\n      box-shadow: none;\n\n      .search-area {\n        .search-section-header {\n          color: $darkgray;\n        }\n\n        .search-result-item {\n          color: lighten($darkgray, 10);\n\n          &:hover {\n            color: $accentblue;\n          }\n        }\n      }\n\n      .no-results {\n        color: $darkgray;\n      }\n\n      a {\n        color: $blue;\n      }\n    }\n  }\n}\n","/* SELECT MENU */\n\naio-select {\n  .form-select-menu {\n    position: relative;\n  }\n\n  .form-select-button {\n    background: $white;\n    box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12);\n    box-sizing: border-box;\n    border: 1px solid $white;\n    border-radius: 4px;\n    color: $blue-grey-600;\n    @include font-size(14);\n    font-weight: 400;\n    @include line-height(32);\n    outline: none;\n    padding: 4px 16px;\n    text-align: left;\n    width: 100%;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    flex-direction: row;\n\n    strong {\n      font-weight: 600;\n      margin-right: 8px;\n      text-transform: capitalize;\n    }\n\n    &:focus {\n      border: 1px solid $blue-400;\n      box-shadow: 0 2px 2px rgba($blue-400, 0.24), 0 0 2px rgba($blue-400, 0.12);\n    }\n\n    &[disabled] {\n      color: lightgrey;\n      cursor: not-allowed;\n    }\n  }\n\n  .form-select-dropdown {\n    background: $white;\n    box-shadow: 0 16px 16px rgba($black, 0.24), 0 0 16px rgba($black, 0.12);\n    border-radius: 4px;\n    list-style-type: none;\n    margin: 0;\n    padding: 0;\n    position: absolute;\n    top: 0;\n    width: 100%;\n    z-index: $layer-2;\n\n    li {\n      cursor: pointer;\n      @include font-size(14);\n      @include line-height(32);\n      margin: 0;\n      padding: 4px 16px 4px 40px;\n      position: relative;\n      transition: all .2s;\n      border: 1px solid transparent;\n\n      &:first-child {\n        border-radius: 4px 4px 0 0;\n      }\n\n      &:last-child {\n        border-radius: 0 0 4px 4px;\n      }\n\n      &:hover {\n        background: $blue-grey-50;\n        color: $blue-500;\n      }\n\n      &.selected {\n        background-color: $blue-grey-100;\n      }\n\n      .symbol {\n        left: 16px;\n        position: absolute;\n        top: 12px;\n        z-index: $layer-5;\n      }\n    }\n  }\n}\n","table {\n  margin: 24px 0px;\n  box-shadow: 0 2px 2px rgba($black, 0.24), 0 0 2px rgba($black, 0.12);\n  border-radius: 2px;\n  background: $white;\n\n  &.is-full-width {\n    width: 100%;\n  }\n\n  &.is-fixed-layout {\n    table-layout: fixed;\n  }\n\n  thead > {\n    vertical-align: middle;\n    border-color: inherit;\n\n    tr {\n      vertical-align: inherit;\n      border-color: inherit;\n    }\n\n    tr > th {\n      background: rgba($lightgray, 0.2);\n      border-bottom: 1px solid $lightgray;\n      color: $darkgray;\n      @include font-size(12);\n      font-weight: 500;\n      padding: 8px 24px;\n      text-align: left;\n      text-transform: uppercase;\n      @include line-height(28);\n    }\n  }\n\n  tbody > tr > {\n    th,\n    td {\n      border-bottom: 1px solid $lightgray;\n      padding: 16px;\n      text-align: left;\n      @include line-height(24);\n      vertical-align: top;\n\n      @media (max-width: 480px) {\n        &:before {\n          // content: **ADD TABLE HEADER**;\n          display: inline-block;\n        }\n      }\n\n    }\n\n    td {\n      @include letter-spacing(0.3);\n\n      tr td:first-child {\n        @media (max-width: 480px) {\n          background-color: $lightgray;\n        }\n      }\n    }\n\n    th {\n      background: rgba($lightgray, 0.2);\n      border-right: 1px solid $lightgray;\n      font-weight: 600;\n      max-width: 100px;\n    }\n  }\n\n  tbody > tr {\n    &:last-child td {\n      border: none;\n\n      @media (max-width: 480px) {\n        border-bottom: 1px solid $lightgray;\n      }\n    }\n  }\n}\n\n.page-guide-cheatsheet {\n\n  table tbody td {\n    overflow: auto;\n  }\n\n  @media only screen and (max-width: 990px) {\n\n    /* Force table to not be like tables anymore */\n    table, thead, tbody, tfoot, tr, th, td {\n      display: block;\n      position: relative;\n      max-width: 100%;\n    }\n\n    th {\n      border-right: none;\n    }\n\n    th, td {\n      &:not(:last-child) {\n        border-bottom: none;\n        padding-bottom: 0px;\n      }\n    }\n  }\n}\n\n.page-events {\n  tr > td, tr > th {\n    width: 33%;\n  }\n}\n","$tocItemLineHeight: 24;\n$tocItemTopPadding: 9;\n$tocMarkerRailSize: 1;\n$tocMarkerSize: 6;\n\n@mixin tocMarker($color) {\n  background: $color;\n  border-radius: 50%;\n  content: '';\n  height: #{$tocMarkerSize}px;\n  left: -#{($tocMarkerSize - $tocMarkerRailSize) / 2}px;\n  position: absolute;\n  top: calc(#{$tocItemTopPadding}px + #{$tocItemLineHeight / 2}px - #{$tocMarkerSize / 2}px);\n  top: calc(#{$tocItemTopPadding}px + #{$tocItemLineHeight / 2 / 10}rem - #{$tocMarkerSize / 2}px);\n  width: #{$tocMarkerSize}px;\n}\n\n.toc-container {\n  width: 18%;\n  position: fixed;\n  top: 76px;\n  right: 0;\n  bottom: 12px;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n\naio-toc {\n  .toc-inner {\n    @include font-size(13);\n    overflow-y: visible;\n    padding: 4px 0 0 10px;\n\n    .toc-heading,\n    .toc-list .h1 {\n      @include font-size(16);\n    }\n\n    .toc-heading {\n      font-weight: 500;\n      margin: 0 0 16px 8px;\n      padding: 0;\n\n      &.secondary {\n        position: relative;\n        top: -8px;\n\n        &:hover {\n          color: $accentblue;\n        }\n      }\n    }\n\n    button {\n      &.toc-heading,\n      &.toc-more-items {\n        cursor: pointer;\n        display: inline-block;\n        background: 0;\n        background-color: transparent;\n        border: none;\n        box-shadow: none;\n        padding: 0;\n        text-align: start;\n\n        &.embedded:focus {\n          outline: none;\n          background: $lightgray;\n        }\n      }\n\n      &.toc-heading {\n        mat-icon.rotating-icon {\n          height: 18px;\n          width: 18px;\n          position: relative;\n          left: -4px;\n          top: 5px;\n        }\n\n        &:hover:not(.embedded) {\n          color: $accentblue;\n        }\n      }\n\n      &.toc-more-items {\n        color: $mediumgray;\n        top: 10px;\n        position: relative;\n\n        &:hover {\n          color: $accentblue;\n        }\n\n        &::after {\n          content: 'expand_less';\n        }\n\n        &.collapsed::after {\n          content: 'more_horiz';\n        }\n      }\n    }\n\n    .mat-icon {\n      &.collapsed {\n        @include rotate(0deg);\n      }\n\n      &:not(.collapsed) {\n        @include rotate(90deg);\n      }\n    }\n\n    ul.toc-list {\n      list-style-type: none;\n      margin: 0;\n      padding: 0 8px 0 0;\n\n      @media (max-width: 800px) {\n        width: auto;\n      }\n\n      li {\n        box-sizing: border-box;\n        @include line-height($tocItemLineHeight);\n        padding: #{$tocItemTopPadding}px 0 #{$tocItemTopPadding}px 12px;\n        position: relative;\n        transition: all 0.3s ease-in-out;\n\n        &.h1:after {\n          content: '';\n          display: block;\n          height: 1px;\n          width: 40%;\n          margin: 7px 0 4px 0;\n          background: $lightgray;\n          clear: both;\n        }\n\n        &.h3 {\n          padding-left: 24px;\n        }\n\n        a {\n          color: lighten($darkgray, 10);\n          overflow: visible;\n          @include font-size(14);\n          line-height: inherit;\n          display: table-cell;\n        }\n\n        &:hover {\n          * {\n            color: $accentblue;\n          }\n        }\n\n        &.active {\n          * {\n            color: $blue;\n            font-weight: 500;\n          }\n\n          a:before {\n            @include tocMarker($blue);\n          }\n        }\n      }\n\n      &:not(.embedded) li {\n        &:before {\n          border-left: #{$tocMarkerRailSize}px solid $lightgray;\n          bottom: 0;\n          content: '';\n          left: 0;\n          position: absolute;\n          top: 0;\n        }\n\n        &:first-child:before {\n          top: calc(#{$tocItemTopPadding}px + #{$tocItemLineHeight / 2}px - #{$tocMarkerSize / 2}px);\n          top: calc(#{$tocItemTopPadding}px + #{$tocItemLineHeight / 2 / 10}rem - #{$tocMarkerSize / 2}px);\n        }\n\n        &:last-child:before {\n          bottom: calc(100% - (#{$tocItemTopPadding}px + #{$tocItemLineHeight / 2}px + #{$tocMarkerSize / 2}px));\n          bottom: calc(100% - (#{$tocItemTopPadding}px + #{$tocItemLineHeight / 2 / 10}rem + #{$tocMarkerSize / 2}px));\n        }\n\n        &:not(.active):hover {\n          a:before {\n            @include tocMarker($lightgray);\n          }\n        }\n      }\n    }\n  }\n\n  // Alternative TOC View for Smaller Screens\n  &.embedded {\n    @media (min-width: 801px) {\n      display: none;\n    }\n\n    .toc-inner {\n      padding: 12px 0 0 0;\n\n      .toc-heading {\n        margin: 0 0 8px;\n      }\n\n      &.collapsed {\n        .secondary {\n          display: none;\n        }\n      }\n    }\n  }\n}\n",".debug {\n  [translation-result], code-tabs, code-example, img, code, pre, .filetree {\n    display: none;\n  }\n}\n\n[translation-result] + [translation-origin=off] {\n  display: none;\n}\n\n[translation-result] + aio-toc + [translation-origin=off] {\n  display: none;\n}\n\n[translation-origin=on] {\n  border-top: 1px dashed #0273D4;\n}\n\n[id^=translations-cn] {\n  aio-doc-viewer {\n    blockquote {\n      color: #455A64;\n      margin: 0 0 32px 0;\n      padding: 16px 32px;\n      background: rgba(236, 239, 241, 0.24);\n      border-left: 4px solid #00BCD4;\n    }\n  }\n}\n\nem {\n  font-style: normal;\n  font-weight: bold;\n}\n","@media print {\n\n    // General Adjustments\n    * {\n        box-shadow: none !important;\n    }\n\n    body, mat-sidenav-container {\n        background: none !important;\n    }\n\n    h1 {\n        height: 40px !important;\n        color: $darkgray !important;\n    }\n\n    h1, h2, h3, h4, h5, h6 {\n        page-break-after: avoid;\n    }\n\n    ul, ol, img, code-example, table, tr, .alert, .feature, .lightbox {\n        page-break-inside: avoid;\n    }\n\n    table tbody tr:last-child td {\n        border-bottom: 1px solid $lightgray !important;\n    }\n\n    img {\n        max-width: 100% !important;\n    }\n\n    p {\n        widows: 4;\n    }\n\n    p > code, li > code, table code {\n        color: $blue !important;\n    }\n\n    // No Print Class\n    .no-print {\n        display: none !important;\n    }\n\n    // Custom No Print for Sidenav Menu\n    mat-sidenav.sidenav.mat-sidenav {\n        display: none !important;\n    }\n\n    // Custom No Print Element Adjustments\n    .mat-sidenav-content {\n        margin: 0 !important;\n    }\n\n    mat-sidenav-container.sidenav-container {\n        min-width: 100vw;\n    }\n\n    .sidenav-content {\n        overflow: visible;\n    }\n\n    .filetree {\n        max-width: 100%;\n    }\n\n    aio-code code {\n        border: none !important;\n    }\n\n    code-example {\n        &[language=sh], &[language=bash] {\n            background: none;\n\n            .pnk, .blk, .pln, .otl, .kwd, .typ, .tag, .str, .atv, .atn, .com, .lit, .pun, .dec {\n                color: $darkgray;\n            }\n        }\n\n        header {\n            background: none;\n            border: 0.5px solid $lightgray;\n            color: $darkgray;\n        }\n    }\n\n    .content code {\n        border: 0.5px solid $lightgray;\n    }\n\n    .mat-tab-labels {\n        div.mat-tab-label {\n            &:not(.mat-tab-label-active) span {\n                font-style: italic;\n            }\n\n            &.mat-tab-label-active span {\n                font-weight: bold;\n            }\n        }\n    }\n\n    .api-header label {\n        color: $darkgray !important;\n        font-weight: bold !important;\n        margin: 2px !important;\n        padding: 0 !important;\n        display: block !important;\n    }\n\n    .feature-section img {\n        max-width: 70px !important;\n    }\n}\n"],"sourceRoot":"webpack:///"}