SHARE
TWEET

Untitled

a guest Oct 20th, 2019 65 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @import url(https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i);
  2.  
  3. @import url(https://fonts.googleapis.com/icon?family=Material+Icons);
  4.  
  5. @-webkit-keyframes cdk-text-field-autofill-start {
  6.   /*!*/
  7. }
  8.  
  9. @-webkit-keyframes cdk-text-field-autofill-end {
  10.   /*!*/
  11. }
  12.  
  13. .mat-ripple-element {
  14.   background-color: rgba(0, 0, 0, 0.1);
  15. }
  16.  
  17. .mat-option {
  18.   color: rgba(0, 0, 0, 0.87);
  19.  
  20.   &.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled), &:focus:not(.mat-option-disabled), &:hover:not(.mat-option-disabled) {
  21.     background: rgba(0, 0, 0, 0.04);
  22.   }
  23.  
  24.   &.mat-active {
  25.     background: rgba(0, 0, 0, 0.04);
  26.     color: rgba(0, 0, 0, 0.87);
  27.   }
  28.  
  29.   &.mat-option-disabled {
  30.     color: rgba(0, 0, 0, 0.38);
  31.   }
  32. }
  33.  
  34. .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
  35.   color: #3f51b5;
  36. }
  37.  
  38. .mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {
  39.   color: #ff4081;
  40. }
  41.  
  42. .mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {
  43.   color: #f44336;
  44. }
  45.  
  46. .mat-optgroup-label {
  47.   color: rgba(0, 0, 0, 0.54);
  48. }
  49.  
  50. .mat-optgroup-disabled .mat-optgroup-label {
  51.   color: rgba(0, 0, 0, 0.38);
  52. }
  53.  
  54. .mat-pseudo-checkbox {
  55.   color: rgba(0, 0, 0, 0.54);
  56.  
  57.   &::after {
  58.     color: #fafafa;
  59.   }
  60. }
  61.  
  62. .mat-pseudo-checkbox-disabled {
  63.   color: #b0b0b0;
  64. }
  65.  
  66. .mat-accent {
  67.   .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  68.     background: #ff4081;
  69.   }
  70. }
  71.  
  72. .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  73.   background: #ff4081;
  74. }
  75.  
  76. .mat-primary {
  77.   .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  78.     background: #3f51b5;
  79.   }
  80. }
  81.  
  82. .mat-warn {
  83.   .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  84.     background: #f44336;
  85.   }
  86. }
  87.  
  88. .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {
  89.   background: #b0b0b0;
  90. }
  91.  
  92. .mat-elevation-z0 {
  93.   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  94. }
  95.  
  96. .mat-elevation-z1 {
  97.   box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  98. }
  99.  
  100. .mat-elevation-z2 {
  101.   box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  102. }
  103.  
  104. .mat-elevation-z3 {
  105.   box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  106. }
  107.  
  108. .mat-elevation-z4 {
  109.   box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  110. }
  111.  
  112. .mat-elevation-z5 {
  113.   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14), 0 1px 14px 0 rgba(0, 0, 0, 0.12);
  114. }
  115.  
  116. .mat-elevation-z6 {
  117.   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
  118. }
  119.  
  120. .mat-elevation-z7 {
  121.   box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14), 0 2px 16px 1px rgba(0, 0, 0, 0.12);
  122. }
  123.  
  124. .mat-elevation-z8 {
  125.   box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
  126. }
  127.  
  128. .mat-elevation-z9 {
  129.   box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12);
  130. }
  131.  
  132. .mat-elevation-z10 {
  133.   box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14), 0 4px 18px 3px rgba(0, 0, 0, 0.12);
  134. }
  135.  
  136. .mat-elevation-z11 {
  137.   box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14), 0 4px 20px 3px rgba(0, 0, 0, 0.12);
  138. }
  139.  
  140. .mat-elevation-z12 {
  141.   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12);
  142. }
  143.  
  144. .mat-elevation-z13 {
  145.   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
  146. }
  147.  
  148. .mat-elevation-z14 {
  149.   box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14), 0 5px 26px 4px rgba(0, 0, 0, 0.12);
  150. }
  151.  
  152. .mat-elevation-z15 {
  153.   box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14), 0 6px 28px 5px rgba(0, 0, 0, 0.12);
  154. }
  155.  
  156. .mat-elevation-z16 {
  157.   box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  158. }
  159.  
  160. .mat-elevation-z17 {
  161.   box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14), 0 6px 32px 5px rgba(0, 0, 0, 0.12);
  162. }
  163.  
  164. .mat-elevation-z18 {
  165.   box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14), 0 7px 34px 6px rgba(0, 0, 0, 0.12);
  166. }
  167.  
  168. .mat-elevation-z19 {
  169.   box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14), 0 7px 36px 6px rgba(0, 0, 0, 0.12);
  170. }
  171.  
  172. .mat-elevation-z20 {
  173.   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14), 0 8px 38px 7px rgba(0, 0, 0, 0.12);
  174. }
  175.  
  176. .mat-elevation-z21 {
  177.   box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14), 0 8px 40px 7px rgba(0, 0, 0, 0.12);
  178. }
  179.  
  180. .mat-elevation-z22 {
  181.   box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14), 0 8px 42px 7px rgba(0, 0, 0, 0.12);
  182. }
  183.  
  184. .mat-elevation-z23 {
  185.   box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14), 0 9px 44px 8px rgba(0, 0, 0, 0.12);
  186. }
  187.  
  188. .mat-elevation-z24 {
  189.   box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
  190. }
  191.  
  192. .mat-app-background {
  193.   background-color: #fafafa;
  194.   color: rgba(0, 0, 0, 0.87);
  195. }
  196.  
  197. .mat-autocomplete-panel {
  198.   background: #fff;
  199.   color: rgba(0, 0, 0, 0.87);
  200.  
  201.   &:not([class*=mat-elevation-z]) {
  202.     box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  203.   }
  204.  
  205.   .mat-option.mat-selected:not(.mat-active):not(:hover) {
  206.     background: #fff;
  207.  
  208.     &:not(.mat-option-disabled) {
  209.       color: rgba(0, 0, 0, 0.87);
  210.     }
  211.   }
  212. }
  213.  
  214. @media (-ms-high-contrast: active) {
  215.   .mat-badge-content {
  216.     outline: solid 1px;
  217.     border-radius: 0;
  218.   }
  219.  
  220.   .mat-checkbox-disabled {
  221.     opacity: .5;
  222.   }
  223. }
  224.  
  225. .mat-badge-accent .mat-badge-content {
  226.   background: #ff4081;
  227.   color: #fff;
  228. }
  229.  
  230. .mat-badge-warn .mat-badge-content {
  231.   color: #fff;
  232.   background: #f44336;
  233. }
  234.  
  235. .mat-badge {
  236.   position: relative;
  237. }
  238.  
  239. .mat-badge-hidden .mat-badge-content {
  240.   display: none;
  241. }
  242.  
  243. .mat-badge-disabled .mat-badge-content {
  244.   background: #b9b9b9;
  245.   color: rgba(0, 0, 0, 0.38);
  246. }
  247.  
  248. .mat-badge-content {
  249.   color: #fff;
  250.   background: #3f51b5;
  251.   position: absolute;
  252.   text-align: center;
  253.   display: inline-block;
  254.   border-radius: 50%;
  255.   transition: transform .2s ease-in-out;
  256.   transform: scale(0.6);
  257.   overflow: hidden;
  258.   white-space: nowrap;
  259.   text-overflow: ellipsis;
  260.   pointer-events: none;
  261.  
  262.   &._mat-animation-noopable {
  263.     transition: none;
  264.   }
  265. }
  266.  
  267. .ng-animate-disabled .mat-badge-content {
  268.   transition: none;
  269. }
  270.  
  271. .mat-badge-content.mat-badge-active {
  272.   transform: none;
  273. }
  274.  
  275. .mat-badge-small {
  276.   .mat-badge-content {
  277.     width: 16px;
  278.     height: 16px;
  279.     line-height: 16px;
  280.   }
  281.  
  282.   &.mat-badge-above .mat-badge-content {
  283.     top: -8px;
  284.   }
  285.  
  286.   &.mat-badge-below .mat-badge-content {
  287.     bottom: -8px;
  288.   }
  289.  
  290.   &.mat-badge-before .mat-badge-content {
  291.     left: -16px;
  292.   }
  293. }
  294.  
  295. [dir=rtl] .mat-badge-small.mat-badge-before .mat-badge-content {
  296.   left: auto;
  297.   right: -16px;
  298. }
  299.  
  300. .mat-badge-small.mat-badge-after .mat-badge-content {
  301.   right: -16px;
  302. }
  303.  
  304. [dir=rtl] .mat-badge-small.mat-badge-after .mat-badge-content {
  305.   right: auto;
  306.   left: -16px;
  307. }
  308.  
  309. .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {
  310.   left: -8px;
  311. }
  312.  
  313. [dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {
  314.   left: auto;
  315.   right: -8px;
  316. }
  317.  
  318. .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
  319.   right: -8px;
  320. }
  321.  
  322. [dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
  323.   right: auto;
  324.   left: -8px;
  325. }
  326.  
  327. .mat-badge-medium {
  328.   .mat-badge-content {
  329.     width: 22px;
  330.     height: 22px;
  331.     line-height: 22px;
  332.   }
  333.  
  334.   &.mat-badge-above .mat-badge-content {
  335.     top: -11px;
  336.   }
  337.  
  338.   &.mat-badge-below .mat-badge-content {
  339.     bottom: -11px;
  340.   }
  341.  
  342.   &.mat-badge-before .mat-badge-content {
  343.     left: -22px;
  344.   }
  345. }
  346.  
  347. [dir=rtl] .mat-badge-medium.mat-badge-before .mat-badge-content {
  348.   left: auto;
  349.   right: -22px;
  350. }
  351.  
  352. .mat-badge-medium.mat-badge-after .mat-badge-content {
  353.   right: -22px;
  354. }
  355.  
  356. [dir=rtl] .mat-badge-medium.mat-badge-after .mat-badge-content {
  357.   right: auto;
  358.   left: -22px;
  359. }
  360.  
  361. .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {
  362.   left: -11px;
  363. }
  364.  
  365. [dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {
  366.   left: auto;
  367.   right: -11px;
  368. }
  369.  
  370. .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {
  371.   right: -11px;
  372. }
  373.  
  374. [dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {
  375.   right: auto;
  376.   left: -11px;
  377. }
  378.  
  379. .mat-badge-large {
  380.   .mat-badge-content {
  381.     width: 28px;
  382.     height: 28px;
  383.     line-height: 28px;
  384.   }
  385.  
  386.   &.mat-badge-above .mat-badge-content {
  387.     top: -14px;
  388.   }
  389.  
  390.   &.mat-badge-below .mat-badge-content {
  391.     bottom: -14px;
  392.   }
  393.  
  394.   &.mat-badge-before .mat-badge-content {
  395.     left: -28px;
  396.   }
  397. }
  398.  
  399. [dir=rtl] .mat-badge-large.mat-badge-before .mat-badge-content {
  400.   left: auto;
  401.   right: -28px;
  402. }
  403.  
  404. .mat-badge-large.mat-badge-after .mat-badge-content {
  405.   right: -28px;
  406. }
  407.  
  408. [dir=rtl] .mat-badge-large.mat-badge-after .mat-badge-content {
  409.   right: auto;
  410.   left: -28px;
  411. }
  412.  
  413. .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {
  414.   left: -14px;
  415. }
  416.  
  417. [dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {
  418.   left: auto;
  419.   right: -14px;
  420. }
  421.  
  422. .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {
  423.   right: -14px;
  424. }
  425.  
  426. [dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {
  427.   right: auto;
  428.   left: -14px;
  429. }
  430.  
  431. .mat-bottom-sheet-container {
  432.   box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  433.   background: #fff;
  434.   color: rgba(0, 0, 0, 0.87);
  435. }
  436.  
  437. .mat-button, .mat-icon-button, .mat-stroked-button {
  438.   color: inherit;
  439.   background: 0 0;
  440. }
  441.  
  442. .mat-button.mat-primary, .mat-icon-button.mat-primary, .mat-stroked-button.mat-primary {
  443.   color: #3f51b5;
  444. }
  445.  
  446. .mat-button.mat-accent, .mat-icon-button.mat-accent, .mat-stroked-button.mat-accent {
  447.   color: #ff4081;
  448. }
  449.  
  450. .mat-button.mat-warn, .mat-icon-button.mat-warn, .mat-stroked-button.mat-warn {
  451.   color: #f44336;
  452. }
  453.  
  454. .mat-button {
  455.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  456.     color: rgba(0, 0, 0, 0.26);
  457.   }
  458. }
  459.  
  460. .mat-icon-button {
  461.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  462.     color: rgba(0, 0, 0, 0.26);
  463.   }
  464. }
  465.  
  466. .mat-stroked-button {
  467.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  468.     color: rgba(0, 0, 0, 0.26);
  469.   }
  470. }
  471.  
  472. .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 {
  473.   background-color: #3f51b5;
  474. }
  475.  
  476. .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 {
  477.   background-color: #ff4081;
  478. }
  479.  
  480. .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 {
  481.   background-color: #f44336;
  482. }
  483.  
  484. .mat-button[disabled] .mat-button-focus-overlay, .mat-icon-button[disabled] .mat-button-focus-overlay, .mat-stroked-button[disabled] .mat-button-focus-overlay {
  485.   background-color: transparent;
  486. }
  487.  
  488. .mat-button .mat-ripple-element, .mat-icon-button .mat-ripple-element, .mat-stroked-button .mat-ripple-element {
  489.   opacity: .1;
  490.   background-color: currentColor;
  491. }
  492.  
  493. .mat-button-focus-overlay {
  494.   background: #000;
  495. }
  496.  
  497. .mat-stroked-button:not([disabled]) {
  498.   border-color: rgba(0, 0, 0, 0.12);
  499. }
  500.  
  501. .mat-fab, .mat-flat-button, .mat-mini-fab, .mat-raised-button {
  502.   color: rgba(0, 0, 0, 0.87);
  503.   background-color: #fff;
  504. }
  505.  
  506. .mat-fab {
  507.   &.mat-accent, &.mat-primary, &.mat-warn {
  508.     color: #fff;
  509.   }
  510. }
  511.  
  512. .mat-flat-button {
  513.   &.mat-accent, &.mat-primary, &.mat-warn {
  514.     color: #fff;
  515.   }
  516. }
  517.  
  518. .mat-mini-fab {
  519.   &.mat-accent, &.mat-primary, &.mat-warn {
  520.     color: #fff;
  521.   }
  522. }
  523.  
  524. .mat-raised-button {
  525.   &.mat-accent, &.mat-primary, &.mat-warn {
  526.     color: #fff;
  527.   }
  528. }
  529.  
  530. .mat-fab {
  531.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  532.     color: rgba(0, 0, 0, 0.26);
  533.     background-color: rgba(0, 0, 0, 0.12);
  534.   }
  535. }
  536.  
  537. .mat-flat-button {
  538.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  539.     color: rgba(0, 0, 0, 0.26);
  540.     background-color: rgba(0, 0, 0, 0.12);
  541.   }
  542. }
  543.  
  544. .mat-mini-fab {
  545.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  546.     color: rgba(0, 0, 0, 0.26);
  547.     background-color: rgba(0, 0, 0, 0.12);
  548.   }
  549. }
  550.  
  551. .mat-raised-button {
  552.   &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  553.     color: rgba(0, 0, 0, 0.26);
  554.     background-color: rgba(0, 0, 0, 0.12);
  555.   }
  556. }
  557.  
  558. .mat-fab.mat-primary, .mat-flat-button.mat-primary, .mat-mini-fab.mat-primary, .mat-raised-button.mat-primary {
  559.   background-color: #3f51b5;
  560. }
  561.  
  562. .mat-fab.mat-accent, .mat-flat-button.mat-accent, .mat-mini-fab.mat-accent, .mat-raised-button.mat-accent {
  563.   background-color: #ff4081;
  564. }
  565.  
  566. .mat-fab.mat-warn, .mat-flat-button.mat-warn, .mat-mini-fab.mat-warn, .mat-raised-button.mat-warn {
  567.   background-color: #f44336;
  568. }
  569.  
  570. .mat-fab {
  571.   &.mat-accent .mat-ripple-element, &.mat-primary .mat-ripple-element, &.mat-warn .mat-ripple-element {
  572.     background-color: rgba(255, 255, 255, 0.1);
  573.   }
  574. }
  575.  
  576. .mat-flat-button {
  577.   &.mat-accent .mat-ripple-element, &.mat-primary .mat-ripple-element, &.mat-warn .mat-ripple-element {
  578.     background-color: rgba(255, 255, 255, 0.1);
  579.   }
  580. }
  581.  
  582. .mat-mini-fab {
  583.   &.mat-accent .mat-ripple-element, &.mat-primary .mat-ripple-element, &.mat-warn .mat-ripple-element {
  584.     background-color: rgba(255, 255, 255, 0.1);
  585.   }
  586. }
  587.  
  588. .mat-raised-button {
  589.   &.mat-accent .mat-ripple-element, &.mat-primary .mat-ripple-element, &.mat-warn .mat-ripple-element {
  590.     background-color: rgba(255, 255, 255, 0.1);
  591.   }
  592. }
  593.  
  594. .mat-flat-button:not([class*=mat-elevation-z]), .mat-stroked-button:not([class*=mat-elevation-z]) {
  595.   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  596. }
  597.  
  598. .mat-raised-button {
  599.   &:not([class*=mat-elevation-z]) {
  600.     box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  601.   }
  602.  
  603.   &:not([disabled]):active:not([class*=mat-elevation-z]) {
  604.     box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
  605.   }
  606.  
  607.   &[disabled]:not([class*=mat-elevation-z]) {
  608.     box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  609.   }
  610. }
  611.  
  612. .mat-fab:not([class*=mat-elevation-z]), .mat-mini-fab:not([class*=mat-elevation-z]) {
  613.   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
  614. }
  615.  
  616. .mat-fab:not([disabled]):active:not([class*=mat-elevation-z]), .mat-mini-fab:not([disabled]):active:not([class*=mat-elevation-z]) {
  617.   box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12);
  618. }
  619.  
  620. .mat-fab[disabled]:not([class*=mat-elevation-z]), .mat-mini-fab[disabled]:not([class*=mat-elevation-z]) {
  621.   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  622. }
  623.  
  624. .mat-button-toggle-group, .mat-button-toggle-standalone {
  625.   box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  626. }
  627.  
  628. .mat-button-toggle-group-appearance-standard, .mat-button-toggle-standalone.mat-button-toggle-appearance-standard {
  629.   box-shadow: none;
  630.   border: 1px solid rgba(0, 0, 0, 0.12);
  631. }
  632.  
  633. .mat-button-toggle {
  634.   color: rgba(0, 0, 0, 0.38);
  635.  
  636.   .mat-button-toggle-focus-overlay {
  637.     background-color: rgba(0, 0, 0, 0.12);
  638.   }
  639. }
  640.  
  641. .mat-button-toggle-appearance-standard {
  642.   color: rgba(0, 0, 0, 0.87);
  643.   background: #fff;
  644.  
  645.   .mat-button-toggle-focus-overlay {
  646.     background-color: #000;
  647.   }
  648. }
  649.  
  650. .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {
  651.   border-left: 1px solid rgba(0, 0, 0, 0.12);
  652. }
  653.  
  654. [dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {
  655.   border-left: none;
  656.   border-right: 1px solid rgba(0, 0, 0, 0.12);
  657. }
  658.  
  659. .mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle + .mat-button-toggle {
  660.   border-left: none;
  661.   border-right: none;
  662.   border-top: 1px solid rgba(0, 0, 0, 0.12);
  663. }
  664.  
  665. .mat-button-toggle-checked {
  666.   background-color: #e0e0e0;
  667.   color: rgba(0, 0, 0, 0.54);
  668.  
  669.   &.mat-button-toggle-appearance-standard {
  670.     color: rgba(0, 0, 0, 0.87);
  671.   }
  672. }
  673.  
  674. .mat-button-toggle-disabled {
  675.   color: rgba(0, 0, 0, 0.26);
  676.   background-color: #eee;
  677.  
  678.   &.mat-button-toggle-appearance-standard {
  679.     background: #fff;
  680.   }
  681.  
  682.   &.mat-button-toggle-checked {
  683.     background-color: #bdbdbd;
  684.   }
  685. }
  686.  
  687. .mat-card {
  688.   background: #fff;
  689.   color: rgba(0, 0, 0, 0.87);
  690.  
  691.   &:not([class*=mat-elevation-z]) {
  692.     box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  693.   }
  694.  
  695.   &.mat-card-flat:not([class*=mat-elevation-z]) {
  696.     box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  697.   }
  698. }
  699.  
  700. .mat-card-subtitle {
  701.   color: rgba(0, 0, 0, 0.54);
  702. }
  703.  
  704. .mat-checkbox-frame {
  705.   border-color: rgba(0, 0, 0, 0.54);
  706. }
  707.  
  708. .mat-checkbox-checkmark {
  709.   fill: #fafafa;
  710. }
  711.  
  712. .mat-checkbox-checkmark-path {
  713.   stroke: #fafafa !important;
  714. }
  715.  
  716. .mat-checkbox-mixedmark {
  717.   background-color: #fafafa;
  718. }
  719.  
  720. .mat-checkbox-checked.mat-primary .mat-checkbox-background, .mat-checkbox-indeterminate.mat-primary .mat-checkbox-background {
  721.   background-color: #3f51b5;
  722. }
  723.  
  724. .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
  725.   background-color: #ff4081;
  726. }
  727.  
  728. .mat-checkbox-checked.mat-warn .mat-checkbox-background, .mat-checkbox-indeterminate.mat-warn .mat-checkbox-background {
  729.   background-color: #f44336;
  730. }
  731.  
  732. .mat-checkbox-disabled {
  733.   &.mat-checkbox-checked .mat-checkbox-background, &.mat-checkbox-indeterminate .mat-checkbox-background {
  734.     background-color: #b0b0b0;
  735.   }
  736.  
  737.   &:not(.mat-checkbox-checked) .mat-checkbox-frame {
  738.     border-color: #b0b0b0;
  739.   }
  740.  
  741.   .mat-checkbox-label {
  742.     color: rgba(0, 0, 0, 0.54);
  743.   }
  744. }
  745.  
  746. @media (-ms-high-contrast: active) {
  747.   .mat-checkbox-background {
  748.     background: 0 0;
  749.   }
  750. }
  751.  
  752. .mat-checkbox .mat-ripple-element {
  753.   background-color: #000;
  754. }
  755.  
  756. .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element {
  757.   background: #3f51b5;
  758. }
  759.  
  760. .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {
  761.   background: #ff4081;
  762. }
  763.  
  764. .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element {
  765.   background: #f44336;
  766. }
  767.  
  768. .mat-chip.mat-standard-chip {
  769.   background-color: #e0e0e0;
  770.   color: rgba(0, 0, 0, 0.87);
  771.  
  772.   .mat-chip-remove {
  773.     color: rgba(0, 0, 0, 0.87);
  774.     opacity: .4;
  775.   }
  776.  
  777.   &:not(.mat-chip-disabled) {
  778.     &:active {
  779.       box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  780.     }
  781.  
  782.     .mat-chip-remove:hover {
  783.       opacity: .54;
  784.     }
  785.   }
  786.  
  787.   &.mat-chip-disabled {
  788.     opacity: .4;
  789.   }
  790.  
  791.   &::after {
  792.     background: #000;
  793.   }
  794.  
  795.   &.mat-chip-selected {
  796.     &.mat-primary {
  797.       background-color: #3f51b5;
  798.       color: #fff;
  799.  
  800.       .mat-chip-remove {
  801.         color: #fff;
  802.         opacity: .4;
  803.       }
  804.  
  805.       .mat-ripple-element {
  806.         background: rgba(255, 255, 255, 0.1);
  807.       }
  808.     }
  809.  
  810.     &.mat-warn {
  811.       background-color: #f44336;
  812.       color: #fff;
  813.  
  814.       .mat-chip-remove {
  815.         color: #fff;
  816.         opacity: .4;
  817.       }
  818.  
  819.       .mat-ripple-element {
  820.         background: rgba(255, 255, 255, 0.1);
  821.       }
  822.     }
  823.  
  824.     &.mat-accent {
  825.       background-color: #ff4081;
  826.       color: #fff;
  827.  
  828.       .mat-chip-remove {
  829.         color: #fff;
  830.         opacity: .4;
  831.       }
  832.  
  833.       .mat-ripple-element {
  834.         background: rgba(255, 255, 255, 0.1);
  835.       }
  836.     }
  837.   }
  838. }
  839.  
  840. .mat-table {
  841.   background: #fff;
  842.  
  843.   tbody, tfoot, thead {
  844.     background: inherit;
  845.   }
  846. }
  847.  
  848. .mat-table-sticky, [mat-footer-row], [mat-header-row], [mat-row], mat-footer-row, mat-header-row, mat-row {
  849.   background: inherit;
  850. }
  851.  
  852. mat-footer-row, mat-header-row, mat-row {
  853.   border-bottom-color: rgba(0, 0, 0, 0.12);
  854. }
  855.  
  856. td {
  857.   &.mat-cell, &.mat-footer-cell {
  858.     border-bottom-color: rgba(0, 0, 0, 0.12);
  859.   }
  860. }
  861.  
  862. th.mat-header-cell {
  863.   border-bottom-color: rgba(0, 0, 0, 0.12);
  864. }
  865.  
  866. .mat-header-cell {
  867.   color: rgba(0, 0, 0, 0.54);
  868. }
  869.  
  870. .mat-cell, .mat-footer-cell {
  871.   color: rgba(0, 0, 0, 0.87);
  872. }
  873.  
  874. .mat-calendar-arrow {
  875.   border-top-color: rgba(0, 0, 0, 0.54);
  876. }
  877.  
  878. .mat-datepicker-content {
  879.   .mat-calendar-next-button, .mat-calendar-previous-button {
  880.     color: rgba(0, 0, 0, 0.54);
  881.   }
  882. }
  883.  
  884. .mat-datepicker-toggle {
  885.   color: rgba(0, 0, 0, 0.54);
  886. }
  887.  
  888. .mat-calendar-table-header {
  889.   color: rgba(0, 0, 0, 0.38);
  890. }
  891.  
  892. .mat-calendar-table-header-divider::after {
  893.   background: rgba(0, 0, 0, 0.12);
  894. }
  895.  
  896. .mat-calendar-body-label {
  897.   color: rgba(0, 0, 0, 0.54);
  898. }
  899.  
  900. .mat-calendar-body-cell-content {
  901.   color: rgba(0, 0, 0, 0.87);
  902.   border-color: transparent;
  903. }
  904.  
  905. .mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  906.   color: rgba(0, 0, 0, 0.38);
  907. }
  908.  
  909. .cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected), .cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected), .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  910.   background-color: rgba(0, 0, 0, 0.04);
  911. }
  912.  
  913. .mat-calendar-body-today:not(.mat-calendar-body-selected) {
  914.   border-color: rgba(0, 0, 0, 0.38);
  915. }
  916.  
  917. .mat-calendar-body-disabled > .mat-calendar-body-today:not(.mat-calendar-body-selected) {
  918.   border-color: rgba(0, 0, 0, 0.18);
  919. }
  920.  
  921. .mat-calendar-body-selected {
  922.   background-color: #3f51b5;
  923.   color: #fff;
  924. }
  925.  
  926. .mat-calendar-body-disabled > .mat-calendar-body-selected {
  927.   background-color: rgba(63, 81, 181, 0.4);
  928. }
  929.  
  930. .mat-calendar-body-today.mat-calendar-body-selected {
  931.   box-shadow: inset 0 0 0 1px #fff;
  932. }
  933.  
  934. .mat-datepicker-content {
  935.   box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  936.   background-color: #fff;
  937.   color: rgba(0, 0, 0, 0.87);
  938.  
  939.   &.mat-accent {
  940.     .mat-calendar-body-selected {
  941.       background-color: #ff4081;
  942.       color: #fff;
  943.     }
  944.  
  945.     .mat-calendar-body-disabled > .mat-calendar-body-selected {
  946.       background-color: rgba(255, 64, 129, 0.4);
  947.     }
  948.  
  949.     .mat-calendar-body-today.mat-calendar-body-selected {
  950.       box-shadow: inset 0 0 0 1px #fff;
  951.     }
  952.   }
  953.  
  954.   &.mat-warn {
  955.     .mat-calendar-body-selected {
  956.       background-color: #f44336;
  957.       color: #fff;
  958.     }
  959.  
  960.     .mat-calendar-body-disabled > .mat-calendar-body-selected {
  961.       background-color: rgba(244, 67, 54, 0.4);
  962.     }
  963.  
  964.     .mat-calendar-body-today.mat-calendar-body-selected {
  965.       box-shadow: inset 0 0 0 1px #fff;
  966.     }
  967.   }
  968. }
  969.  
  970. .mat-datepicker-content-touch {
  971.   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  972. }
  973.  
  974. .mat-datepicker-toggle-active {
  975.   color: #3f51b5;
  976.  
  977.   &.mat-accent {
  978.     color: #ff4081;
  979.   }
  980.  
  981.   &.mat-warn {
  982.     color: #f44336;
  983.   }
  984. }
  985.  
  986. .mat-dialog-container {
  987.   box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
  988.   background: #fff;
  989.   color: rgba(0, 0, 0, 0.87);
  990. }
  991.  
  992. .mat-divider {
  993.   border-top-color: rgba(0, 0, 0, 0.12);
  994. }
  995.  
  996. .mat-divider-vertical {
  997.   border-right-color: rgba(0, 0, 0, 0.12);
  998. }
  999.  
  1000. .mat-expansion-panel {
  1001.   background: #fff;
  1002.   color: rgba(0, 0, 0, 0.87);
  1003.  
  1004.   &:not([class*=mat-elevation-z]) {
  1005.     box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  1006.   }
  1007. }
  1008.  
  1009. .mat-action-row {
  1010.   border-top-color: rgba(0, 0, 0, 0.12);
  1011. }
  1012.  
  1013. .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:not([aria-disabled=true]) {
  1014.   &.cdk-keyboard-focused, &.cdk-program-focused, &:hover {
  1015.     background: rgba(0, 0, 0, 0.04);
  1016.   }
  1017. }
  1018.  
  1019. @media (hover: none) {
  1020.   .mat-expansion-panel:not(.mat-expanded):not([aria-disabled=true]) .mat-expansion-panel-header:hover {
  1021.     background: #fff;
  1022.   }
  1023. }
  1024.  
  1025. .mat-expansion-panel-header-title {
  1026.   color: rgba(0, 0, 0, 0.87);
  1027. }
  1028.  
  1029. .mat-expansion-indicator::after, .mat-expansion-panel-header-description {
  1030.   color: rgba(0, 0, 0, 0.54);
  1031. }
  1032.  
  1033. .mat-expansion-panel-header[aria-disabled=true] {
  1034.   color: rgba(0, 0, 0, 0.26);
  1035.  
  1036.   .mat-expansion-panel-header-description, .mat-expansion-panel-header-title {
  1037.     color: inherit;
  1038.   }
  1039. }
  1040.  
  1041. .mat-form-field-label, .mat-hint {
  1042.   color: rgba(0, 0, 0, 0.6);
  1043. }
  1044.  
  1045. .mat-form-field.mat-focused .mat-form-field-label {
  1046.   color: #3f51b5;
  1047.  
  1048.   &.mat-accent {
  1049.     color: #ff4081;
  1050.   }
  1051.  
  1052.   &.mat-warn {
  1053.     color: #f44336;
  1054.   }
  1055. }
  1056.  
  1057. .mat-focused .mat-form-field-required-marker {
  1058.   color: #ff4081;
  1059. }
  1060.  
  1061. .mat-form-field-ripple {
  1062.   background-color: rgba(0, 0, 0, 0.87);
  1063. }
  1064.  
  1065. .mat-form-field.mat-focused .mat-form-field-ripple {
  1066.   background-color: #3f51b5;
  1067.  
  1068.   &.mat-accent {
  1069.     background-color: #ff4081;
  1070.   }
  1071.  
  1072.   &.mat-warn {
  1073.     background-color: #f44336;
  1074.   }
  1075. }
  1076.  
  1077. .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) {
  1078.   .mat-form-field-infix::after {
  1079.     color: #3f51b5;
  1080.   }
  1081.  
  1082.   &.mat-accent .mat-form-field-infix::after {
  1083.     color: #ff4081;
  1084.   }
  1085.  
  1086.   &.mat-warn .mat-form-field-infix::after {
  1087.     color: #f44336;
  1088.   }
  1089. }
  1090.  
  1091. .mat-form-field.mat-form-field-invalid {
  1092.   .mat-form-field-label {
  1093.     color: #f44336;
  1094.  
  1095.     .mat-form-field-required-marker, &.mat-accent {
  1096.       color: #f44336;
  1097.     }
  1098.   }
  1099.  
  1100.   .mat-form-field-ripple {
  1101.     background-color: #f44336;
  1102.  
  1103.     &.mat-accent {
  1104.       background-color: #f44336;
  1105.     }
  1106.   }
  1107. }
  1108.  
  1109. .mat-error {
  1110.   color: #f44336;
  1111. }
  1112.  
  1113. .mat-form-field-appearance-legacy {
  1114.   .mat-form-field-label, .mat-hint {
  1115.     color: rgba(0, 0, 0, 0.54);
  1116.   }
  1117.  
  1118.   .mat-form-field-underline {
  1119.     background-color: rgba(0, 0, 0, 0.42);
  1120.   }
  1121.  
  1122.   &.mat-form-field-disabled .mat-form-field-underline {
  1123.     background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0, rgba(0, 0, 0, 0.42) 33%, transparent 0);
  1124.     background-size: 4px 100%;
  1125.     background-repeat: repeat-x;
  1126.   }
  1127. }
  1128.  
  1129. .mat-form-field-appearance-standard {
  1130.   .mat-form-field-underline {
  1131.     background-color: rgba(0, 0, 0, 0.42);
  1132.   }
  1133.  
  1134.   &.mat-form-field-disabled .mat-form-field-underline {
  1135.     background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0, rgba(0, 0, 0, 0.42) 33%, transparent 0);
  1136.     background-size: 4px 100%;
  1137.     background-repeat: repeat-x;
  1138.   }
  1139. }
  1140.  
  1141. .mat-form-field-appearance-fill {
  1142.   .mat-form-field-flex {
  1143.     background-color: rgba(0, 0, 0, 0.04);
  1144.   }
  1145.  
  1146.   &.mat-form-field-disabled .mat-form-field-flex {
  1147.     background-color: rgba(0, 0, 0, 0.02);
  1148.   }
  1149.  
  1150.   .mat-form-field-underline::before {
  1151.     background-color: rgba(0, 0, 0, 0.42);
  1152.   }
  1153.  
  1154.   &.mat-form-field-disabled {
  1155.     .mat-form-field-label {
  1156.       color: rgba(0, 0, 0, 0.38);
  1157.     }
  1158.  
  1159.     .mat-form-field-underline::before {
  1160.       background-color: transparent;
  1161.     }
  1162.   }
  1163. }
  1164.  
  1165. .mat-form-field-appearance-outline {
  1166.   .mat-form-field-outline {
  1167.     color: rgba(0, 0, 0, 0.12);
  1168.   }
  1169.  
  1170.   .mat-form-field-outline-thick {
  1171.     color: rgba(0, 0, 0, 0.87);
  1172.   }
  1173.  
  1174.   &.mat-focused {
  1175.     .mat-form-field-outline-thick {
  1176.       color: #3f51b5;
  1177.     }
  1178.  
  1179.     &.mat-accent .mat-form-field-outline-thick {
  1180.       color: #ff4081;
  1181.     }
  1182.  
  1183.     &.mat-warn .mat-form-field-outline-thick {
  1184.       color: #f44336;
  1185.     }
  1186.   }
  1187.  
  1188.   &.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick {
  1189.     color: #f44336;
  1190.   }
  1191.  
  1192.   &.mat-form-field-disabled {
  1193.     .mat-form-field-label {
  1194.       color: rgba(0, 0, 0, 0.38);
  1195.     }
  1196.  
  1197.     .mat-form-field-outline {
  1198.       color: rgba(0, 0, 0, 0.06);
  1199.     }
  1200.   }
  1201. }
  1202.  
  1203. .mat-icon {
  1204.   &.mat-primary {
  1205.     color: #3f51b5;
  1206.   }
  1207.  
  1208.   &.mat-accent {
  1209.     color: #ff4081;
  1210.   }
  1211.  
  1212.   &.mat-warn {
  1213.     color: #f44336;
  1214.   }
  1215. }
  1216.  
  1217. .mat-form-field-type-mat-native-select {
  1218.   .mat-form-field-infix::after {
  1219.     color: rgba(0, 0, 0, 0.54);
  1220.   }
  1221.  
  1222.   &.mat-form-field-disabled .mat-form-field-infix::after {
  1223.     color: rgba(0, 0, 0, 0.38);
  1224.   }
  1225. }
  1226.  
  1227. .mat-input-element {
  1228.   &:disabled {
  1229.     color: rgba(0, 0, 0, 0.38);
  1230.   }
  1231.  
  1232.   caret-color: #3f51b5;
  1233.  
  1234.   &::-ms-input-placeholder, &::placeholder, &::-moz-placeholder, &::-webkit-input-placeholder, &:-ms-input-placeholder {
  1235.     color: rgba(0, 0, 0, 0.42);
  1236.   }
  1237. }
  1238.  
  1239. .mat-accent .mat-input-element {
  1240.   caret-color: #ff4081;
  1241. }
  1242.  
  1243. .mat-form-field-invalid .mat-input-element, .mat-warn .mat-input-element {
  1244.   caret-color: #f44336;
  1245. }
  1246.  
  1247. .mat-form-field-type-mat-native-select.mat-form-field-invalid .mat-form-field-infix::after {
  1248.   color: #f44336;
  1249. }
  1250.  
  1251. .mat-list-base {
  1252.   .mat-list-item, .mat-list-option {
  1253.     color: rgba(0, 0, 0, 0.87);
  1254.   }
  1255.  
  1256.   .mat-subheader {
  1257.     color: rgba(0, 0, 0, 0.54);
  1258.   }
  1259. }
  1260.  
  1261. .mat-list-item-disabled {
  1262.   background-color: #eee;
  1263. }
  1264.  
  1265. .mat-action-list .mat-list-item {
  1266.   &:focus, &:hover {
  1267.     background: rgba(0, 0, 0, 0.04);
  1268.   }
  1269. }
  1270.  
  1271. .mat-list-option {
  1272.   &:focus, &:hover {
  1273.     background: rgba(0, 0, 0, 0.04);
  1274.   }
  1275. }
  1276.  
  1277. .mat-nav-list .mat-list-item {
  1278.   &:focus, &:hover {
  1279.     background: rgba(0, 0, 0, 0.04);
  1280.   }
  1281. }
  1282.  
  1283. .mat-menu-panel {
  1284.   background: #fff;
  1285.  
  1286.   &:not([class*=mat-elevation-z]) {
  1287.     box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  1288.   }
  1289. }
  1290.  
  1291. .mat-menu-item {
  1292.   background: 0 0;
  1293.   color: rgba(0, 0, 0, 0.87);
  1294.  
  1295.   &[disabled] {
  1296.     color: rgba(0, 0, 0, 0.38);
  1297.  
  1298.     &::after {
  1299.       color: rgba(0, 0, 0, 0.38);
  1300.     }
  1301.   }
  1302.  
  1303.   .mat-icon-no-color {
  1304.     color: rgba(0, 0, 0, 0.54);
  1305.   }
  1306. }
  1307.  
  1308. .mat-menu-item-submenu-trigger::after {
  1309.   color: rgba(0, 0, 0, 0.54);
  1310. }
  1311.  
  1312. .mat-menu-item-highlighted:not([disabled]) {
  1313.   background: rgba(0, 0, 0, 0.04);
  1314. }
  1315.  
  1316. .mat-menu-item {
  1317.   &.cdk-keyboard-focused:not([disabled]), &.cdk-program-focused:not([disabled]), &:hover:not([disabled]) {
  1318.     background: rgba(0, 0, 0, 0.04);
  1319.   }
  1320. }
  1321.  
  1322. .mat-paginator {
  1323.   background: #fff;
  1324.   color: rgba(0, 0, 0, 0.54);
  1325. }
  1326.  
  1327. .mat-paginator-page-size .mat-select-trigger {
  1328.   color: rgba(0, 0, 0, 0.54);
  1329. }
  1330.  
  1331. .mat-paginator-decrement, .mat-paginator-increment {
  1332.   border-top: 2px solid rgba(0, 0, 0, 0.54);
  1333.   border-right: 2px solid rgba(0, 0, 0, 0.54);
  1334. }
  1335.  
  1336. .mat-paginator-first, .mat-paginator-last {
  1337.   border-top: 2px solid rgba(0, 0, 0, 0.54);
  1338. }
  1339.  
  1340. .mat-icon-button[disabled] {
  1341.   .mat-paginator-decrement, .mat-paginator-first, .mat-paginator-increment, .mat-paginator-last {
  1342.     border-color: rgba(0, 0, 0, 0.38);
  1343.   }
  1344. }
  1345.  
  1346. .mat-progress-bar-background {
  1347.   fill: #c5cae9;
  1348. }
  1349.  
  1350. .mat-progress-bar-buffer {
  1351.   background-color: #c5cae9;
  1352. }
  1353.  
  1354. .mat-progress-bar-fill::after {
  1355.   background-color: #3f51b5;
  1356. }
  1357.  
  1358. .mat-progress-bar {
  1359.   &.mat-accent {
  1360.     .mat-progress-bar-background {
  1361.       fill: #ff80ab;
  1362.     }
  1363.  
  1364.     .mat-progress-bar-buffer {
  1365.       background-color: #ff80ab;
  1366.     }
  1367.  
  1368.     .mat-progress-bar-fill::after {
  1369.       background-color: #ff4081;
  1370.     }
  1371.   }
  1372.  
  1373.   &.mat-warn {
  1374.     .mat-progress-bar-background {
  1375.       fill: #ffcdd2;
  1376.     }
  1377.  
  1378.     .mat-progress-bar-buffer {
  1379.       background-color: #ffcdd2;
  1380.     }
  1381.  
  1382.     .mat-progress-bar-fill::after {
  1383.       background-color: #f44336;
  1384.     }
  1385.   }
  1386. }
  1387.  
  1388. .mat-progress-spinner circle, .mat-spinner circle {
  1389.   stroke: #3f51b5;
  1390. }
  1391.  
  1392. .mat-progress-spinner.mat-accent circle, .mat-spinner.mat-accent circle {
  1393.   stroke: #ff4081;
  1394. }
  1395.  
  1396. .mat-progress-spinner.mat-warn circle, .mat-spinner.mat-warn circle {
  1397.   stroke: #f44336;
  1398. }
  1399.  
  1400. .mat-radio-outer-circle {
  1401.   border-color: rgba(0, 0, 0, 0.54);
  1402. }
  1403.  
  1404. .mat-radio-button {
  1405.   &.mat-primary {
  1406.     &.mat-radio-checked .mat-radio-outer-circle {
  1407.       border-color: #3f51b5;
  1408.     }
  1409.  
  1410.     .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), &.mat-radio-checked .mat-radio-persistent-ripple, &:active .mat-radio-persistent-ripple {
  1411.       background-color: #3f51b5;
  1412.     }
  1413.   }
  1414.  
  1415.   &.mat-accent {
  1416.     &.mat-radio-checked .mat-radio-outer-circle {
  1417.       border-color: #ff4081;
  1418.     }
  1419.  
  1420.     .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), &.mat-radio-checked .mat-radio-persistent-ripple, &:active .mat-radio-persistent-ripple {
  1421.       background-color: #ff4081;
  1422.     }
  1423.   }
  1424.  
  1425.   &.mat-warn {
  1426.     &.mat-radio-checked .mat-radio-outer-circle {
  1427.       border-color: #f44336;
  1428.     }
  1429.  
  1430.     .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), &.mat-radio-checked .mat-radio-persistent-ripple, &:active .mat-radio-persistent-ripple {
  1431.       background-color: #f44336;
  1432.     }
  1433.   }
  1434.  
  1435.   &.mat-radio-disabled {
  1436.     .mat-radio-outer-circle, &.mat-radio-checked .mat-radio-outer-circle {
  1437.       border-color: rgba(0, 0, 0, 0.38);
  1438.     }
  1439.  
  1440.     .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element {
  1441.       background-color: rgba(0, 0, 0, 0.38);
  1442.     }
  1443.  
  1444.     .mat-radio-label-content {
  1445.       color: rgba(0, 0, 0, 0.38);
  1446.     }
  1447.   }
  1448.  
  1449.   .mat-ripple-element {
  1450.     background-color: #000;
  1451.   }
  1452. }
  1453.  
  1454. .mat-select-value {
  1455.   color: rgba(0, 0, 0, 0.87);
  1456. }
  1457.  
  1458. .mat-select-placeholder {
  1459.   color: rgba(0, 0, 0, 0.42);
  1460. }
  1461.  
  1462. .mat-select-disabled .mat-select-value {
  1463.   color: rgba(0, 0, 0, 0.38);
  1464. }
  1465.  
  1466. .mat-select-arrow {
  1467.   color: rgba(0, 0, 0, 0.54);
  1468. }
  1469.  
  1470. .mat-select-panel {
  1471.   background: #fff;
  1472.  
  1473.   &:not([class*=mat-elevation-z]) {
  1474.     box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  1475.   }
  1476.  
  1477.   .mat-option.mat-selected:not(.mat-option-multiple) {
  1478.     background: rgba(0, 0, 0, 0.12);
  1479.   }
  1480. }
  1481.  
  1482. .mat-form-field {
  1483.   &.mat-focused {
  1484.     &.mat-primary .mat-select-arrow {
  1485.       color: #3f51b5;
  1486.     }
  1487.  
  1488.     &.mat-accent .mat-select-arrow {
  1489.       color: #ff4081;
  1490.     }
  1491.   }
  1492.  
  1493.   .mat-select.mat-select-invalid .mat-select-arrow, &.mat-focused.mat-warn .mat-select-arrow {
  1494.     color: #f44336;
  1495.   }
  1496.  
  1497.   .mat-select.mat-select-disabled .mat-select-arrow {
  1498.     color: rgba(0, 0, 0, 0.38);
  1499.   }
  1500. }
  1501.  
  1502. .mat-drawer-container {
  1503.   background-color: #fafafa;
  1504.   color: rgba(0, 0, 0, 0.87);
  1505. }
  1506.  
  1507. .mat-drawer {
  1508.   background-color: #fff;
  1509.   color: rgba(0, 0, 0, 0.87);
  1510.  
  1511.   &.mat-drawer-push {
  1512.     background-color: #fff;
  1513.   }
  1514.  
  1515.   &:not(.mat-drawer-side) {
  1516.     box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  1517.   }
  1518. }
  1519.  
  1520. .mat-drawer-side {
  1521.   border-right: 1px solid rgba(0, 0, 0, 0.12);
  1522.  
  1523.   &.mat-drawer-end {
  1524.     border-left: 1px solid rgba(0, 0, 0, 0.12);
  1525.     border-right: none;
  1526.   }
  1527. }
  1528.  
  1529. [dir=rtl] .mat-drawer-side {
  1530.   border-left: 1px solid rgba(0, 0, 0, 0.12);
  1531.   border-right: none;
  1532.  
  1533.   &.mat-drawer-end {
  1534.     border-left: none;
  1535.     border-right: 1px solid rgba(0, 0, 0, 0.12);
  1536.   }
  1537. }
  1538.  
  1539. .mat-drawer-backdrop.mat-drawer-shown {
  1540.   background-color: rgba(0, 0, 0, 0.6);
  1541. }
  1542.  
  1543. .mat-slide-toggle {
  1544.   &.mat-checked {
  1545.     .mat-slide-toggle-thumb {
  1546.       background-color: #ff4081;
  1547.     }
  1548.  
  1549.     .mat-slide-toggle-bar {
  1550.       background-color: rgba(255, 64, 129, 0.54);
  1551.     }
  1552.  
  1553.     .mat-ripple-element {
  1554.       background-color: #ff4081;
  1555.     }
  1556.   }
  1557.  
  1558.   &.mat-primary.mat-checked {
  1559.     .mat-slide-toggle-thumb {
  1560.       background-color: #3f51b5;
  1561.     }
  1562.  
  1563.     .mat-slide-toggle-bar {
  1564.       background-color: rgba(63, 81, 181, 0.54);
  1565.     }
  1566.  
  1567.     .mat-ripple-element {
  1568.       background-color: #3f51b5;
  1569.     }
  1570.   }
  1571.  
  1572.   &.mat-warn.mat-checked {
  1573.     .mat-slide-toggle-thumb {
  1574.       background-color: #f44336;
  1575.     }
  1576.  
  1577.     .mat-slide-toggle-bar {
  1578.       background-color: rgba(244, 67, 54, 0.54);
  1579.     }
  1580.  
  1581.     .mat-ripple-element {
  1582.       background-color: #f44336;
  1583.     }
  1584.   }
  1585.  
  1586.   &:not(.mat-checked) .mat-ripple-element {
  1587.     background-color: #000;
  1588.   }
  1589. }
  1590.  
  1591. .mat-slide-toggle-thumb {
  1592.   box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  1593.   background-color: #fafafa;
  1594. }
  1595.  
  1596. .mat-slide-toggle-bar {
  1597.   background-color: rgba(0, 0, 0, 0.38);
  1598. }
  1599.  
  1600. .mat-slider-track-background {
  1601.   background-color: rgba(0, 0, 0, 0.26);
  1602. }
  1603.  
  1604. .mat-primary {
  1605.   .mat-slider-thumb, .mat-slider-thumb-label, .mat-slider-track-fill {
  1606.     background-color: #3f51b5;
  1607.   }
  1608.  
  1609.   .mat-slider-thumb-label-text {
  1610.     color: #fff;
  1611.   }
  1612. }
  1613.  
  1614. .mat-accent {
  1615.   .mat-slider-thumb, .mat-slider-thumb-label, .mat-slider-track-fill {
  1616.     background-color: #ff4081;
  1617.   }
  1618.  
  1619.   .mat-slider-thumb-label-text {
  1620.     color: #fff;
  1621.   }
  1622. }
  1623.  
  1624. .mat-warn {
  1625.   .mat-slider-thumb, .mat-slider-thumb-label, .mat-slider-track-fill {
  1626.     background-color: #f44336;
  1627.   }
  1628.  
  1629.   .mat-slider-thumb-label-text {
  1630.     color: #fff;
  1631.   }
  1632. }
  1633.  
  1634. .mat-slider-focus-ring {
  1635.   background-color: rgba(255, 64, 129, 0.2);
  1636. }
  1637.  
  1638. .cdk-focused .mat-slider-track-background, .mat-slider:hover .mat-slider-track-background {
  1639.   background-color: rgba(0, 0, 0, 0.38);
  1640. }
  1641.  
  1642. .mat-slider-disabled {
  1643.   .mat-slider-thumb, .mat-slider-track-background, .mat-slider-track-fill, &:hover .mat-slider-track-background {
  1644.     background-color: rgba(0, 0, 0, 0.26);
  1645.   }
  1646. }
  1647.  
  1648. .mat-slider-min-value {
  1649.   .mat-slider-focus-ring {
  1650.     background-color: rgba(0, 0, 0, 0.12);
  1651.   }
  1652.  
  1653.   &.mat-slider-thumb-label-showing {
  1654.     .mat-slider-thumb, .mat-slider-thumb-label {
  1655.       background-color: rgba(0, 0, 0, 0.87);
  1656.     }
  1657.  
  1658.     &.cdk-focused {
  1659.       .mat-slider-thumb, .mat-slider-thumb-label {
  1660.         background-color: rgba(0, 0, 0, 0.26);
  1661.       }
  1662.     }
  1663.   }
  1664.  
  1665.   &:not(.mat-slider-thumb-label-showing) {
  1666.     .mat-slider-thumb {
  1667.       border-color: rgba(0, 0, 0, 0.26);
  1668.       background-color: transparent;
  1669.     }
  1670.  
  1671.     &.cdk-focused .mat-slider-thumb, &:hover .mat-slider-thumb {
  1672.       border-color: rgba(0, 0, 0, 0.38);
  1673.     }
  1674.  
  1675.     &.cdk-focused.mat-slider-disabled .mat-slider-thumb, &:hover.mat-slider-disabled .mat-slider-thumb {
  1676.       border-color: rgba(0, 0, 0, 0.26);
  1677.     }
  1678.   }
  1679. }
  1680.  
  1681. .mat-slider-has-ticks .mat-slider-wrapper::after {
  1682.   border-color: rgba(0, 0, 0, 0.7);
  1683. }
  1684.  
  1685. .mat-slider-horizontal .mat-slider-ticks {
  1686.   background-image: repeating-linear-gradient(to right, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);
  1687.   background-image: -moz-repeating-linear-gradient(0.0001deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);
  1688. }
  1689.  
  1690. .mat-slider-vertical .mat-slider-ticks {
  1691.   background-image: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7) 2px, transparent 0, transparent);
  1692. }
  1693.  
  1694. .mat-step-header {
  1695.   &.cdk-keyboard-focused, &.cdk-program-focused, &:hover {
  1696.     background-color: rgba(0, 0, 0, 0.04);
  1697.   }
  1698.  
  1699.   .mat-step-label, .mat-step-optional {
  1700.     color: rgba(0, 0, 0, 0.54);
  1701.   }
  1702.  
  1703.   .mat-step-icon {
  1704.     background-color: rgba(0, 0, 0, 0.54);
  1705.     color: #fff;
  1706.   }
  1707.  
  1708.   .mat-step-icon-selected, .mat-step-icon-state-done, .mat-step-icon-state-edit {
  1709.     background-color: #3f51b5;
  1710.     color: #fff;
  1711.   }
  1712.  
  1713.   .mat-step-icon-state-error {
  1714.     background-color: transparent;
  1715.     color: #f44336;
  1716.   }
  1717.  
  1718.   .mat-step-label {
  1719.     &.mat-step-label-active {
  1720.       color: rgba(0, 0, 0, 0.87);
  1721.     }
  1722.  
  1723.     &.mat-step-label-error {
  1724.       color: #f44336;
  1725.     }
  1726.   }
  1727. }
  1728.  
  1729. @media (hover: none) {
  1730.   .mat-step-header:hover {
  1731.     background: 0 0;
  1732.   }
  1733. }
  1734.  
  1735. .mat-stepper-horizontal, .mat-stepper-vertical {
  1736.   background-color: #fff;
  1737. }
  1738.  
  1739. .mat-stepper-vertical-line::before {
  1740.   border-left-color: rgba(0, 0, 0, 0.12);
  1741. }
  1742.  
  1743. .mat-horizontal-stepper-header {
  1744.   &::after, &::before {
  1745.     border-top-color: rgba(0, 0, 0, 0.12);
  1746.   }
  1747. }
  1748.  
  1749. .mat-stepper-horizontal-line {
  1750.   border-top-color: rgba(0, 0, 0, 0.12);
  1751. }
  1752.  
  1753. .mat-sort-header-arrow {
  1754.   color: #757575;
  1755. }
  1756.  
  1757. .mat-tab-header, .mat-tab-nav-bar {
  1758.   border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  1759. }
  1760.  
  1761. .mat-tab-group-inverted-header {
  1762.   .mat-tab-header, .mat-tab-nav-bar {
  1763.     border-top: 1px solid rgba(0, 0, 0, 0.12);
  1764.     border-bottom: none;
  1765.   }
  1766. }
  1767.  
  1768. .mat-tab-label, .mat-tab-link {
  1769.   color: rgba(0, 0, 0, 0.87);
  1770. }
  1771.  
  1772. .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  1773.   color: rgba(0, 0, 0, 0.38);
  1774. }
  1775.  
  1776. .mat-tab-header-pagination-chevron {
  1777.   border-color: rgba(0, 0, 0, 0.87);
  1778. }
  1779.  
  1780. .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {
  1781.   border-color: rgba(0, 0, 0, 0.38);
  1782. }
  1783.  
  1784. .mat-tab-group[class*=mat-background-] .mat-tab-header, .mat-tab-nav-bar[class*=mat-background-] {
  1785.   border-bottom: none;
  1786.   border-top: none;
  1787. }
  1788.  
  1789. .mat-tab-group.mat-primary {
  1790.   .mat-tab-label {
  1791.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1792.       background-color: rgba(197, 202, 233, 0.3);
  1793.     }
  1794.   }
  1795.  
  1796.   .mat-tab-link {
  1797.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1798.       background-color: rgba(197, 202, 233, 0.3);
  1799.     }
  1800.   }
  1801. }
  1802.  
  1803. .mat-tab-nav-bar.mat-primary {
  1804.   .mat-tab-label {
  1805.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1806.       background-color: rgba(197, 202, 233, 0.3);
  1807.     }
  1808.   }
  1809.  
  1810.   .mat-tab-link {
  1811.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1812.       background-color: rgba(197, 202, 233, 0.3);
  1813.     }
  1814.   }
  1815. }
  1816.  
  1817. .mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar {
  1818.   background-color: #3f51b5;
  1819. }
  1820.  
  1821. .mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar {
  1822.   background-color: #fff;
  1823. }
  1824.  
  1825. .mat-tab-group.mat-accent {
  1826.   .mat-tab-label {
  1827.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1828.       background-color: rgba(255, 128, 171, 0.3);
  1829.     }
  1830.   }
  1831.  
  1832.   .mat-tab-link {
  1833.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1834.       background-color: rgba(255, 128, 171, 0.3);
  1835.     }
  1836.   }
  1837. }
  1838.  
  1839. .mat-tab-nav-bar.mat-accent {
  1840.   .mat-tab-label {
  1841.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1842.       background-color: rgba(255, 128, 171, 0.3);
  1843.     }
  1844.   }
  1845.  
  1846.   .mat-tab-link {
  1847.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1848.       background-color: rgba(255, 128, 171, 0.3);
  1849.     }
  1850.   }
  1851. }
  1852.  
  1853. .mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar {
  1854.   background-color: #ff4081;
  1855. }
  1856.  
  1857. .mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar {
  1858.   background-color: #fff;
  1859. }
  1860.  
  1861. .mat-tab-group.mat-warn {
  1862.   .mat-tab-label {
  1863.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1864.       background-color: rgba(255, 205, 210, 0.3);
  1865.     }
  1866.   }
  1867.  
  1868.   .mat-tab-link {
  1869.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1870.       background-color: rgba(255, 205, 210, 0.3);
  1871.     }
  1872.   }
  1873. }
  1874.  
  1875. .mat-tab-nav-bar.mat-warn {
  1876.   .mat-tab-label {
  1877.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1878.       background-color: rgba(255, 205, 210, 0.3);
  1879.     }
  1880.   }
  1881.  
  1882.   .mat-tab-link {
  1883.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1884.       background-color: rgba(255, 205, 210, 0.3);
  1885.     }
  1886.   }
  1887. }
  1888.  
  1889. .mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar {
  1890.   background-color: #f44336;
  1891. }
  1892.  
  1893. .mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar {
  1894.   background-color: #fff;
  1895. }
  1896.  
  1897. .mat-tab-group.mat-background-primary {
  1898.   .mat-tab-label {
  1899.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1900.       background-color: rgba(197, 202, 233, 0.3);
  1901.     }
  1902.   }
  1903.  
  1904.   .mat-tab-link {
  1905.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1906.       background-color: rgba(197, 202, 233, 0.3);
  1907.     }
  1908.   }
  1909. }
  1910.  
  1911. .mat-tab-nav-bar.mat-background-primary {
  1912.   .mat-tab-label {
  1913.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1914.       background-color: rgba(197, 202, 233, 0.3);
  1915.     }
  1916.   }
  1917.  
  1918.   .mat-tab-link {
  1919.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1920.       background-color: rgba(197, 202, 233, 0.3);
  1921.     }
  1922.   }
  1923. }
  1924.  
  1925. .mat-tab-group.mat-background-primary {
  1926.   .mat-tab-header, .mat-tab-header-pagination, .mat-tab-links {
  1927.     background-color: #3f51b5;
  1928.   }
  1929. }
  1930.  
  1931. .mat-tab-nav-bar.mat-background-primary {
  1932.   .mat-tab-header, .mat-tab-header-pagination, .mat-tab-links {
  1933.     background-color: #3f51b5;
  1934.   }
  1935. }
  1936.  
  1937. .mat-tab-group.mat-background-primary {
  1938.   .mat-tab-label, .mat-tab-link {
  1939.     color: #fff;
  1940.   }
  1941. }
  1942.  
  1943. .mat-tab-nav-bar.mat-background-primary {
  1944.   .mat-tab-label, .mat-tab-link {
  1945.     color: #fff;
  1946.   }
  1947. }
  1948.  
  1949. .mat-tab-group.mat-background-primary {
  1950.   .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  1951.     color: rgba(255, 255, 255, 0.4);
  1952.   }
  1953. }
  1954.  
  1955. .mat-tab-nav-bar.mat-background-primary {
  1956.   .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  1957.     color: rgba(255, 255, 255, 0.4);
  1958.   }
  1959. }
  1960.  
  1961. .mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron {
  1962.   border-color: #fff;
  1963. }
  1964.  
  1965. .mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {
  1966.   border-color: rgba(255, 255, 255, 0.4);
  1967. }
  1968.  
  1969. .mat-tab-group.mat-background-primary .mat-ripple-element, .mat-tab-nav-bar.mat-background-primary .mat-ripple-element {
  1970.   background-color: rgba(255, 255, 255, 0.12);
  1971. }
  1972.  
  1973. .mat-tab-group.mat-background-accent {
  1974.   .mat-tab-label {
  1975.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1976.       background-color: rgba(255, 128, 171, 0.3);
  1977.     }
  1978.   }
  1979.  
  1980.   .mat-tab-link {
  1981.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1982.       background-color: rgba(255, 128, 171, 0.3);
  1983.     }
  1984.   }
  1985. }
  1986.  
  1987. .mat-tab-nav-bar.mat-background-accent {
  1988.   .mat-tab-label {
  1989.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1990.       background-color: rgba(255, 128, 171, 0.3);
  1991.     }
  1992.   }
  1993.  
  1994.   .mat-tab-link {
  1995.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  1996.       background-color: rgba(255, 128, 171, 0.3);
  1997.     }
  1998.   }
  1999. }
  2000.  
  2001. .mat-tab-group.mat-background-accent {
  2002.   .mat-tab-header, .mat-tab-header-pagination, .mat-tab-links {
  2003.     background-color: #ff4081;
  2004.   }
  2005. }
  2006.  
  2007. .mat-tab-nav-bar.mat-background-accent {
  2008.   .mat-tab-header, .mat-tab-header-pagination, .mat-tab-links {
  2009.     background-color: #ff4081;
  2010.   }
  2011. }
  2012.  
  2013. .mat-tab-group.mat-background-accent {
  2014.   .mat-tab-label, .mat-tab-link {
  2015.     color: #fff;
  2016.   }
  2017. }
  2018.  
  2019. .mat-tab-nav-bar.mat-background-accent {
  2020.   .mat-tab-label, .mat-tab-link {
  2021.     color: #fff;
  2022.   }
  2023. }
  2024.  
  2025. .mat-tab-group.mat-background-accent {
  2026.   .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  2027.     color: rgba(255, 255, 255, 0.4);
  2028.   }
  2029. }
  2030.  
  2031. .mat-tab-nav-bar.mat-background-accent {
  2032.   .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  2033.     color: rgba(255, 255, 255, 0.4);
  2034.   }
  2035. }
  2036.  
  2037. .mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron {
  2038.   border-color: #fff;
  2039. }
  2040.  
  2041. .mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {
  2042.   border-color: rgba(255, 255, 255, 0.4);
  2043. }
  2044.  
  2045. .mat-tab-group.mat-background-accent .mat-ripple-element, .mat-tab-nav-bar.mat-background-accent .mat-ripple-element {
  2046.   background-color: rgba(255, 255, 255, 0.12);
  2047. }
  2048.  
  2049. .mat-tab-group.mat-background-warn {
  2050.   .mat-tab-label {
  2051.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  2052.       background-color: rgba(255, 205, 210, 0.3);
  2053.     }
  2054.   }
  2055.  
  2056.   .mat-tab-link {
  2057.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  2058.       background-color: rgba(255, 205, 210, 0.3);
  2059.     }
  2060.   }
  2061. }
  2062.  
  2063. .mat-tab-nav-bar.mat-background-warn {
  2064.   .mat-tab-label {
  2065.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  2066.       background-color: rgba(255, 205, 210, 0.3);
  2067.     }
  2068.   }
  2069.  
  2070.   .mat-tab-link {
  2071.     &.cdk-keyboard-focused:not(.mat-tab-disabled), &.cdk-program-focused:not(.mat-tab-disabled) {
  2072.       background-color: rgba(255, 205, 210, 0.3);
  2073.     }
  2074.   }
  2075. }
  2076.  
  2077. .mat-tab-group.mat-background-warn {
  2078.   .mat-tab-header, .mat-tab-header-pagination, .mat-tab-links {
  2079.     background-color: #f44336;
  2080.   }
  2081. }
  2082.  
  2083. .mat-tab-nav-bar.mat-background-warn {
  2084.   .mat-tab-header, .mat-tab-header-pagination, .mat-tab-links {
  2085.     background-color: #f44336;
  2086.   }
  2087. }
  2088.  
  2089. .mat-tab-group.mat-background-warn {
  2090.   .mat-tab-label, .mat-tab-link {
  2091.     color: #fff;
  2092.   }
  2093. }
  2094.  
  2095. .mat-tab-nav-bar.mat-background-warn {
  2096.   .mat-tab-label, .mat-tab-link {
  2097.     color: #fff;
  2098.   }
  2099. }
  2100.  
  2101. .mat-tab-group.mat-background-warn {
  2102.   .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  2103.     color: rgba(255, 255, 255, 0.4);
  2104.   }
  2105. }
  2106.  
  2107. .mat-tab-nav-bar.mat-background-warn {
  2108.   .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled {
  2109.     color: rgba(255, 255, 255, 0.4);
  2110.   }
  2111. }
  2112.  
  2113. .mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron {
  2114.   border-color: #fff;
  2115. }
  2116.  
  2117. .mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {
  2118.   border-color: rgba(255, 255, 255, 0.4);
  2119. }
  2120.  
  2121. .mat-tab-group.mat-background-warn .mat-ripple-element, .mat-tab-nav-bar.mat-background-warn .mat-ripple-element {
  2122.   background-color: rgba(255, 255, 255, 0.12);
  2123. }
  2124.  
  2125. .mat-toolbar {
  2126.   background: #f5f5f5;
  2127.   color: rgba(0, 0, 0, 0.87);
  2128.  
  2129.   &.mat-primary {
  2130.     background: #3f51b5;
  2131.     color: #fff;
  2132.   }
  2133.  
  2134.   &.mat-accent {
  2135.     background: #ff4081;
  2136.     color: #fff;
  2137.   }
  2138.  
  2139.   &.mat-warn {
  2140.     background: #f44336;
  2141.     color: #fff;
  2142.   }
  2143.  
  2144.   .mat-focused .mat-form-field-ripple, .mat-form-field-ripple, .mat-form-field-underline {
  2145.     background-color: currentColor;
  2146.   }
  2147.  
  2148.   .mat-focused .mat-form-field-label, .mat-form-field-label, .mat-form-field.mat-focused .mat-select-arrow, .mat-select-arrow, .mat-select-value {
  2149.     color: inherit;
  2150.   }
  2151.  
  2152.   .mat-input-element {
  2153.     caret-color: currentColor;
  2154.   }
  2155. }
  2156.  
  2157. .mat-tooltip {
  2158.   background: rgba(97, 97, 97, 0.9);
  2159. }
  2160.  
  2161. .mat-tree {
  2162.   background: #fff;
  2163. }
  2164.  
  2165. .mat-nested-tree-node, .mat-tree-node {
  2166.   color: rgba(0, 0, 0, 0.87);
  2167. }
  2168.  
  2169. .mat-snack-bar-container {
  2170.   color: rgba(255, 255, 255, 0.7);
  2171.   background: #323232;
  2172.   box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
  2173. }
  2174.  
  2175. .mat-simple-snackbar-action {
  2176.   color: #ff4081;
  2177. }
  2178.  
  2179. .swiper-container {
  2180.   margin: 0 auto;
  2181.   position: relative;
  2182.   overflow: hidden;
  2183.   list-style: none;
  2184.   padding: 0;
  2185.   z-index: 1;
  2186. }
  2187.  
  2188. .swiper-container-no-flexbox .swiper-slide {
  2189.   float: left;
  2190. }
  2191.  
  2192. .swiper-container-vertical > .swiper-wrapper {
  2193.   flex-direction: column;
  2194. }
  2195.  
  2196. .swiper-wrapper {
  2197.   position: relative;
  2198.   width: 100%;
  2199.   height: 100%;
  2200.   z-index: 1;
  2201.   display: flex;
  2202.   transition-property: transform;
  2203.   box-sizing: content-box;
  2204. }
  2205.  
  2206. .swiper-container-android .swiper-slide, .swiper-wrapper {
  2207.   transform: translate3d(0, 0, 0);
  2208. }
  2209.  
  2210. .swiper-container-multirow > .swiper-wrapper {
  2211.   flex-wrap: wrap;
  2212. }
  2213.  
  2214. .swiper-container-free-mode > .swiper-wrapper {
  2215.   transition-timing-function: ease-out;
  2216.   margin: 0 auto;
  2217. }
  2218.  
  2219. .swiper-slide {
  2220.   flex-shrink: 0;
  2221.   width: 100%;
  2222.   height: 100%;
  2223.   position: relative;
  2224.   transition-property: transform;
  2225. }
  2226.  
  2227. .swiper-slide-invisible-blank {
  2228.   visibility: hidden;
  2229. }
  2230.  
  2231. .swiper-container-autoheight {
  2232.   height: auto;
  2233.  
  2234.   .swiper-slide {
  2235.     height: auto;
  2236.   }
  2237.  
  2238.   .swiper-wrapper {
  2239.     align-items: flex-start;
  2240.     transition-property: transform,height;
  2241.   }
  2242. }
  2243.  
  2244. .swiper-container-3d {
  2245.   perspective: 1200px;
  2246.  
  2247.   .swiper-cube-shadow, .swiper-slide, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top, .swiper-wrapper {
  2248.     transform-style: preserve-3d;
  2249.   }
  2250.  
  2251.   .swiper-slide-shadow-bottom, .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top {
  2252.     position: absolute;
  2253.     left: 0;
  2254.     top: 0;
  2255.     width: 100%;
  2256.     height: 100%;
  2257.     pointer-events: none;
  2258.     z-index: 10;
  2259.   }
  2260.  
  2261.   .swiper-slide-shadow-left {
  2262.     background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  2263.   }
  2264.  
  2265.   .swiper-slide-shadow-right {
  2266.     background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  2267.   }
  2268.  
  2269.   .swiper-slide-shadow-top {
  2270.     background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  2271.   }
  2272.  
  2273.   .swiper-slide-shadow-bottom {
  2274.     background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  2275.   }
  2276. }
  2277.  
  2278. .swiper-container-wp8-horizontal {
  2279.   touch-action: pan-y;
  2280.  
  2281.   > .swiper-wrapper {
  2282.     touch-action: pan-y;
  2283.   }
  2284. }
  2285.  
  2286. .swiper-container-wp8-vertical {
  2287.   touch-action: pan-x;
  2288.  
  2289.   > .swiper-wrapper {
  2290.     touch-action: pan-x;
  2291.   }
  2292. }
  2293.  
  2294. .swiper-button-next, .swiper-button-prev {
  2295.   position: absolute;
  2296.   top: 50%;
  2297.   width: 27px;
  2298.   height: 44px;
  2299.   margin-top: -22px;
  2300.   z-index: 10;
  2301.   cursor: pointer;
  2302.   background-size: 27px 44px;
  2303.   background-position: center;
  2304.   background-repeat: no-repeat;
  2305. }
  2306.  
  2307. .swiper-button-next.swiper-button-disabled {
  2308.   opacity: .35;
  2309.   cursor: auto;
  2310.   pointer-events: none;
  2311. }
  2312.  
  2313. .swiper-button-prev {
  2314.   &.swiper-button-disabled {
  2315.     opacity: .35;
  2316.     cursor: auto;
  2317.     pointer-events: none;
  2318.   }
  2319.  
  2320.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  2321.   left: 10px;
  2322.   right: auto;
  2323. }
  2324.  
  2325. .swiper-container-rtl .swiper-button-next {
  2326.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  2327.   left: 10px;
  2328.   right: auto;
  2329. }
  2330.  
  2331. .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
  2332.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  2333.   right: 10px;
  2334.   left: auto;
  2335. }
  2336.  
  2337. .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white {
  2338.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
  2339. }
  2340.  
  2341. .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
  2342.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
  2343. }
  2344.  
  2345. .swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black {
  2346.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
  2347. }
  2348.  
  2349. .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black {
  2350.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
  2351. }
  2352.  
  2353. .swiper-button-lock {
  2354.   display: none;
  2355. }
  2356.  
  2357. .swiper-pagination {
  2358.   position: absolute;
  2359.   text-align: center;
  2360.   transition: .3s opacity;
  2361.   transform: translate3d(0, 0, 0);
  2362.   z-index: 10;
  2363.  
  2364.   &.swiper-pagination-hidden {
  2365.     opacity: 0;
  2366.   }
  2367. }
  2368.  
  2369. .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
  2370.   bottom: 10px;
  2371.   left: 0;
  2372.   width: 100%;
  2373. }
  2374.  
  2375. .swiper-pagination-bullets-dynamic {
  2376.   overflow: hidden;
  2377.   font-size: 0;
  2378.  
  2379.   .swiper-pagination-bullet {
  2380.     transform: scale(0.33);
  2381.     position: relative;
  2382.   }
  2383.  
  2384.   .swiper-pagination-bullet-active, .swiper-pagination-bullet-active-main {
  2385.     transform: scale(1);
  2386.   }
  2387.  
  2388.   .swiper-pagination-bullet-active-prev {
  2389.     transform: scale(0.66);
  2390.   }
  2391.  
  2392.   .swiper-pagination-bullet-active-prev-prev {
  2393.     transform: scale(0.33);
  2394.   }
  2395.  
  2396.   .swiper-pagination-bullet-active-next {
  2397.     transform: scale(0.66);
  2398.   }
  2399.  
  2400.   .swiper-pagination-bullet-active-next-next {
  2401.     transform: scale(0.33);
  2402.   }
  2403. }
  2404.  
  2405. .swiper-pagination-bullet {
  2406.   width: 8px;
  2407.   height: 8px;
  2408.   display: inline-block;
  2409.   border-radius: 100%;
  2410.   background: #000;
  2411.   opacity: .2;
  2412. }
  2413.  
  2414. button.swiper-pagination-bullet {
  2415.   border: none;
  2416.   margin: 0;
  2417.   padding: 0;
  2418.   box-shadow: none;
  2419.   -webkit-appearance: none;
  2420.   -moz-appearance: none;
  2421.   appearance: none;
  2422. }
  2423.  
  2424. .swiper-pagination-clickable .swiper-pagination-bullet {
  2425.   cursor: pointer;
  2426. }
  2427.  
  2428. .swiper-pagination-bullet-active {
  2429.   opacity: 1;
  2430.   background: #007aff;
  2431. }
  2432.  
  2433. .swiper-container-vertical > .swiper-pagination-bullets {
  2434.   right: 10px;
  2435.   top: 50%;
  2436.   transform: translate3d(0, -50%, 0);
  2437.  
  2438.   .swiper-pagination-bullet {
  2439.     margin: 6px 0;
  2440.     display: block;
  2441.   }
  2442.  
  2443.   &.swiper-pagination-bullets-dynamic {
  2444.     top: 50%;
  2445.     transform: translateY(-50%);
  2446.     width: 8px;
  2447.  
  2448.     .swiper-pagination-bullet {
  2449.       display: inline-block;
  2450.       transition: .2s top,.2s -webkit-transform;
  2451.       transition: .2s transform,.2s top;
  2452.       transition: .2s transform,.2s top,.2s -webkit-transform;
  2453.     }
  2454.   }
  2455. }
  2456.  
  2457. .swiper-container-horizontal {
  2458.   > .swiper-pagination-bullets {
  2459.     .swiper-pagination-bullet {
  2460.       margin: 0 4px;
  2461.     }
  2462.  
  2463.     &.swiper-pagination-bullets-dynamic {
  2464.       left: 50%;
  2465.       transform: translateX(-50%);
  2466.       white-space: nowrap;
  2467.  
  2468.       .swiper-pagination-bullet {
  2469.         transition: .2s left,.2s -webkit-transform;
  2470.         transition: .2s transform,.2s left;
  2471.         transition: .2s transform,.2s left,.2s -webkit-transform;
  2472.       }
  2473.     }
  2474.   }
  2475.  
  2476.   &.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  2477.     transition: .2s right,.2s -webkit-transform;
  2478.     transition: .2s transform,.2s right;
  2479.     transition: .2s transform,.2s right,.2s -webkit-transform;
  2480.   }
  2481. }
  2482.  
  2483. .swiper-pagination-progressbar {
  2484.   background: rgba(0, 0, 0, 0.25);
  2485.   position: absolute;
  2486.  
  2487.   .swiper-pagination-progressbar-fill {
  2488.     background: #007aff;
  2489.     position: absolute;
  2490.     left: 0;
  2491.     top: 0;
  2492.     width: 100%;
  2493.     height: 100%;
  2494.     transform: scale(0);
  2495.     transform-origin: left top;
  2496.   }
  2497. }
  2498.  
  2499. .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  2500.   transform-origin: right top;
  2501. }
  2502.  
  2503. .swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  2504.   width: 100%;
  2505.   height: 4px;
  2506.   left: 0;
  2507.   top: 0;
  2508. }
  2509.  
  2510. .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical > .swiper-pagination-progressbar {
  2511.   width: 4px;
  2512.   height: 100%;
  2513.   left: 0;
  2514.   top: 0;
  2515. }
  2516.  
  2517. .swiper-pagination-white .swiper-pagination-bullet-active {
  2518.   background: #fff;
  2519. }
  2520.  
  2521. .swiper-pagination-progressbar.swiper-pagination-white {
  2522.   background: rgba(255, 255, 255, 0.25);
  2523.  
  2524.   .swiper-pagination-progressbar-fill {
  2525.     background: #fff;
  2526.   }
  2527. }
  2528.  
  2529. .swiper-pagination-black .swiper-pagination-bullet-active {
  2530.   background: #000;
  2531. }
  2532.  
  2533. .swiper-pagination-progressbar.swiper-pagination-black {
  2534.   background: rgba(0, 0, 0, 0.25);
  2535.  
  2536.   .swiper-pagination-progressbar-fill {
  2537.     background: #000;
  2538.   }
  2539. }
  2540.  
  2541. .swiper-pagination-lock {
  2542.   display: none;
  2543. }
  2544.  
  2545. .swiper-scrollbar {
  2546.   border-radius: 10px;
  2547.   position: relative;
  2548.   -ms-touch-action: none;
  2549.   background: rgba(0, 0, 0, 0.1);
  2550. }
  2551.  
  2552. .swiper-container-horizontal > .swiper-scrollbar {
  2553.   position: absolute;
  2554.   left: 1%;
  2555.   bottom: 3px;
  2556.   z-index: 50;
  2557.   height: 5px;
  2558.   width: 98%;
  2559. }
  2560.  
  2561. .swiper-container-vertical > .swiper-scrollbar {
  2562.   position: absolute;
  2563.   right: 3px;
  2564.   top: 1%;
  2565.   z-index: 50;
  2566.   width: 5px;
  2567.   height: 98%;
  2568. }
  2569.  
  2570. .swiper-scrollbar-drag {
  2571.   height: 100%;
  2572.   width: 100%;
  2573.   position: relative;
  2574.   background: rgba(0, 0, 0, 0.5);
  2575.   border-radius: 10px;
  2576.   left: 0;
  2577.   top: 0;
  2578. }
  2579.  
  2580. .swiper-scrollbar-cursor-drag {
  2581.   cursor: move;
  2582. }
  2583.  
  2584. .swiper-scrollbar-lock {
  2585.   display: none;
  2586. }
  2587.  
  2588. .swiper-zoom-container {
  2589.   width: 100%;
  2590.   height: 100%;
  2591.   display: flex;
  2592.   justify-content: center;
  2593.   align-items: center;
  2594.   text-align: center;
  2595.  
  2596.   > {
  2597.     canvas, img, svg {
  2598.       max-width: 100%;
  2599.       max-height: 100%;
  2600.       -o-object-fit: contain;
  2601.       object-fit: contain;
  2602.     }
  2603.   }
  2604. }
  2605.  
  2606. .swiper-slide-zoomed {
  2607.   cursor: move;
  2608. }
  2609.  
  2610. .swiper-lazy-preloader {
  2611.   width: 42px;
  2612.   height: 42px;
  2613.   position: absolute;
  2614.   left: 50%;
  2615.   top: 50%;
  2616.   margin-left: -21px;
  2617.   margin-top: -21px;
  2618.   z-index: 10;
  2619.   transform-origin: 50%;
  2620.   -webkit-animation: 1s steps(12, end) infinite swiper-preloader-spin;
  2621.   animation: 1s steps(12, end) infinite swiper-preloader-spin;
  2622.  
  2623.   &:after {
  2624.     display: block;
  2625.     content: '';
  2626.     width: 100%;
  2627.     height: 100%;
  2628.     background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  2629.     background-position: 50%;
  2630.     background-size: 100%;
  2631.     background-repeat: no-repeat;
  2632.   }
  2633. }
  2634.  
  2635. .swiper-lazy-preloader-white:after {
  2636.   background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  2637. }
  2638.  
  2639. @-webkit-keyframes swiper-preloader-spin {
  2640.   100% {
  2641.     transform: rotate(360deg);
  2642.   }
  2643. }
  2644.  
  2645. @keyframes swiper-preloader-spin {
  2646.   100% {
  2647.     transform: rotate(360deg);
  2648.   }
  2649. }
  2650.  
  2651. .swiper-container .swiper-notification {
  2652.   position: absolute;
  2653.   left: 0;
  2654.   top: 0;
  2655.   pointer-events: none;
  2656.   opacity: 0;
  2657.   z-index: -1000;
  2658. }
  2659.  
  2660. .swiper-container-fade {
  2661.   &.swiper-container-free-mode .swiper-slide {
  2662.     transition-timing-function: ease-out;
  2663.   }
  2664.  
  2665.   .swiper-slide {
  2666.     pointer-events: none;
  2667.     transition-property: opacity;
  2668.  
  2669.     .swiper-slide {
  2670.       pointer-events: none;
  2671.     }
  2672.   }
  2673.  
  2674.   .swiper-slide-active {
  2675.     pointer-events: auto;
  2676.  
  2677.     .swiper-slide-active {
  2678.       pointer-events: auto;
  2679.     }
  2680.   }
  2681. }
  2682.  
  2683. .swiper-container-cube {
  2684.   overflow: visible;
  2685.  
  2686.   .swiper-slide {
  2687.     pointer-events: none;
  2688.     -webkit-backface-visibility: hidden;
  2689.     backface-visibility: hidden;
  2690.     z-index: 1;
  2691.     visibility: hidden;
  2692.     transform-origin: 0 0;
  2693.     width: 100%;
  2694.     height: 100%;
  2695.  
  2696.     .swiper-slide {
  2697.       pointer-events: none;
  2698.     }
  2699.   }
  2700.  
  2701.   &.swiper-container-rtl .swiper-slide {
  2702.     transform-origin: 100% 0;
  2703.   }
  2704.  
  2705.   .swiper-slide-active {
  2706.     pointer-events: auto;
  2707.  
  2708.     .swiper-slide-active {
  2709.       pointer-events: auto;
  2710.     }
  2711.  
  2712.     pointer-events: auto;
  2713.     visibility: visible;
  2714.   }
  2715.  
  2716.   .swiper-slide-next {
  2717.     pointer-events: auto;
  2718.     visibility: visible;
  2719.  
  2720.     + .swiper-slide {
  2721.       pointer-events: auto;
  2722.       visibility: visible;
  2723.     }
  2724.   }
  2725.  
  2726.   .swiper-slide-prev {
  2727.     pointer-events: auto;
  2728.     visibility: visible;
  2729.   }
  2730.  
  2731.   .swiper-slide-shadow-bottom, .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top {
  2732.     z-index: 0;
  2733.     -webkit-backface-visibility: hidden;
  2734.     backface-visibility: hidden;
  2735.   }
  2736.  
  2737.   .swiper-cube-shadow {
  2738.     position: absolute;
  2739.     left: 0;
  2740.     bottom: 0;
  2741.     width: 100%;
  2742.     height: 100%;
  2743.     background: #000;
  2744.     opacity: .6;
  2745.     -webkit-filter: blur(50px);
  2746.     filter: blur(50px);
  2747.     z-index: 0;
  2748.   }
  2749. }
  2750.  
  2751. .swiper-container-flip {
  2752.   overflow: visible;
  2753.  
  2754.   .swiper-slide {
  2755.     pointer-events: none;
  2756.     -webkit-backface-visibility: hidden;
  2757.     backface-visibility: hidden;
  2758.     z-index: 1;
  2759.  
  2760.     .swiper-slide {
  2761.       pointer-events: none;
  2762.     }
  2763.   }
  2764.  
  2765.   .swiper-slide-active {
  2766.     pointer-events: auto;
  2767.  
  2768.     .swiper-slide-active {
  2769.       pointer-events: auto;
  2770.     }
  2771.   }
  2772.  
  2773.   .swiper-slide-shadow-bottom, .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top {
  2774.     z-index: 0;
  2775.     -webkit-backface-visibility: hidden;
  2776.     backface-visibility: hidden;
  2777.   }
  2778. }
  2779.  
  2780. .swiper-container-coverflow .swiper-wrapper {
  2781.   -ms-perspective: 1200px;
  2782. }
  2783.  
  2784. html {
  2785.   height: 100%;
  2786. }
  2787.  
  2788. body {
  2789.   height: 100%;
  2790.   margin: 0;
  2791.   padding: 0;
  2792.   font-family: Roboto,sans-serif;
  2793.   font-size: 14px;
  2794.   line-height: 1.5;
  2795. }
  2796.  
  2797. * {
  2798.   margin: 0;
  2799.   padding: 0;
  2800. }
  2801.  
  2802. a {
  2803.   outline: 0;
  2804. }
  2805.  
  2806. .h-100 {
  2807.   height: 100% !important;
  2808. }
  2809.  
  2810. .w-100 {
  2811.   width: 100% !important;
  2812. }
  2813.  
  2814. .mw-100 {
  2815.   max-width: 100%;
  2816. }
  2817.  
  2818. .fw-300 {
  2819.   font-weight: 300;
  2820. }
  2821.  
  2822. .fw-400 {
  2823.   font-weight: 400;
  2824. }
  2825.  
  2826. .fw-500 {
  2827.   font-weight: 500;
  2828. }
  2829.  
  2830. .lh {
  2831.   line-height: 27px;
  2832. }
  2833.  
  2834. .theme-container {
  2835.   max-width: 1300px;
  2836.   margin: 0 auto;
  2837. }
  2838.  
  2839. .light-block.mat-card {
  2840.   background: rgba(0, 0, 0, 0.03) !important;
  2841.   box-shadow: none !important;
  2842. }
  2843.  
  2844. .transition {
  2845.   transition: .3s;
  2846. }
  2847.  
  2848. .text-truncate {
  2849.   white-space: nowrap;
  2850.   text-overflow: ellipsis;
  2851.   overflow: hidden !important;
  2852. }
  2853.  
  2854. .text-center {
  2855.   text-align: center;
  2856. }
  2857.  
  2858. .text-right {
  2859.   text-align: right;
  2860. }
  2861.  
  2862. .divider {
  2863.   border-top: 1px solid rgba(204, 204, 204, 0.6);
  2864. }
  2865.  
  2866. .mat-icon-button .mat-icon.mat-icon-xs, .mat-icon.mat-icon-xs {
  2867.   font-size: 14px;
  2868.   line-height: 14px;
  2869.   height: 14px;
  2870.   width: 14px;
  2871.   vertical-align: middle;
  2872. }
  2873.  
  2874. .mat-icon-button .mat-icon.mat-icon-sm, .mat-icon.mat-icon-sm, .mat-nav-list .mat-list-item .mat-list-icon.mat-icon-sm {
  2875.   font-size: 18px;
  2876.   line-height: 18px;
  2877.   height: 18px;
  2878.   width: 18px;
  2879.   vertical-align: middle;
  2880. }
  2881.  
  2882. .mat-icon-button .mat-icon.mat-icon-lg, .mat-icon.mat-icon-lg {
  2883.   font-size: 36px;
  2884.   line-height: 36px;
  2885.   height: 36px;
  2886.   width: 36px;
  2887.   vertical-align: middle;
  2888. }
  2889.  
  2890. .mat-icon-button .mat-icon.mat-icon-xlg {
  2891.   font-size: 48px;
  2892.   line-height: 48px;
  2893.   height: 48px;
  2894.   width: 48px;
  2895.   vertical-align: middle;
  2896. }
  2897.  
  2898. .mat-icon {
  2899.   &.mat-icon-xlg {
  2900.     font-size: 48px;
  2901.     line-height: 48px;
  2902.     height: 48px;
  2903.     width: 48px;
  2904.     vertical-align: middle;
  2905.   }
  2906.  
  2907.   &.caret {
  2908.     width: 14px;
  2909.   }
  2910. }
  2911.  
  2912. .mat-button.flex-row-button .mat-button-wrapper {
  2913.   display: flex;
  2914.   flex-direction: row;
  2915.   align-items: center;
  2916. }
  2917.  
  2918. .mat-button-wrapper {
  2919.   pointer-events: none;
  2920. }
  2921.  
  2922. .mat-list.reviews .mat-list-item .mat-list-item-content {
  2923.   align-items: start;
  2924. }
  2925.  
  2926. .mat-step-text-label {
  2927.   text-transform: uppercase;
  2928. }
  2929.  
  2930. .mat-tab-label-content {
  2931.   font-size: 16px;
  2932. }
  2933.  
  2934. .mat-header-row, .mat-row {
  2935.   border-bottom-color: rgba(0, 0, 0, 0.12);
  2936. }
  2937.  
  2938. .filter-sidenav .mat-drawer-inner-container {
  2939.   height: auto;
  2940.   padding: 2px;
  2941.   box-sizing: border-box;
  2942.  
  2943.   .mat-expansion-panel {
  2944.     border-radius: 0 !important;
  2945.   }
  2946. }
  2947.  
  2948. .app-dropdown .mat-menu-item {
  2949.   height: 36px;
  2950.   line-height: 36px;
  2951.   font-size: 14px;
  2952. }
  2953.  
  2954. .account-icon {
  2955.   margin-top: -2px;
  2956.   margin-right: 2px;
  2957. }
  2958.  
  2959. .app-dropdown.account .mat-menu-content {
  2960.   padding: 0;
  2961.  
  2962.   .user-info {
  2963.     padding: 16px;
  2964.  
  2965.     img {
  2966.       margin-right: 16px;
  2967.       border-radius: 3px;
  2968.     }
  2969.  
  2970.     .mat-icon {
  2971.       margin-top: -2px;
  2972.       color: #fbc02d;
  2973.     }
  2974.   }
  2975. }
  2976.  
  2977. .categories-dropdown {
  2978.   &.mat-menu-panel {
  2979.     max-height: 350px;
  2980.   }
  2981.  
  2982.   .mat-menu-item {
  2983.     height: 24px;
  2984.     line-height: 24px;
  2985.     font-size: 14px;
  2986.   }
  2987. }
  2988.  
  2989. .sub-category {
  2990.   button {
  2991.     padding-left: 30px;
  2992.   }
  2993.  
  2994.   .sub-category button {
  2995.     padding-left: 50px;
  2996.   }
  2997. }
  2998.  
  2999. .p-0 {
  3000.   padding: 0 !important;
  3001. }
  3002.  
  3003. .p-1 {
  3004.   padding: 10px !important;
  3005. }
  3006.  
  3007. .p-2 {
  3008.   padding: 20px !important;
  3009. }
  3010.  
  3011. .p-3 {
  3012.   padding: 30px !important;
  3013. }
  3014.  
  3015. .py-1 {
  3016.   padding: 10px 0 !important;
  3017. }
  3018.  
  3019. .py-2 {
  3020.   padding: 20px 0 !important;
  3021. }
  3022.  
  3023. .py-3 {
  3024.   padding: 30px 0 !important;
  3025. }
  3026.  
  3027. .py-4 {
  3028.   padding: 40px 0 !important;
  3029. }
  3030.  
  3031. .py-5 {
  3032.   padding: 50px 0 !important;
  3033. }
  3034.  
  3035. .px-1 {
  3036.   padding: 0 10px !important;
  3037. }
  3038.  
  3039. .px-2 {
  3040.   padding: 0 20px !important;
  3041. }
  3042.  
  3043. .px-3 {
  3044.   padding: 0 30px !important;
  3045. }
  3046.  
  3047. .px-4 {
  3048.   padding: 0 40px !important;
  3049. }
  3050.  
  3051. .px-5 {
  3052.   padding: 0 50px !important;
  3053. }
  3054.  
  3055. .pl-3 {
  3056.   padding-left: 30px;
  3057. }
  3058.  
  3059. .m-0 {
  3060.   margin: 0 !important;
  3061. }
  3062.  
  3063. .mt-1 {
  3064.   margin-top: 10px !important;
  3065. }
  3066.  
  3067. .mt-2 {
  3068.   margin-top: 20px !important;
  3069. }
  3070.  
  3071. .mt-3 {
  3072.   margin-top: 30px !important;
  3073. }
  3074.  
  3075. .mr-1 {
  3076.   margin-right: 10px !important;
  3077. }
  3078.  
  3079. .d-block {
  3080.   display: block;
  3081. }
  3082.  
  3083. .info-bar {
  3084.   margin-top: 30px;
  3085.  
  3086.   .mat-card {
  3087.     height: 100px;
  3088.  
  3089.     .content {
  3090.       margin-left: 10px;
  3091.  
  3092.       p {
  3093.         font-weight: 500;
  3094.       }
  3095.  
  3096.       span {
  3097.         font-size: 13px;
  3098.       }
  3099.     }
  3100.   }
  3101. }
  3102.  
  3103. .social-icon {
  3104.   width: 48px;
  3105.   height: 48px;
  3106.   cursor: pointer;
  3107.   fill: #8f8f8f;
  3108.   outline: 0;
  3109. }
  3110.  
  3111. .top-toolbar.mat-toolbar-row {
  3112.   height: 32px;
  3113.   font-size: 13px;
  3114.  
  3115.   .sidenav-toggle {
  3116.     height: 31px;
  3117.     line-height: 31px;
  3118.     min-width: 24px;
  3119.     padding: 0;
  3120.     border-radius: 0;
  3121.   }
  3122.  
  3123.   .top-menu {
  3124.     margin-right: -16px;
  3125.     text-transform: uppercase;
  3126.  
  3127.     a {
  3128.       text-decoration: none;
  3129.       font-weight: 400;
  3130.       font-size: 13px;
  3131.       line-height: 31px;
  3132.       padding: 0 10px;
  3133.       min-width: 70px;
  3134.       border-radius: 0;
  3135.  
  3136.       &.mobile-menu-icon {
  3137.         min-width: 36px;
  3138.       }
  3139.     }
  3140.  
  3141.     .mat-icon.more {
  3142.       height: 28px;
  3143.     }
  3144.   }
  3145. }
  3146.  
  3147. .flag-menu-title {
  3148.   vertical-align: top !important;
  3149.   margin-left: 3px;
  3150. }
  3151.  
  3152. .top-menu-dropdown .mat-menu-item img {
  3153.   vertical-align: middle;
  3154.   margin-right: 8px;
  3155. }
  3156.  
  3157. .cart-dropdown.mat-menu-panel {
  3158.   padding: 6px 14px;
  3159.   font-size: 13px;
  3160.  
  3161.   .mat-list {
  3162.     padding: 0;
  3163.  
  3164.     .mat-list-item {
  3165.       .mat-list-item-content {
  3166.         padding: 0;
  3167.  
  3168.         img {
  3169.           width: 70px;
  3170.           margin-left: 10px;
  3171.         }
  3172.       }
  3173.  
  3174.       .mat-list-text > * {
  3175.         font-size: 14px;
  3176.         font-weight: 500;
  3177.       }
  3178.  
  3179.       .mat-line:nth-child(n+2) {
  3180.         font-size: 13px;
  3181.         font-weight: 400;
  3182.       }
  3183.     }
  3184.   }
  3185.  
  3186.   .cart-dropdown-footer {
  3187.     font-size: 14px;
  3188.   }
  3189. }
  3190.  
  3191. .logo-toolbar.mat-toolbar-row {
  3192.   height: 104px;
  3193. }
  3194.  
  3195. .logo {
  3196.   font-size: 28px;
  3197.   font-weight: 900;
  3198.   text-transform: uppercase;
  3199.   text-decoration: none;
  3200.   color: inherit;
  3201. }
  3202.  
  3203. .search-form {
  3204.   border-radius: 22px;
  3205.   overflow: hidden;
  3206.  
  3207.   .categories {
  3208.     height: 40px;
  3209.     width: 180px;
  3210.     border-radius: 0;
  3211.   }
  3212.  
  3213.   input[type=text] {
  3214.     border: 0;
  3215.     outline: 0;
  3216.     padding: 0 34px 0 12px;
  3217.     border-left: 1px solid #ccc;
  3218.   }
  3219.  
  3220.   .search-btn {
  3221.     margin-left: -20px;
  3222.     background: #fff !important;
  3223.     box-shadow: none !important;
  3224.   }
  3225. }
  3226.  
  3227. .search-dropdown.mat-menu-panel {
  3228.   border-radius: 26px;
  3229.   max-width: 100%;
  3230.  
  3231.   .mat-menu-content {
  3232.     padding: 0;
  3233.   }
  3234. }
  3235.  
  3236. .top-cart span {
  3237.   font-size: 13px;
  3238.   font-weight: 400;
  3239.   line-height: 1.2;
  3240. }
  3241.  
  3242. .top-navbar.mat-toolbar {
  3243.   height: 48px;
  3244.   padding: 0;
  3245.  
  3246.   a {
  3247.     min-width: 70px;
  3248.     border-radius: 0;
  3249.     text-transform: uppercase;
  3250.     padding: 6px 16px;
  3251.   }
  3252. }
  3253.  
  3254. .cdk-overlay-pane.mega-menu-pane {
  3255.   left: 0 !important;
  3256.   width: 100%;
  3257.  
  3258.   .mat-menu-panel {
  3259.     width: 100%;
  3260.     max-width: none;
  3261.     border-radius: 0;
  3262.  
  3263.     .mat-menu-content {
  3264.       padding: 0;
  3265.     }
  3266.   }
  3267.  
  3268.   .mega-menu-widget {
  3269.     position: relative;
  3270.  
  3271.     button {
  3272.       position: absolute;
  3273.       top: 10px;
  3274.       left: 10px;
  3275.       font-weight: 400;
  3276.     }
  3277.  
  3278.     .mat-chip-list {
  3279.       position: absolute;
  3280.       bottom: 10px;
  3281.       left: 10px;
  3282.     }
  3283.   }
  3284. }
  3285.  
  3286. button.swipe-arrow {
  3287.   position: absolute;
  3288.   top: 50%;
  3289.   margin-top: -22px;
  3290.   z-index: 10;
  3291.   background-image: none;
  3292. }
  3293.  
  3294. .swiper-pagination.white .swiper-pagination-bullet {
  3295.   background: #fff;
  3296. }
  3297.  
  3298. .swiper-pagination-bullet-active {
  3299.   width: 12px;
  3300.   height: 12px;
  3301.   vertical-align: -2px;
  3302. }
  3303.  
  3304. .product-item {
  3305.   position: relative;
  3306.  
  3307.   .mat-chip-list {
  3308.     position: absolute;
  3309.     top: 10px;
  3310.     right: 10px;
  3311.  
  3312.     &.list-view {
  3313.       left: 10px;
  3314.     }
  3315.   }
  3316.  
  3317.   .image-link {
  3318.     display: block;
  3319.   }
  3320.  
  3321.   img {
  3322.     max-width: 100%;
  3323.     margin-bottom: 12px;
  3324.   }
  3325.  
  3326.   .category {
  3327.     margin-bottom: 4px;
  3328.   }
  3329.  
  3330.   .title {
  3331.     display: block;
  3332.     color: inherit;
  3333.     text-decoration: none;
  3334.     font-weight: 500;
  3335.     font-size: 18px;
  3336.   }
  3337.  
  3338.   .prices {
  3339.     margin: 12px 0;
  3340.  
  3341.     .old-price {
  3342.       text-decoration: line-through;
  3343.       height: 15px;
  3344.     }
  3345.  
  3346.     .new-price {
  3347.       font-size: 16px;
  3348.       font-weight: 500;
  3349.     }
  3350.   }
  3351.  
  3352.   .icons {
  3353.     margin-top: 18px;
  3354.   }
  3355. }
  3356.  
  3357. .old-price {
  3358.   text-decoration: line-through;
  3359. }
  3360.  
  3361. .back-to-top {
  3362.   position: fixed;
  3363.   width: 40px;
  3364.   height: 40px;
  3365.   cursor: pointer;
  3366.   z-index: 999999;
  3367.   right: 20px;
  3368.   bottom: 20px;
  3369.   opacity: .5;
  3370.   color: #fff;
  3371.   background-color: rgba(0, 0, 0, 0.75);
  3372.   border-radius: 4px;
  3373.  
  3374.   &:hover {
  3375.     opacity: .9;
  3376.   }
  3377. }
  3378.  
  3379. @media (max-width: 575px) {
  3380.   .top-toolbar.mat-toolbar-row {
  3381.     padding: 0;
  3382.  
  3383.     .top-menu {
  3384.       margin-right: 0;
  3385.  
  3386.       a {
  3387.         min-width: 56px;
  3388.       }
  3389.     }
  3390.  
  3391.     .sidenav-toggle {
  3392.       min-width: 52px;
  3393.     }
  3394.   }
  3395.  
  3396.   .search-form {
  3397.     input[type=text] {
  3398.       width: 160px;
  3399.     }
  3400.  
  3401.     .categories {
  3402.       width: 140px;
  3403.     }
  3404.   }
  3405. }
  3406.  
  3407. @media (min-width: 576px) and (max-width: 767px) {
  3408.   .top-toolbar.mat-toolbar-row {
  3409.     padding: 0;
  3410.  
  3411.     .top-menu {
  3412.       margin-right: 0;
  3413.     }
  3414.  
  3415.     .sidenav-toggle {
  3416.       min-width: 52px;
  3417.     }
  3418.   }
  3419. }
  3420.  
  3421. @media (min-width: 768px) and (max-width: 991px) {
  3422.   .top-toolbar.mat-toolbar-row {
  3423.     padding: 0;
  3424.  
  3425.     .top-menu {
  3426.       margin-right: 0;
  3427.     }
  3428.  
  3429.     .sidenav-toggle {
  3430.       min-width: 52px;
  3431.     }
  3432.   }
  3433. }
  3434.  
  3435. ::-webkit-scrollbar {
  3436.   width: 8px;
  3437.   height: 8px;
  3438. }
  3439.  
  3440. ::-webkit-scrollbar-button {
  3441.   width: 0;
  3442.   height: 0;
  3443. }
  3444.  
  3445. ::-webkit-scrollbar-thumb {
  3446.   background: #e1e1e1;
  3447.   border: 0 #fff;
  3448.   border-radius: 0;
  3449.  
  3450.   &:hover {
  3451.     background: #ccc;
  3452.   }
  3453.  
  3454.   &:active {
  3455.     background: #888;
  3456.   }
  3457. }
  3458.  
  3459. ::-webkit-scrollbar-track {
  3460.   background: #666;
  3461.   border: 0 #fff;
  3462.   border-radius: 0;
  3463.  
  3464.   &:hover {
  3465.     background: #666;
  3466.   }
  3467.  
  3468.   &:active {
  3469.     background: #333;
  3470.   }
  3471. }
  3472.  
  3473. ::-webkit-scrollbar-corner {
  3474.   background: 0 0;
  3475. }
  3476.  
  3477. .ps {
  3478.   touch-action: auto;
  3479.   overflow: hidden !important;
  3480.   -ms-overflow-style: none;
  3481.   position: relative;
  3482. }
  3483.  
  3484. .ps__rail-x {
  3485.   display: none;
  3486.   opacity: 0;
  3487.   transition: background-color .2s linear,opacity .2s linear;
  3488.   -webkit-transition: background-color .2s linear,opacity .2s linear;
  3489.   height: 7px;
  3490.   bottom: 0;
  3491.   position: absolute;
  3492. }
  3493.  
  3494. .ps__rail-y {
  3495.   display: none;
  3496.   opacity: 0;
  3497.   transition: background-color .2s linear,opacity .2s linear;
  3498.   -webkit-transition: background-color .2s linear,opacity .2s linear;
  3499.   width: 7px;
  3500.   right: 0;
  3501.   left: auto !important;
  3502.   position: absolute;
  3503. }
  3504.  
  3505. .ps--active-x > .ps__rail-x, .ps--active-y > .ps__rail-y {
  3506.   display: block;
  3507.   background-color: transparent;
  3508. }
  3509.  
  3510. .ps--focus > {
  3511.   .ps__rail-x, .ps__rail-y {
  3512.     opacity: .6;
  3513.   }
  3514. }
  3515.  
  3516. .ps--scrolling-x > .ps__rail-x, .ps--scrolling-y > .ps__rail-y {
  3517.   opacity: .6;
  3518. }
  3519.  
  3520. .ps:hover > {
  3521.   .ps__rail-x, .ps__rail-y {
  3522.     opacity: .6;
  3523.   }
  3524. }
  3525.  
  3526. .ps__rail-x {
  3527.   &:focus, &:hover {
  3528.     background-color: #eee;
  3529.     opacity: .9;
  3530.   }
  3531. }
  3532.  
  3533. .ps__rail-y {
  3534.   &:focus, &:hover {
  3535.     background-color: #eee;
  3536.     opacity: .9;
  3537.   }
  3538. }
  3539.  
  3540. .ps__thumb-x {
  3541.   background-color: #aaa;
  3542.   border-radius: 6px;
  3543.   transition: background-color .2s linear,height .2s ease-in-out;
  3544.   -webkit-transition: background-color .2s linear,height .2s ease-in-out;
  3545.   height: 4px;
  3546.   bottom: 1px;
  3547.   position: absolute;
  3548. }
  3549.  
  3550. .ps__thumb-y {
  3551.   background-color: #aaa;
  3552.   border-radius: 6px;
  3553.   transition: background-color .2s linear,width .2s ease-in-out;
  3554.   -webkit-transition: background-color .2s linear,width .2s ease-in-out;
  3555.   width: 4px;
  3556.   right: 1px;
  3557.   position: absolute;
  3558. }
  3559.  
  3560. .ps__rail-x {
  3561.   &:focus > .ps__thumb-x, &:hover > .ps__thumb-x {
  3562.     background-color: #999;
  3563.     height: 7px;
  3564.   }
  3565. }
  3566.  
  3567. .ps__rail-y {
  3568.   &:focus > .ps__thumb-y, &:hover > .ps__thumb-y {
  3569.     background-color: #999;
  3570.     width: 7px;
  3571.   }
  3572. }
  3573.  
  3574. @supports (-ms-overflow-style: none) {
  3575.   .ps {
  3576.     overflow: auto !important;
  3577.   }
  3578. }
  3579.  
  3580. @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  3581.   .ps {
  3582.     overflow: auto !important;
  3583.   }
  3584. }
  3585.  
  3586. @media (min-width: 1380px) {
  3587.   .theme-container {
  3588.     max-width: 1400px;
  3589.   }
  3590. }
  3591.  
  3592. .sidenav .mat-drawer-inner-container {
  3593.   overflow-x: hidden;
  3594. }
  3595.  
  3596. .mat-badge-content {
  3597.   font-weight: 600;
  3598.   font-size: 12px;
  3599.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3600. }
  3601.  
  3602. .mat-badge-small .mat-badge-content {
  3603.   font-size: 9px;
  3604. }
  3605.  
  3606. .mat-badge-large .mat-badge-content {
  3607.   font-size: 24px;
  3608. }
  3609.  
  3610. .mat-h1, .mat-headline, .mat-typography h1 {
  3611.   font: 400 24px/32px Roboto,"Helvetica Neue",sans-serif;
  3612.   margin: 0 0 16px;
  3613. }
  3614.  
  3615. .mat-h2, .mat-title, .mat-typography h2 {
  3616.   font: 500 20px/32px Roboto,"Helvetica Neue",sans-serif;
  3617.   margin: 0 0 16px;
  3618. }
  3619.  
  3620. .mat-h3, .mat-subheading-2, .mat-typography h3 {
  3621.   font: 400 16px/28px Roboto,"Helvetica Neue",sans-serif;
  3622.   margin: 0 0 16px;
  3623. }
  3624.  
  3625. .mat-h4, .mat-subheading-1, .mat-typography h4 {
  3626.   font: 400 15px/24px Roboto,"Helvetica Neue",sans-serif;
  3627.   margin: 0 0 16px;
  3628. }
  3629.  
  3630. .mat-h5, .mat-typography h5 {
  3631.   font: 400 (calc(14px * .83) / 20px) Roboto, "Helvetica Neue", sans-serif;
  3632.   margin: 0 0 12px;
  3633. }
  3634.  
  3635. .mat-h6, .mat-typography h6 {
  3636.   font: 400 (calc(14px * .67) / 20px) Roboto, "Helvetica Neue", sans-serif;
  3637.   margin: 0 0 12px;
  3638. }
  3639.  
  3640. .mat-body-2, .mat-body-strong {
  3641.   font: 500 14px/24px Roboto,"Helvetica Neue",sans-serif;
  3642. }
  3643.  
  3644. .mat-body, .mat-body-1, .mat-typography {
  3645.   font: 400 14px/20px Roboto,"Helvetica Neue",sans-serif;
  3646. }
  3647.  
  3648. .mat-body p, .mat-body-1 p, .mat-typography p {
  3649.   margin: 0 0 12px;
  3650. }
  3651.  
  3652. .mat-caption, .mat-small {
  3653.   font: 400 12px/20px Roboto,"Helvetica Neue",sans-serif;
  3654. }
  3655.  
  3656. .mat-display-4, .mat-typography .mat-display-4 {
  3657.   font: 300 112px/112px Roboto,"Helvetica Neue",sans-serif;
  3658.   letter-spacing: -.05em;
  3659.   margin: 0 0 56px;
  3660. }
  3661.  
  3662. .mat-display-3, .mat-typography .mat-display-3 {
  3663.   font: 400 56px/56px Roboto,"Helvetica Neue",sans-serif;
  3664.   letter-spacing: -.02em;
  3665.   margin: 0 0 64px;
  3666. }
  3667.  
  3668. .mat-display-2, .mat-typography .mat-display-2 {
  3669.   font: 400 45px/48px Roboto,"Helvetica Neue",sans-serif;
  3670.   letter-spacing: -.005em;
  3671.   margin: 0 0 64px;
  3672. }
  3673.  
  3674. .mat-display-1, .mat-typography .mat-display-1 {
  3675.   font: 400 34px/40px Roboto,"Helvetica Neue",sans-serif;
  3676.   margin: 0 0 64px;
  3677. }
  3678.  
  3679. .mat-bottom-sheet-container {
  3680.   font: 400 14px/20px Roboto,"Helvetica Neue",sans-serif;
  3681. }
  3682.  
  3683. .mat-button, .mat-fab, .mat-flat-button, .mat-icon-button, .mat-mini-fab, .mat-raised-button, .mat-stroked-button {
  3684.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3685.   font-size: 14px;
  3686.   font-weight: 500;
  3687. }
  3688.  
  3689. .mat-button-toggle, .mat-card {
  3690.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3691. }
  3692.  
  3693. .mat-card-title {
  3694.   font-size: 24px;
  3695.   font-weight: 500;
  3696. }
  3697.  
  3698. .mat-card-header .mat-card-title {
  3699.   font-size: 20px;
  3700. }
  3701.  
  3702. .mat-card-content, .mat-card-subtitle {
  3703.   font-size: 14px;
  3704. }
  3705.  
  3706. .mat-checkbox {
  3707.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3708. }
  3709.  
  3710. .mat-checkbox-layout .mat-checkbox-label {
  3711.   line-height: 24px;
  3712. }
  3713.  
  3714. .mat-chip {
  3715.   font-size: 14px;
  3716.   font-weight: 500;
  3717.  
  3718.   .mat-chip-remove.mat-icon, .mat-chip-trailing-icon.mat-icon {
  3719.     font-size: 18px;
  3720.   }
  3721. }
  3722.  
  3723. .mat-table {
  3724.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3725. }
  3726.  
  3727. .mat-header-cell {
  3728.   font-size: 12px;
  3729.   font-weight: 500;
  3730. }
  3731.  
  3732. .mat-cell, .mat-footer-cell {
  3733.   font-size: 14px;
  3734. }
  3735.  
  3736. .mat-calendar {
  3737.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3738. }
  3739.  
  3740. .mat-calendar-body {
  3741.   font-size: 13px;
  3742. }
  3743.  
  3744. .mat-calendar-body-label, .mat-calendar-period-button {
  3745.   font-size: 14px;
  3746.   font-weight: 500;
  3747. }
  3748.  
  3749. .mat-calendar-table-header th {
  3750.   font-size: 11px;
  3751.   font-weight: 400;
  3752. }
  3753.  
  3754. .mat-dialog-title {
  3755.   font: 500 20px/32px Roboto,"Helvetica Neue",sans-serif;
  3756. }
  3757.  
  3758. .mat-expansion-panel-header {
  3759.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3760.   font-size: 15px;
  3761.   font-weight: 400;
  3762. }
  3763.  
  3764. .mat-expansion-panel-content {
  3765.   font: 400 14px/20px Roboto,"Helvetica Neue",sans-serif;
  3766. }
  3767.  
  3768. .mat-form-field {
  3769.   font-size: inherit;
  3770.   font-weight: 400;
  3771.   line-height: 1.125;
  3772.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3773. }
  3774.  
  3775. .mat-form-field-wrapper {
  3776.   padding-bottom: 1.34375em;
  3777. }
  3778.  
  3779. .mat-form-field-prefix .mat-icon, .mat-form-field-suffix .mat-icon {
  3780.   font-size: 150%;
  3781.   line-height: 1.125;
  3782. }
  3783.  
  3784. .mat-form-field-prefix .mat-icon-button, .mat-form-field-suffix .mat-icon-button {
  3785.   height: 1.5em;
  3786.   width: 1.5em;
  3787. }
  3788.  
  3789. .mat-form-field-prefix .mat-icon-button .mat-icon, .mat-form-field-suffix .mat-icon-button .mat-icon {
  3790.   height: 1.125em;
  3791.   line-height: 1.125;
  3792. }
  3793.  
  3794. .mat-form-field-infix {
  3795.   padding: .5em 0;
  3796.   border-top: .84375em solid transparent;
  3797. }
  3798.  
  3799. .mat-form-field-can-float {
  3800.   .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label, &.mat-form-field-should-float .mat-form-field-label {
  3801.     transform: translateY(-1.34375em) scale(0.75);
  3802.     width: 133.3333333333%;
  3803.   }
  3804.  
  3805.   .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {
  3806.     transform: translateY(-1.34374em) scale(0.75);
  3807.     width: 133.3333433333%;
  3808.   }
  3809. }
  3810.  
  3811. .mat-form-field-label-wrapper {
  3812.   top: -.84375em;
  3813.   padding-top: .84375em;
  3814. }
  3815.  
  3816. .mat-form-field-label {
  3817.   top: 1.34375em;
  3818. }
  3819.  
  3820. .mat-form-field-underline {
  3821.   bottom: 1.34375em;
  3822. }
  3823.  
  3824. .mat-form-field-subscript-wrapper {
  3825.   font-size: 75%;
  3826.   margin-top: .6666666667em;
  3827.   top: calc(100% - 1.7916666667em);
  3828. }
  3829.  
  3830. .mat-form-field-appearance-legacy {
  3831.   .mat-form-field-wrapper {
  3832.     padding-bottom: 1.25em;
  3833.   }
  3834.  
  3835.   .mat-form-field-infix {
  3836.     padding: .4375em 0;
  3837.   }
  3838.  
  3839.   &.mat-form-field-can-float {
  3840.     .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label, &.mat-form-field-should-float .mat-form-field-label {
  3841.       transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px);
  3842.       -ms-transform: translateY(-1.28125em) scale(0.75);
  3843.       width: 133.3333333333%;
  3844.     }
  3845.  
  3846.     .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper .mat-form-field-label {
  3847.       transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.00101px);
  3848.       -ms-transform: translateY(-1.28124em) scale(0.75);
  3849.       width: 133.3333433333%;
  3850.     }
  3851.  
  3852.     .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {
  3853.       transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.00102px);
  3854.       -ms-transform: translateY(-1.28123em) scale(0.75);
  3855.       width: 133.3333533333%;
  3856.     }
  3857.   }
  3858.  
  3859.   .mat-form-field-label {
  3860.     top: 1.28125em;
  3861.   }
  3862.  
  3863.   .mat-form-field-underline {
  3864.     bottom: 1.25em;
  3865.   }
  3866.  
  3867.   .mat-form-field-subscript-wrapper {
  3868.     margin-top: .5416666667em;
  3869.     top: calc(100% - 1.6666666667em);
  3870.   }
  3871. }
  3872.  
  3873. @media print {
  3874.   .mat-form-field-appearance-legacy.mat-form-field-can-float {
  3875.     .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label, &.mat-form-field-should-float .mat-form-field-label {
  3876.       transform: translateY(-1.28122em) scale(0.75);
  3877.     }
  3878.  
  3879.     .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-label-wrapper .mat-form-field-label {
  3880.       transform: translateY(-1.28121em) scale(0.75);
  3881.     }
  3882.  
  3883.     .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {
  3884.       transform: translateY(-1.2812em) scale(0.75);
  3885.     }
  3886.   }
  3887. }
  3888.  
  3889. .mat-form-field-appearance-fill {
  3890.   .mat-form-field-infix {
  3891.     padding: .25em 0 .75em;
  3892.   }
  3893.  
  3894.   .mat-form-field-label {
  3895.     top: 1.09375em;
  3896.     margin-top: -.5em;
  3897.   }
  3898.  
  3899.   &.mat-form-field-can-float {
  3900.     .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label, &.mat-form-field-should-float .mat-form-field-label {
  3901.       transform: translateY(-0.59375em) scale(0.75);
  3902.       width: 133.3333333333%;
  3903.     }
  3904.  
  3905.     .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {
  3906.       transform: translateY(-0.59374em) scale(0.75);
  3907.       width: 133.3333433333%;
  3908.     }
  3909.   }
  3910. }
  3911.  
  3912. .mat-form-field-appearance-outline {
  3913.   .mat-form-field-infix {
  3914.     padding: 1em 0;
  3915.   }
  3916.  
  3917.   .mat-form-field-label {
  3918.     top: 1.84375em;
  3919.     margin-top: -.25em;
  3920.   }
  3921.  
  3922.   &.mat-form-field-can-float {
  3923.     .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label, &.mat-form-field-should-float .mat-form-field-label {
  3924.       transform: translateY(-1.59375em) scale(0.75);
  3925.       width: 133.3333333333%;
  3926.     }
  3927.  
  3928.     .mat-input-server[label]:not(:label-shown) + .mat-form-field-label-wrapper .mat-form-field-label {
  3929.       transform: translateY(-1.59374em) scale(0.75);
  3930.       width: 133.3333433333%;
  3931.     }
  3932.   }
  3933. }
  3934.  
  3935. .mat-grid-tile-footer, .mat-grid-tile-header {
  3936.   font-size: 14px;
  3937. }
  3938.  
  3939. .mat-grid-tile-footer .mat-line, .mat-grid-tile-header .mat-line {
  3940.   white-space: nowrap;
  3941.   overflow: hidden;
  3942.   text-overflow: ellipsis;
  3943.   display: block;
  3944.   box-sizing: border-box;
  3945. }
  3946.  
  3947. .mat-grid-tile-footer .mat-line:nth-child(n+2), .mat-grid-tile-header .mat-line:nth-child(n+2) {
  3948.   font-size: 12px;
  3949. }
  3950.  
  3951. input.mat-input-element {
  3952.   margin-top: -.0625em;
  3953. }
  3954.  
  3955. .mat-menu-item {
  3956.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3957.   font-size: 14px;
  3958.   font-weight: 400;
  3959. }
  3960.  
  3961. .mat-paginator, .mat-paginator-page-size .mat-select-trigger {
  3962.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3963.   font-size: 12px;
  3964. }
  3965.  
  3966. .mat-radio-button, .mat-select {
  3967.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3968. }
  3969.  
  3970. .mat-select-trigger {
  3971.   height: 1.125em;
  3972. }
  3973.  
  3974. .mat-slide-toggle-content {
  3975.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3976. }
  3977.  
  3978. .mat-slider-thumb-label-text {
  3979.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3980.   font-size: 12px;
  3981.   font-weight: 500;
  3982. }
  3983.  
  3984. .mat-stepper-horizontal, .mat-stepper-vertical {
  3985.   font-family: Roboto,"Helvetica Neue",sans-serif;
  3986. }
  3987.  
  3988. .mat-step-label {
  3989.   font-size: 14px;
  3990.   font-weight: 400;
  3991. }
  3992.  
  3993. .mat-step-sub-label-error {
  3994.   font-weight: 400;
  3995. }
  3996.  
  3997. .mat-step-label-error {
  3998.   font-size: 14px;
  3999. }
  4000.  
  4001. .mat-step-label-selected {
  4002.   font-size: 14px;
  4003.   font-weight: 500;
  4004. }
  4005.  
  4006. .mat-tab-group {
  4007.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4008. }
  4009.  
  4010. .mat-tab-label, .mat-tab-link {
  4011.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4012.   font-size: 14px;
  4013.   font-weight: 500;
  4014. }
  4015.  
  4016. .mat-toolbar {
  4017.   font: 500 20px/32px Roboto,"Helvetica Neue",sans-serif;
  4018.   margin: 0;
  4019.  
  4020.   h1, h2, h3, h4, h5, h6 {
  4021.     font: 500 20px/32px Roboto,"Helvetica Neue",sans-serif;
  4022.     margin: 0;
  4023.   }
  4024. }
  4025.  
  4026. .mat-tooltip {
  4027.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4028.   font-size: 10px;
  4029.   padding-top: 6px;
  4030.   padding-bottom: 6px;
  4031. }
  4032.  
  4033. .mat-tooltip-handset {
  4034.   font-size: 14px;
  4035.   padding-top: 8px;
  4036.   padding-bottom: 8px;
  4037. }
  4038.  
  4039. .mat-list-item, .mat-list-option {
  4040.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4041. }
  4042.  
  4043. .mat-list-base {
  4044.   .mat-list-item, .mat-list-option {
  4045.     font-size: 16px;
  4046.  
  4047.     .mat-line {
  4048.       white-space: nowrap;
  4049.       overflow: hidden;
  4050.       text-overflow: ellipsis;
  4051.       display: block;
  4052.       box-sizing: border-box;
  4053.  
  4054.       &:nth-child(n+2) {
  4055.         font-size: 14px;
  4056.       }
  4057.     }
  4058.   }
  4059.  
  4060.   .mat-subheader {
  4061.     font-family: Roboto,"Helvetica Neue",sans-serif;
  4062.     font-size: 14px;
  4063.     font-weight: 500;
  4064.   }
  4065.  
  4066.   &[dense] {
  4067.     .mat-list-item, .mat-list-option {
  4068.       font-size: 12px;
  4069.  
  4070.       .mat-line {
  4071.         white-space: nowrap;
  4072.         overflow: hidden;
  4073.         text-overflow: ellipsis;
  4074.         display: block;
  4075.         box-sizing: border-box;
  4076.  
  4077.         &:nth-child(n+2) {
  4078.           font-size: 12px;
  4079.         }
  4080.       }
  4081.     }
  4082.  
  4083.     .mat-subheader {
  4084.       font-family: Roboto,"Helvetica Neue",sans-serif;
  4085.       font-size: 12px;
  4086.       font-weight: 500;
  4087.     }
  4088.   }
  4089. }
  4090.  
  4091. .mat-option {
  4092.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4093.   font-size: 16px;
  4094. }
  4095.  
  4096. .mat-optgroup-label {
  4097.   font: 500 14px/24px Roboto,"Helvetica Neue",sans-serif;
  4098. }
  4099.  
  4100. .mat-simple-snackbar {
  4101.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4102.   font-size: 14px;
  4103. }
  4104.  
  4105. .mat-simple-snackbar-action {
  4106.   line-height: 1;
  4107.   font-family: inherit;
  4108.   font-size: inherit;
  4109.   font-weight: 500;
  4110. }
  4111.  
  4112. .mat-tree {
  4113.   font-family: Roboto,"Helvetica Neue",sans-serif;
  4114. }
  4115.  
  4116. .mat-nested-tree-node, .mat-tree-node {
  4117.   font-weight: 400;
  4118.   font-size: 14px;
  4119. }
  4120.  
  4121. .mat-ripple {
  4122.   overflow: hidden;
  4123.   position: relative;
  4124.  
  4125.   &.mat-ripple-unbounded {
  4126.     overflow: visible;
  4127.   }
  4128. }
  4129.  
  4130. .mat-ripple-element {
  4131.   position: absolute;
  4132.   border-radius: 50%;
  4133.   pointer-events: none;
  4134.   transition: opacity, transform 0s cubic-bezier(0, 0, 0.2, 1);
  4135.   transform: scale(0);
  4136. }
  4137.  
  4138. @media (-ms-high-contrast: active) {
  4139.   .mat-ripple-element {
  4140.     display: none;
  4141.   }
  4142. }
  4143.  
  4144. .cdk-visually-hidden {
  4145.   border: 0;
  4146.   clip: rect(0 0 0 0);
  4147.   height: 1px;
  4148.   margin: -1px;
  4149.   overflow: hidden;
  4150.   padding: 0;
  4151.   position: absolute;
  4152.   width: 1px;
  4153.   outline: 0;
  4154.   -webkit-appearance: none;
  4155.   -moz-appearance: none;
  4156. }
  4157.  
  4158. .cdk-global-overlay-wrapper {
  4159.   pointer-events: none;
  4160.   top: 0;
  4161.   left: 0;
  4162.   height: 100%;
  4163.   width: 100%;
  4164. }
  4165.  
  4166. .cdk-overlay-container {
  4167.   pointer-events: none;
  4168.   top: 0;
  4169.   left: 0;
  4170.   height: 100%;
  4171.   width: 100%;
  4172.   position: fixed;
  4173.   z-index: 1000;
  4174.  
  4175.   &:empty {
  4176.     display: none;
  4177.   }
  4178. }
  4179.  
  4180. .cdk-global-overlay-wrapper {
  4181.   display: flex;
  4182.   position: absolute;
  4183.   z-index: 1000;
  4184. }
  4185.  
  4186. .cdk-overlay-pane {
  4187.   position: absolute;
  4188.   pointer-events: auto;
  4189.   box-sizing: border-box;
  4190.   z-index: 1000;
  4191.   display: flex;
  4192.   max-width: 100%;
  4193.   max-height: 100%;
  4194. }
  4195.  
  4196. .cdk-overlay-backdrop {
  4197.   position: absolute;
  4198.   top: 0;
  4199.   bottom: 0;
  4200.   left: 0;
  4201.   right: 0;
  4202.   z-index: 1000;
  4203.   pointer-events: auto;
  4204.   -webkit-tap-highlight-color: transparent;
  4205.   transition: opacity 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  4206.   opacity: 0;
  4207.  
  4208.   &.cdk-overlay-backdrop-showing {
  4209.     opacity: 1;
  4210.   }
  4211. }
  4212.  
  4213. @media screen and (-ms-high-contrast: active) {
  4214.   .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
  4215.     opacity: .6;
  4216.   }
  4217. }
  4218.  
  4219. .cdk-overlay-dark-backdrop {
  4220.   background: rgba(0, 0, 0, 0.32);
  4221. }
  4222.  
  4223. .cdk-overlay-transparent-backdrop {
  4224.   opacity: 0;
  4225.  
  4226.   &.cdk-overlay-backdrop-showing {
  4227.     opacity: 0;
  4228.   }
  4229. }
  4230.  
  4231. .cdk-overlay-connected-position-bounding-box {
  4232.   position: absolute;
  4233.   z-index: 1000;
  4234.   display: flex;
  4235.   flex-direction: column;
  4236.   min-width: 1px;
  4237.   min-height: 1px;
  4238. }
  4239.  
  4240. .cdk-global-scrollblock {
  4241.   position: fixed;
  4242.   width: 100%;
  4243.   overflow-y: scroll;
  4244. }
  4245.  
  4246. @keyframes cdk-text-field-autofill-start {
  4247.   /*!*/
  4248. }
  4249.  
  4250. @keyframes cdk-text-field-autofill-end {
  4251.   /*!*/
  4252. }
  4253.  
  4254. .cdk-text-field-autofill-monitored {
  4255.   &:-webkit-autofill {
  4256.     -webkit-animation-name: cdk-text-field-autofill-start;
  4257.     animation-name: cdk-text-field-autofill-start;
  4258.   }
  4259.  
  4260.   &:not(:-webkit-autofill) {
  4261.     -webkit-animation-name: cdk-text-field-autofill-end;
  4262.     animation-name: cdk-text-field-autofill-end;
  4263.   }
  4264. }
  4265.  
  4266. textarea {
  4267.   &.cdk-textarea-autosize {
  4268.     resize: none;
  4269.   }
  4270.  
  4271.   &.cdk-textarea-autosize-measuring {
  4272.     height: auto !important;
  4273.     overflow: hidden !important;
  4274.     padding: 2px 0 !important;
  4275.     box-sizing: content-box !important;
  4276.   }
  4277. }
  4278.  
  4279. .app.green {
  4280.   .mat-ripple-element {
  4281.     background-color: rgba(0, 0, 0, 0.1);
  4282.   }
  4283.  
  4284.   .mat-option {
  4285.     color: rgba(0, 0, 0, 0.87);
  4286.  
  4287.     &.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled), &:focus:not(.mat-option-disabled), &:hover:not(.mat-option-disabled) {
  4288.       background: rgba(0, 0, 0, 0.04);
  4289.     }
  4290.  
  4291.     &.mat-active {
  4292.       background: rgba(0, 0, 0, 0.04);
  4293.       color: rgba(0, 0, 0, 0.87);
  4294.     }
  4295.  
  4296.     &.mat-option-disabled {
  4297.       color: rgba(0, 0, 0, 0.38);
  4298.     }
  4299.   }
  4300.  
  4301.   .mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
  4302.     color: #689f38;
  4303.   }
  4304.  
  4305.   .mat-accent .mat-option.mat-selected:not(.mat-option-disabled) {
  4306.     color: #e0e0e0;
  4307.   }
  4308.  
  4309.   .mat-warn .mat-option.mat-selected:not(.mat-option-disabled) {
  4310.     color: #f44336;
  4311.   }
  4312.  
  4313.   .mat-optgroup-label {
  4314.     color: rgba(0, 0, 0, 0.54);
  4315.   }
  4316.  
  4317.   .mat-optgroup-disabled .mat-optgroup-label {
  4318.     color: rgba(0, 0, 0, 0.38);
  4319.   }
  4320.  
  4321.   .mat-pseudo-checkbox {
  4322.     color: rgba(0, 0, 0, 0.54);
  4323.  
  4324.     &::after {
  4325.       color: #fafafa;
  4326.     }
  4327.   }
  4328.  
  4329.   .mat-pseudo-checkbox-disabled {
  4330.     color: #b0b0b0;
  4331.   }
  4332.  
  4333.   .mat-accent {
  4334.     .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  4335.       background: #e0e0e0;
  4336.     }
  4337.   }
  4338.  
  4339.   .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  4340.     background: #e0e0e0;
  4341.   }
  4342.  
  4343.   .mat-primary {
  4344.     .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  4345.       background: #689f38;
  4346.     }
  4347.   }
  4348.  
  4349.   .mat-warn {
  4350.     .mat-pseudo-checkbox-checked, .mat-pseudo-checkbox-indeterminate {
  4351.       background: #f44336;
  4352.     }
  4353.   }
  4354.  
  4355.   .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled {
  4356.     background: #b0b0b0;
  4357.   }
  4358.  
  4359.   .mat-elevation-z0 {
  4360.     box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  4361.   }
  4362.  
  4363.   .mat-elevation-z1 {
  4364.     box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  4365.   }
  4366.  
  4367.   .mat-elevation-z2 {
  4368.     box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  4369.   }
  4370.  
  4371.   .mat-elevation-z3 {
  4372.     box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  4373.   }
  4374.  
  4375.   .mat-elevation-z4 {
  4376.     box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  4377.   }
  4378.  
  4379.   .mat-elevation-z5 {
  4380.     box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 5px 8px 0 rgba(0, 0, 0, 0.14), 0 1px 14px 0 rgba(0, 0, 0, 0.12);
  4381.   }
  4382.  
  4383.   .mat-elevation-z6 {
  4384.     box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
  4385.   }
  4386.  
  4387.   .mat-elevation-z7 {
  4388.     box-shadow: 0 4px 5px -2px rgba(0, 0, 0, 0.2), 0 7px 10px 1px rgba(0, 0, 0, 0.14), 0 2px 16px 1px rgba(0, 0, 0, 0.12);
  4389.   }
  4390.  
  4391.   .mat-elevation-z8 {
  4392.     box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
  4393.   }
  4394.  
  4395.   .mat-elevation-z9 {
  4396.     box-shadow: 0 5px 6px -3px rgba(0, 0, 0, 0.2), 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12);
  4397.   }
  4398.  
  4399.   .mat-elevation-z10 {
  4400.     box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.2), 0 10px 14px 1px rgba(0, 0, 0, 0.14), 0 4px 18px 3px rgba(0, 0, 0, 0.12);
  4401.   }
  4402.  
  4403.   .mat-elevation-z11 {
  4404.     box-shadow: 0 6px 7px -4px rgba(0, 0, 0, 0.2), 0 11px 15px 1px rgba(0, 0, 0, 0.14), 0 4px 20px 3px rgba(0, 0, 0, 0.12);
  4405.   }
  4406.  
  4407.   .mat-elevation-z12 {
  4408.     box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12);
  4409.   }
  4410.  
  4411.   .mat-elevation-z13 {
  4412.     box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
  4413.   }
  4414.  
  4415.   .mat-elevation-z14 {
  4416.     box-shadow: 0 7px 9px -4px rgba(0, 0, 0, 0.2), 0 14px 21px 2px rgba(0, 0, 0, 0.14), 0 5px 26px 4px rgba(0, 0, 0, 0.12);
  4417.   }
  4418.  
  4419.   .mat-elevation-z15 {
  4420.     box-shadow: 0 8px 9px -5px rgba(0, 0, 0, 0.2), 0 15px 22px 2px rgba(0, 0, 0, 0.14), 0 6px 28px 5px rgba(0, 0, 0, 0.12);
  4421.   }
  4422.  
  4423.   .mat-elevation-z16 {
  4424.     box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  4425.   }
  4426.  
  4427.   .mat-elevation-z17 {
  4428.     box-shadow: 0 8px 11px -5px rgba(0, 0, 0, 0.2), 0 17px 26px 2px rgba(0, 0, 0, 0.14), 0 6px 32px 5px rgba(0, 0, 0, 0.12);
  4429.   }
  4430.  
  4431.   .mat-elevation-z18 {
  4432.     box-shadow: 0 9px 11px -5px rgba(0, 0, 0, 0.2), 0 18px 28px 2px rgba(0, 0, 0, 0.14), 0 7px 34px 6px rgba(0, 0, 0, 0.12);
  4433.   }
  4434.  
  4435.   .mat-elevation-z19 {
  4436.     box-shadow: 0 9px 12px -6px rgba(0, 0, 0, 0.2), 0 19px 29px 2px rgba(0, 0, 0, 0.14), 0 7px 36px 6px rgba(0, 0, 0, 0.12);
  4437.   }
  4438.  
  4439.   .mat-elevation-z20 {
  4440.     box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 20px 31px 3px rgba(0, 0, 0, 0.14), 0 8px 38px 7px rgba(0, 0, 0, 0.12);
  4441.   }
  4442.  
  4443.   .mat-elevation-z21 {
  4444.     box-shadow: 0 10px 13px -6px rgba(0, 0, 0, 0.2), 0 21px 33px 3px rgba(0, 0, 0, 0.14), 0 8px 40px 7px rgba(0, 0, 0, 0.12);
  4445.   }
  4446.  
  4447.   .mat-elevation-z22 {
  4448.     box-shadow: 0 10px 14px -6px rgba(0, 0, 0, 0.2), 0 22px 35px 3px rgba(0, 0, 0, 0.14), 0 8px 42px 7px rgba(0, 0, 0, 0.12);
  4449.   }
  4450.  
  4451.   .mat-elevation-z23 {
  4452.     box-shadow: 0 11px 14px -7px rgba(0, 0, 0, 0.2), 0 23px 36px 3px rgba(0, 0, 0, 0.14), 0 9px 44px 8px rgba(0, 0, 0, 0.12);
  4453.   }
  4454.  
  4455.   .mat-elevation-z24 {
  4456.     box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
  4457.   }
  4458.  
  4459.   .mat-app-background, &.mat-app-background {
  4460.     background-color: #fafafa;
  4461.     color: rgba(0, 0, 0, 0.87);
  4462.   }
  4463.  
  4464.   .mat-autocomplete-panel {
  4465.     background: #fff;
  4466.     color: rgba(0, 0, 0, 0.87);
  4467.  
  4468.     &:not([class*=mat-elevation-z]) {
  4469.       box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  4470.     }
  4471.  
  4472.     .mat-option.mat-selected:not(.mat-active):not(:hover) {
  4473.       background: #fff;
  4474.  
  4475.       &:not(.mat-option-disabled) {
  4476.         color: rgba(0, 0, 0, 0.87);
  4477.       }
  4478.     }
  4479.   }
  4480.  
  4481.   .mat-badge-accent .mat-badge-content {
  4482.     background: #e0e0e0;
  4483.     color: rgba(0, 0, 0, 0.87);
  4484.   }
  4485.  
  4486.   .mat-badge-warn .mat-badge-content {
  4487.     color: #fff;
  4488.     background: #f44336;
  4489.   }
  4490.  
  4491.   .mat-badge {
  4492.     position: relative;
  4493.   }
  4494.  
  4495.   .mat-badge-hidden .mat-badge-content {
  4496.     display: none;
  4497.   }
  4498.  
  4499.   .mat-badge-disabled .mat-badge-content {
  4500.     background: #b9b9b9;
  4501.     color: rgba(0, 0, 0, 0.38);
  4502.   }
  4503.  
  4504.   .mat-badge-content {
  4505.     color: #fff;
  4506.     background: #689f38;
  4507.     position: absolute;
  4508.     text-align: center;
  4509.     display: inline-block;
  4510.     border-radius: 50%;
  4511.     transition: transform .2s ease-in-out;
  4512.     transform: scale(0.6);
  4513.     overflow: hidden;
  4514.     white-space: nowrap;
  4515.     text-overflow: ellipsis;
  4516.     pointer-events: none;
  4517.  
  4518.     &._mat-animation-noopable {
  4519.       transition: none;
  4520.     }
  4521.   }
  4522.  
  4523.   .ng-animate-disabled .mat-badge-content {
  4524.     transition: none;
  4525.   }
  4526.  
  4527.   .mat-badge-content.mat-badge-active {
  4528.     transform: none;
  4529.   }
  4530.  
  4531.   .mat-badge-small {
  4532.     .mat-badge-content {
  4533.       width: 16px;
  4534.       height: 16px;
  4535.       line-height: 16px;
  4536.     }
  4537.  
  4538.     &.mat-badge-above .mat-badge-content {
  4539.       top: -8px;
  4540.     }
  4541.  
  4542.     &.mat-badge-below .mat-badge-content {
  4543.       bottom: -8px;
  4544.     }
  4545.  
  4546.     &.mat-badge-before .mat-badge-content {
  4547.       left: -16px;
  4548.     }
  4549.   }
  4550. }
  4551.  
  4552. @media (-ms-high-contrast: active) {
  4553.   .app.green {
  4554.     .mat-badge-content {
  4555.       outline: solid 1px;
  4556.       border-radius: 0;
  4557.     }
  4558.  
  4559.     .mat-checkbox-disabled {
  4560.       opacity: .5;
  4561.     }
  4562.   }
  4563. }
  4564.  
  4565. [dir=rtl] .app.green .mat-badge-small.mat-badge-before .mat-badge-content {
  4566.   left: auto;
  4567.   right: -16px;
  4568. }
  4569.  
  4570. .app.green .mat-badge-small.mat-badge-after .mat-badge-content {
  4571.   right: -16px;
  4572. }
  4573.  
  4574. [dir=rtl] .app.green .mat-badge-small.mat-badge-after .mat-badge-content {
  4575.   right: auto;
  4576.   left: -16px;
  4577. }
  4578.  
  4579. .app.green .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {
  4580.   left: -8px;
  4581. }
  4582.  
  4583. [dir=rtl] .app.green .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {
  4584.   left: auto;
  4585.   right: -8px;
  4586. }
  4587.  
  4588. .app.green .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
  4589.   right: -8px;
  4590. }
  4591.  
  4592. [dir=rtl] .app.green .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
  4593.   right: auto;
  4594.   left: -8px;
  4595. }
  4596.  
  4597. .app.green .mat-badge-medium {
  4598.   .mat-badge-content {
  4599.     width: 22px;
  4600.     height: 22px;
  4601.     line-height: 22px;
  4602.   }
  4603.  
  4604.   &.mat-badge-above .mat-badge-content {
  4605.     top: -11px;
  4606.   }
  4607.  
  4608.   &.mat-badge-below .mat-badge-content {
  4609.     bottom: -11px;
  4610.   }
  4611.  
  4612.   &.mat-badge-before .mat-badge-content {
  4613.     left: -22px;
  4614.   }
  4615. }
  4616.  
  4617. [dir=rtl] .app.green .mat-badge-medium.mat-badge-before .mat-badge-content {
  4618.   left: auto;
  4619.   right: -22px;
  4620. }
  4621.  
  4622. .app.green .mat-badge-medium.mat-badge-after .mat-badge-content {
  4623.   right: -22px;
  4624. }
  4625.  
  4626. [dir=rtl] .app.green .mat-badge-medium.mat-badge-after .mat-badge-content {
  4627.   right: auto;
  4628.   left: -22px;
  4629. }
  4630.  
  4631. .app.green .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {
  4632.   left: -11px;
  4633. }
  4634.  
  4635. [dir=rtl] .app.green .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {
  4636.   left: auto;
  4637.   right: -11px;
  4638. }
  4639.  
  4640. .app.green .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {
  4641.   right: -11px;
  4642. }
  4643.  
  4644. [dir=rtl] .app.green .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {
  4645.   right: auto;
  4646.   left: -11px;
  4647. }
  4648.  
  4649. .app.green .mat-badge-large {
  4650.   .mat-badge-content {
  4651.     width: 28px;
  4652.     height: 28px;
  4653.     line-height: 28px;
  4654.   }
  4655.  
  4656.   &.mat-badge-above .mat-badge-content {
  4657.     top: -14px;
  4658.   }
  4659.  
  4660.   &.mat-badge-below .mat-badge-content {
  4661.     bottom: -14px;
  4662.   }
  4663.  
  4664.   &.mat-badge-before .mat-badge-content {
  4665.     left: -28px;
  4666.   }
  4667. }
  4668.  
  4669. [dir=rtl] .app.green .mat-badge-large.mat-badge-before .mat-badge-content {
  4670.   left: auto;
  4671.   right: -28px;
  4672. }
  4673.  
  4674. .app.green .mat-badge-large.mat-badge-after .mat-badge-content {
  4675.   right: -28px;
  4676. }
  4677.  
  4678. [dir=rtl] .app.green .mat-badge-large.mat-badge-after .mat-badge-content {
  4679.   right: auto;
  4680.   left: -28px;
  4681. }
  4682.  
  4683. .app.green .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {
  4684.   left: -14px;
  4685. }
  4686.  
  4687. [dir=rtl] .app.green .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {
  4688.   left: auto;
  4689.   right: -14px;
  4690. }
  4691.  
  4692. .app.green .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {
  4693.   right: -14px;
  4694. }
  4695.  
  4696. [dir=rtl] .app.green .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {
  4697.   right: auto;
  4698.   left: -14px;
  4699. }
  4700.  
  4701. .app {
  4702.   &.green {
  4703.     .mat-bottom-sheet-container {
  4704.       box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  4705.       background: #fff;
  4706.       color: rgba(0, 0, 0, 0.87);
  4707.     }
  4708.  
  4709.     .mat-button, .mat-icon-button, .mat-stroked-button {
  4710.       color: inherit;
  4711.       background: 0 0;
  4712.     }
  4713.  
  4714.     .mat-button.mat-primary, .mat-icon-button.mat-primary, .mat-stroked-button.mat-primary {
  4715.       color: #689f38;
  4716.     }
  4717.  
  4718.     .mat-button.mat-accent, .mat-icon-button.mat-accent, .mat-stroked-button.mat-accent {
  4719.       color: #e0e0e0;
  4720.     }
  4721.  
  4722.     .mat-button.mat-warn, .mat-icon-button.mat-warn, .mat-stroked-button.mat-warn {
  4723.       color: #f44336;
  4724.     }
  4725.  
  4726.     .mat-button {
  4727.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4728.         color: rgba(0, 0, 0, 0.26);
  4729.       }
  4730.     }
  4731.  
  4732.     .mat-icon-button {
  4733.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4734.         color: rgba(0, 0, 0, 0.26);
  4735.       }
  4736.     }
  4737.  
  4738.     .mat-stroked-button {
  4739.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4740.         color: rgba(0, 0, 0, 0.26);
  4741.       }
  4742.     }
  4743.  
  4744.     .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 {
  4745.       background-color: #689f38;
  4746.     }
  4747.  
  4748.     .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 {
  4749.       background-color: #e0e0e0;
  4750.     }
  4751.  
  4752.     .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 {
  4753.       background-color: #f44336;
  4754.     }
  4755.  
  4756.     .mat-button[disabled] .mat-button-focus-overlay, .mat-icon-button[disabled] .mat-button-focus-overlay, .mat-stroked-button[disabled] .mat-button-focus-overlay {
  4757.       background-color: transparent;
  4758.     }
  4759.  
  4760.     .mat-button .mat-ripple-element, .mat-icon-button .mat-ripple-element, .mat-stroked-button .mat-ripple-element {
  4761.       opacity: .1;
  4762.       background-color: currentColor;
  4763.     }
  4764.  
  4765.     .mat-button-focus-overlay {
  4766.       background: #000;
  4767.     }
  4768.  
  4769.     .mat-stroked-button:not([disabled]) {
  4770.       border-color: rgba(0, 0, 0, 0.12);
  4771.     }
  4772.  
  4773.     .mat-fab, .mat-flat-button, .mat-mini-fab, .mat-raised-button {
  4774.       color: rgba(0, 0, 0, 0.87);
  4775.       background-color: #fff;
  4776.     }
  4777.  
  4778.     .mat-fab.mat-primary, .mat-flat-button.mat-primary, .mat-mini-fab.mat-primary, .mat-raised-button.mat-primary {
  4779.       color: #fff;
  4780.       background-color: #689f38;
  4781.     }
  4782.  
  4783.     .mat-fab.mat-accent, .mat-flat-button.mat-accent, .mat-mini-fab.mat-accent, .mat-raised-button.mat-accent {
  4784.       color: rgba(0, 0, 0, 0.87);
  4785.       background-color: #e0e0e0;
  4786.     }
  4787.  
  4788.     .mat-fab.mat-warn, .mat-flat-button.mat-warn, .mat-mini-fab.mat-warn, .mat-raised-button.mat-warn {
  4789.       color: #fff;
  4790.       background-color: #f44336;
  4791.     }
  4792.  
  4793.     .mat-fab {
  4794.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4795.         color: rgba(0, 0, 0, 0.26);
  4796.         background-color: rgba(0, 0, 0, 0.12);
  4797.       }
  4798.     }
  4799.  
  4800.     .mat-flat-button {
  4801.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4802.         color: rgba(0, 0, 0, 0.26);
  4803.         background-color: rgba(0, 0, 0, 0.12);
  4804.       }
  4805.     }
  4806.  
  4807.     .mat-mini-fab {
  4808.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4809.         color: rgba(0, 0, 0, 0.26);
  4810.         background-color: rgba(0, 0, 0, 0.12);
  4811.       }
  4812.     }
  4813.  
  4814.     .mat-raised-button {
  4815.       &.mat-accent[disabled], &.mat-primary[disabled], &.mat-warn[disabled], &[disabled][disabled] {
  4816.         color: rgba(0, 0, 0, 0.26);
  4817.         background-color: rgba(0, 0, 0, 0.12);
  4818.       }
  4819.     }
  4820.  
  4821.     .mat-fab.mat-primary .mat-ripple-element, .mat-flat-button.mat-primary .mat-ripple-element, .mat-mini-fab.mat-primary .mat-ripple-element, .mat-raised-button.mat-primary .mat-ripple-element {
  4822.       background-color: rgba(255, 255, 255, 0.1);
  4823.     }
  4824.  
  4825.     .mat-fab.mat-accent .mat-ripple-element, .mat-flat-button.mat-accent .mat-ripple-element, .mat-mini-fab.mat-accent .mat-ripple-element, .mat-raised-button.mat-accent .mat-ripple-element {
  4826.       background-color: rgba(0, 0, 0, 0.1);
  4827.     }
  4828.  
  4829.     .mat-fab.mat-warn .mat-ripple-element, .mat-flat-button.mat-warn .mat-ripple-element, .mat-mini-fab.mat-warn .mat-ripple-element, .mat-raised-button.mat-warn .mat-ripple-element {
  4830.       background-color: rgba(255, 255, 255, 0.1);
  4831.     }
  4832.  
  4833.     .mat-flat-button:not([class*=mat-elevation-z]), .mat-stroked-button:not([class*=mat-elevation-z]) {
  4834.       box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  4835.     }
  4836.  
  4837.     .mat-raised-button {
  4838.       &:not([class*=mat-elevation-z]) {
  4839.         box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  4840.       }
  4841.  
  4842.       &:not([disabled]):active:not([class*=mat-elevation-z]) {
  4843.         box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
  4844.       }
  4845.  
  4846.       &[disabled]:not([class*=mat-elevation-z]) {
  4847.         box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  4848.       }
  4849.     }
  4850.  
  4851.     .mat-fab:not([class*=mat-elevation-z]), .mat-mini-fab:not([class*=mat-elevation-z]) {
  4852.       box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);
  4853.     }
  4854.  
  4855.     .mat-fab:not([disabled]):active:not([class*=mat-elevation-z]), .mat-mini-fab:not([disabled]):active:not([class*=mat-elevation-z]) {
  4856.       box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12);
  4857.     }
  4858.  
  4859.     .mat-fab[disabled]:not([class*=mat-elevation-z]), .mat-mini-fab[disabled]:not([class*=mat-elevation-z]) {
  4860.       box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  4861.     }
  4862.  
  4863.     .mat-button-toggle-group, .mat-button-toggle-standalone {
  4864.       box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  4865.     }
  4866.  
  4867.     .mat-button-toggle-group-appearance-standard, .mat-button-toggle-standalone.mat-button-toggle-appearance-standard {
  4868.       box-shadow: none;
  4869.       border: 1px solid rgba(0, 0, 0, 0.12);
  4870.     }
  4871.  
  4872.     .mat-button-toggle {
  4873.       color: rgba(0, 0, 0, 0.38);
  4874.  
  4875.       .mat-button-toggle-focus-overlay {
  4876.         background-color: rgba(0, 0, 0, 0.12);
  4877.       }
  4878.     }
  4879.  
  4880.     .mat-button-toggle-appearance-standard {
  4881.       color: rgba(0, 0, 0, 0.87);
  4882.       background: #fff;
  4883.  
  4884.       .mat-button-toggle-focus-overlay {
  4885.         background-color: #000;
  4886.       }
  4887.     }
  4888.  
  4889.     .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {
  4890.       border-left: 1px solid rgba(0, 0, 0, 0.12);
  4891.     }
  4892.  
  4893.     [dir=rtl] .mat-button-toggle-group-appearance-standard .mat-button-toggle + .mat-button-toggle {
  4894.       border-left: none;
  4895.       border-right: 1px solid rgba(0, 0, 0, 0.12);
  4896.     }
  4897.  
  4898.     .mat-button-toggle-group-appearance-standard.mat-button-toggle-vertical .mat-button-toggle + .mat-button-toggle {
  4899.       border-left: none;
  4900.       border-right: none;
  4901.       border-top: 1px solid rgba(0, 0, 0, 0.12);
  4902.     }
  4903.  
  4904.     .mat-button-toggle-checked {
  4905.       background-color: #e0e0e0;
  4906.       color: rgba(0, 0, 0, 0.54);
  4907.  
  4908.       &.mat-button-toggle-appearance-standard {
  4909.         color: rgba(0, 0, 0, 0.87);
  4910.       }
  4911.     }
  4912.  
  4913.     .mat-button-toggle-disabled {
  4914.       color: rgba(0, 0, 0, 0.26);
  4915.       background-color: #eee;
  4916.  
  4917.       &.mat-button-toggle-appearance-standard {
  4918.         background: #fff;
  4919.       }
  4920.  
  4921.       &.mat-button-toggle-checked {
  4922.         background-color: #bdbdbd;
  4923.       }
  4924.     }
  4925.  
  4926.     .mat-card {
  4927.       background: #fff;
  4928.       color: rgba(0, 0, 0, 0.87);
  4929.  
  4930.       &:not([class*=mat-elevation-z]) {
  4931.         box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  4932.       }
  4933.  
  4934.       &.mat-card-flat:not([class*=mat-elevation-z]) {
  4935.         box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  4936.       }
  4937.     }
  4938.  
  4939.     .mat-card-subtitle {
  4940.       color: rgba(0, 0, 0, 0.54);
  4941.     }
  4942.  
  4943.     .mat-checkbox-frame {
  4944.       border-color: rgba(0, 0, 0, 0.54);
  4945.     }
  4946.  
  4947.     .mat-checkbox-checkmark {
  4948.       fill: #fafafa;
  4949.     }
  4950.  
  4951.     .mat-checkbox-checkmark-path {
  4952.       stroke: #fafafa !important;
  4953.     }
  4954.  
  4955.     .mat-checkbox-mixedmark {
  4956.       background-color: #fafafa;
  4957.     }
  4958.  
  4959.     .mat-checkbox-checked.mat-primary .mat-checkbox-background, .mat-checkbox-indeterminate.mat-primary .mat-checkbox-background {
  4960.       background-color: #689f38;
  4961.     }
  4962.  
  4963.     .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
  4964.       background-color: #e0e0e0;
  4965.     }
  4966.  
  4967.     .mat-checkbox-checked.mat-warn .mat-checkbox-background, .mat-checkbox-indeterminate.mat-warn .mat-checkbox-background {
  4968.       background-color: #f44336;
  4969.     }
  4970.  
  4971.     .mat-checkbox-disabled {
  4972.       &.mat-checkbox-checked .mat-checkbox-background, &.mat-checkbox-indeterminate .mat-checkbox-background {
  4973.         background-color: #b0b0b0;
  4974.       }
  4975.  
  4976.       &:not(.mat-checkbox-checked) .mat-checkbox-frame {
  4977.         border-color: #b0b0b0;
  4978.       }
  4979.  
  4980.       .mat-checkbox-label {
  4981.         color: rgba(0, 0, 0, 0.54);
  4982.       }
  4983.     }
  4984.  
  4985.     .mat-checkbox .mat-ripple-element {
  4986.       background-color: #000;
  4987.     }
  4988.  
  4989.     .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-primary .mat-ripple-element {
  4990.       background: #689f38;
  4991.     }
  4992.  
  4993.     .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-accent .mat-ripple-element {
  4994.       background: #e0e0e0;
  4995.     }
  4996.  
  4997.     .mat-checkbox-checked:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element, .mat-checkbox:active:not(.mat-checkbox-disabled).mat-warn .mat-ripple-element {
  4998.       background: #f44336;
  4999.     }
  5000.  
  5001.     .mat-chip.mat-standard-chip {
  5002.       background-color: #e0e0e0;
  5003.       color: rgba(0, 0, 0, 0.87);
  5004.  
  5005.       .mat-chip-remove {
  5006.         color: rgba(0, 0, 0, 0.87);
  5007.         opacity: .4;
  5008.       }
  5009.  
  5010.       &:not(.mat-chip-disabled) {
  5011.         &:active {
  5012.           box-shadow: 0 3px 3px -2px rgba(0, 0, 0, 0.2), 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 1px 8px 0 rgba(0, 0, 0, 0.12);
  5013.         }
  5014.  
  5015.         .mat-chip-remove:hover {
  5016.           opacity: .54;
  5017.         }
  5018.       }
  5019.  
  5020.       &.mat-chip-disabled {
  5021.         opacity: .4;
  5022.       }
  5023.  
  5024.       &::after {
  5025.         background: #000;
  5026.       }
  5027.  
  5028.       &.mat-chip-selected {
  5029.         &.mat-primary {
  5030.           background-color: #689f38;
  5031.           color: #fff;
  5032.  
  5033.           .mat-chip-remove {
  5034.             color: #fff;
  5035.             opacity: .4;
  5036.           }
  5037.  
  5038.           .mat-ripple-element {
  5039.             background: rgba(255, 255, 255, 0.1);
  5040.           }
  5041.         }
  5042.  
  5043.         &.mat-warn {
  5044.           background-color: #f44336;
  5045.           color: #fff;
  5046.  
  5047.           .mat-chip-remove {
  5048.             color: #fff;
  5049.             opacity: .4;
  5050.           }
  5051.  
  5052.           .mat-ripple-element {
  5053.             background: rgba(255, 255, 255, 0.1);
  5054.           }
  5055.         }
  5056.  
  5057.         &.mat-accent {
  5058.           background-color: #e0e0e0;
  5059.           color: rgba(0, 0, 0, 0.87);
  5060.  
  5061.           .mat-chip-remove {
  5062.             color: rgba(0, 0, 0, 0.87);
  5063.             opacity: .4;
  5064.           }
  5065.  
  5066.           .mat-ripple-element {
  5067.             background: rgba(0, 0, 0, 0.1);
  5068.           }
  5069.         }
  5070.       }
  5071.     }
  5072.  
  5073.     .mat-table {
  5074.       background: #fff;
  5075.  
  5076.       tbody, tfoot, thead {
  5077.         background: inherit;
  5078.       }
  5079.     }
  5080.  
  5081.     .mat-table-sticky, [mat-footer-row], [mat-header-row], [mat-row], mat-footer-row, mat-header-row, mat-row {
  5082.       background: inherit;
  5083.     }
  5084.  
  5085.     mat-footer-row, mat-header-row, mat-row {
  5086.       border-bottom-color: rgba(0, 0, 0, 0.12);
  5087.     }
  5088.  
  5089.     td {
  5090.       &.mat-cell, &.mat-footer-cell {
  5091.         border-bottom-color: rgba(0, 0, 0, 0.12);
  5092.       }
  5093.     }
  5094.  
  5095.     th.mat-header-cell {
  5096.       border-bottom-color: rgba(0, 0, 0, 0.12);
  5097.     }
  5098.  
  5099.     .mat-header-cell {
  5100.       color: rgba(0, 0, 0, 0.54);
  5101.     }
  5102.  
  5103.     .mat-cell, .mat-footer-cell {
  5104.       color: rgba(0, 0, 0, 0.87);
  5105.     }
  5106.  
  5107.     .mat-calendar-arrow {
  5108.       border-top-color: rgba(0, 0, 0, 0.54);
  5109.     }
  5110.  
  5111.     .mat-datepicker-content {
  5112.       .mat-calendar-next-button, .mat-calendar-previous-button {
  5113.         color: rgba(0, 0, 0, 0.54);
  5114.       }
  5115.     }
  5116.  
  5117.     .mat-datepicker-toggle {
  5118.       color: rgba(0, 0, 0, 0.54);
  5119.     }
  5120.  
  5121.     .mat-calendar-table-header {
  5122.       color: rgba(0, 0, 0, 0.38);
  5123.     }
  5124.  
  5125.     .mat-calendar-table-header-divider::after {
  5126.       background: rgba(0, 0, 0, 0.12);
  5127.     }
  5128.  
  5129.     .mat-calendar-body-label {
  5130.       color: rgba(0, 0, 0, 0.54);
  5131.     }
  5132.  
  5133.     .mat-calendar-body-cell-content {
  5134.       color: rgba(0, 0, 0, 0.87);
  5135.       border-color: transparent;
  5136.     }
  5137.  
  5138.     .mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  5139.       color: rgba(0, 0, 0, 0.38);
  5140.     }
  5141.  
  5142.     .cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected), .cdk-program-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected), .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  5143.       background-color: rgba(0, 0, 0, 0.04);
  5144.     }
  5145.  
  5146.     .mat-calendar-body-today:not(.mat-calendar-body-selected) {
  5147.       border-color: rgba(0, 0, 0, 0.38);
  5148.     }
  5149.  
  5150.     .mat-calendar-body-disabled > .mat-calendar-body-today:not(.mat-calendar-body-selected) {
  5151.       border-color: rgba(0, 0, 0, 0.18);
  5152.     }
  5153.  
  5154.     .mat-calendar-body-selected {
  5155.       background-color: #689f38;
  5156.       color: #fff;
  5157.     }
  5158.  
  5159.     .mat-calendar-body-disabled > .mat-calendar-body-selected {
  5160.       background-color: rgba(104, 159, 56, 0.4);
  5161.     }
  5162.  
  5163.     .mat-calendar-body-today.mat-calendar-body-selected {
  5164.       box-shadow: inset 0 0 0 1px #fff;
  5165.     }
  5166.  
  5167.     .mat-datepicker-content {
  5168.       box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  5169.       background-color: #fff;
  5170.       color: rgba(0, 0, 0, 0.87);
  5171.  
  5172.       &.mat-accent {
  5173.         .mat-calendar-body-selected {
  5174.           background-color: #e0e0e0;
  5175.           color: rgba(0, 0, 0, 0.87);
  5176.         }
  5177.  
  5178.         .mat-calendar-body-disabled > .mat-calendar-body-selected {
  5179.           background-color: rgba(224, 224, 224, 0.4);
  5180.         }
  5181.  
  5182.         .mat-calendar-body-today.mat-calendar-body-selected {
  5183.           box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.87);
  5184.         }
  5185.       }
  5186.  
  5187.       &.mat-warn {
  5188.         .mat-calendar-body-selected {
  5189.           background-color: #f44336;
  5190.           color: #fff;
  5191.         }
  5192.  
  5193.         .mat-calendar-body-disabled > .mat-calendar-body-selected {
  5194.           background-color: rgba(244, 67, 54, 0.4);
  5195.         }
  5196.  
  5197.         .mat-calendar-body-today.mat-calendar-body-selected {
  5198.           box-shadow: inset 0 0 0 1px #fff;
  5199.         }
  5200.       }
  5201.     }
  5202.  
  5203.     .mat-datepicker-content-touch {
  5204.       box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
  5205.     }
  5206.  
  5207.     .mat-datepicker-toggle-active {
  5208.       color: #689f38;
  5209.  
  5210.       &.mat-accent {
  5211.         color: #e0e0e0;
  5212.       }
  5213.  
  5214.       &.mat-warn {
  5215.         color: #f44336;
  5216.       }
  5217.     }
  5218.  
  5219.     .mat-dialog-container {
  5220.       box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
  5221.       background: #fff;
  5222.       color: rgba(0, 0, 0, 0.87);
  5223.     }
  5224.  
  5225.     .mat-divider {
  5226.       border-top-color: rgba(0, 0, 0, 0.12);
  5227.     }
  5228.  
  5229.     .mat-divider-vertical {
  5230.       border-right-color: rgba(0, 0, 0, 0.12);
  5231.     }
  5232.  
  5233.     .mat-expansion-panel {
  5234.       background: #fff;
  5235.       color: rgba(0, 0, 0, 0.87);
  5236.  
  5237.       &:not([class*=mat-elevation-z]) {
  5238.         box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  5239.       }
  5240.     }
  5241.  
  5242.     .mat-action-row {
  5243.       border-top-color: rgba(0, 0, 0, 0.12);
  5244.     }
  5245.  
  5246.     .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:not([aria-disabled=true]) {
  5247.       &.cdk-keyboard-focused, &.cdk-program-focused, &:hover {
  5248.         background: rgba(0, 0, 0, 0.04);
  5249.       }
  5250.     }
  5251.  
  5252.     .mat-expansion-panel-header-title {
  5253.       color: rgba(0, 0, 0, 0.87);
  5254.     }
  5255.  
  5256.     .mat-expansion-indicator::after, .mat-expansion-panel-header-description {
  5257.       color: rgba(0, 0, 0, 0.54);
  5258.     }
  5259.  
  5260.     .mat-expansion-panel-header[aria-disabled=true] {
  5261.       color: rgba(0, 0, 0, 0.26);
  5262.  
  5263.       .mat-expansion-panel-header-description, .mat-expansion-panel-header-title {
  5264.         color: inherit;
  5265.       }
  5266.     }
  5267.  
  5268.     .mat-form-field-label, .mat-hint {
  5269.       color: rgba(0, 0, 0, 0.6);
  5270.     }
  5271.  
  5272.     .mat-form-field.mat-focused .mat-form-field-label {
  5273.       color: #689f38;
  5274.  
  5275.       &.mat-accent {
  5276.         color: #e0e0e0;
  5277.       }
  5278.  
  5279.       &.mat-warn {
  5280.         color: #f44336;
  5281.       }
  5282.     }
  5283.  
  5284.     .mat-focused .mat-form-field-required-marker {
  5285.       color: #e0e0e0;
  5286.     }
  5287.  
  5288.     .mat-form-field-ripple {
  5289.       background-color: rgba(0, 0, 0, 0.87);
  5290.     }
  5291.  
  5292.     .mat-form-field.mat-focused .mat-form-field-ripple {
  5293.       background-color: #689f38;
  5294.  
  5295.       &.mat-accent {
  5296.         background-color: #e0e0e0;
  5297.       }
  5298.  
  5299.       &.mat-warn {
  5300.         background-color: #f44336;
  5301.       }
  5302.     }
  5303.  
  5304.     .mat-form-field-type-mat-native-select.mat-focused:not(.mat-form-field-invalid) {
  5305.       .mat-form-field-infix::after {
  5306.         color: #689f38;
  5307.       }
  5308.  
  5309.       &.mat-accent .mat-form-field-infix::after {
  5310.         color: #e0e0e0;
  5311.       }
  5312.  
  5313.       &.mat-warn .mat-form-field-infix::after {
  5314.         color: #f44336;
  5315.       }
  5316.     }
  5317.  
  5318.     .mat-form-field.mat-form-field-invalid {
  5319.       .mat-form-field-label {
  5320.         color: #f44336;
  5321.  
  5322.         .mat-form-field-required-marker, &.mat-accent {
  5323.           color: #f44336;
  5324.         }
  5325.       }
  5326.  
  5327.       .mat-form-field-ripple {
  5328.         background-color: #f44336;
  5329.  
  5330.         &.mat-accent {
  5331.           background-color: #f44336;
  5332.         }
  5333.       }
  5334.     }
  5335.  
  5336.     .mat-error {
  5337.       color: #f44336;
  5338.     }
  5339.  
  5340.     .mat-form-field-appearance-legacy {
  5341.       .mat-form-field-label, .mat-hint {
  5342.         color: rgba(0, 0, 0, 0.54);
  5343.       }
  5344.  
  5345.       .mat-form-field-underline {
  5346.         background-color: rgba(0, 0, 0, 0.42);
  5347.       }
  5348.  
  5349.       &.mat-form-field-disabled .mat-form-field-underline {
  5350.         background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0, rgba(0, 0, 0, 0.42) 33%, transparent 0);
  5351.         background-size: 4px 100%;
  5352.         background-repeat: repeat-x;
  5353.       }
  5354.     }
  5355.  
  5356.     .mat-form-field-appearance-standard {
  5357.       .mat-form-field-underline {
  5358.         background-color: rgba(0, 0, 0, 0.42);
  5359.       }
  5360.  
  5361.       &.mat-form-field-disabled .mat-form-field-underline {
  5362.         background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0, rgba(0, 0, 0, 0.42) 33%, transparent 0);
  5363.         background-size: 4px 100%;
  5364.         background-repeat: repeat-x;
  5365.       }
  5366.     }
  5367.  
  5368.     .mat-form-field-appearance-fill {
  5369.       .mat-form-field-flex {
  5370.         background-color: rgba(0, 0, 0, 0.04);
  5371.       }
  5372.  
  5373.       &.mat-form-field-disabled .mat-form-field-flex {
  5374.         background-color: rgba(0, 0, 0, 0.02);
  5375.       }
  5376.  
  5377.       .mat-form-field-underline::before {
  5378.         background-color: rgba(0, 0, 0, 0.42);
  5379.       }
  5380.  
  5381.       &.mat-form-field-disabled {
  5382.         .mat-form-field-label {
  5383.           color: rgba(0, 0, 0, 0.38);
  5384.         }
  5385.  
  5386.         .mat-form-field-underline::before {
  5387.           background-color: transparent;
  5388.         }
  5389.       }
  5390.     }
  5391.  
  5392.     .mat-form-field-appearance-outline {
  5393.       .mat-form-field-outline {
  5394.         color: rgba(0, 0, 0, 0.12);
  5395.       }
  5396.  
  5397.       .mat-form-field-outline-thick {
  5398.         color: rgba(0, 0, 0, 0.87);
  5399.       }
  5400.  
  5401.       &.mat-focused {
  5402.         .mat-form-field-outline-thick {
  5403.           color: #689f38;
  5404.         }
  5405.  
  5406.         &.mat-accent .mat-form-field-outline-thick {
  5407.           color: #e0e0e0;
  5408.         }
  5409.  
  5410.         &.mat-warn .mat-form-field-outline-thick {
  5411.           color: #f44336;
  5412.         }
  5413.       }
  5414.  
  5415.       &.mat-form-field-invalid.mat-form-field-invalid .mat-form-field-outline-thick {
  5416.         color: #f44336;
  5417.       }
  5418.  
  5419.       &.mat-form-field-disabled {
  5420.         .mat-form-field-label {
  5421.           color: rgba(0, 0, 0, 0.38);
  5422.         }
  5423.  
  5424.         .mat-form-field-outline {
  5425.           color: rgba(0, 0, 0, 0.06);
  5426.         }
  5427.       }
  5428.     }
  5429.  
  5430.     .mat-icon {
  5431.       &.mat-primary {
  5432.         color: #689f38;
  5433.       }
  5434.  
  5435.       &.mat-accent {
  5436.         color: #e0e0e0;
  5437.       }
  5438.  
  5439.       &.mat-warn {
  5440.         color: #f44336;
  5441.       }
  5442.     }
  5443.  
  5444.     .mat-form-field-type-mat-native-select {
  5445.       .mat-form-field-infix::after {
  5446.         color: rgba(0, 0, 0, 0.54);
  5447.       }
  5448.  
  5449.       &.mat-form-field-disabled .mat-form-field-infix::after {
  5450.         color: rgba(0, 0, 0, 0.38);
  5451.       }
  5452.     }
  5453.  
  5454.     .mat-input-element {
  5455.       &:disabled {
  5456.         color: rgba(0, 0, 0, 0.38);
  5457.       }
  5458.  
  5459.       caret-color: #689f38;
  5460.  
  5461.       &::-ms-input-placeholder, &::placeholder, &::-moz-placeholder, &::-webkit-input-placeholder, &:-ms-input-placeholder {
  5462.         color: rgba(0, 0, 0, 0.42);
  5463.       }
  5464.     }
  5465.  
  5466.     .mat-accent .mat-input-element {
  5467.       caret-color: #e0e0e0;
  5468.     }
  5469.  
  5470.     .mat-form-field-invalid .mat-input-element, .mat-warn .mat-input-element {
  5471.       caret-color: #f44336;
  5472.     }
  5473.  
  5474.     .mat-form-field-type-mat-native-select.mat-form-field-invalid .mat-form-field-infix::after {
  5475.       color: #f44336;
  5476.     }
  5477.  
  5478.     .mat-list-base {
  5479.       .mat-list-item, .mat-list-option {
  5480.         color: rgba(0, 0, 0, 0.87);
  5481.       }
  5482.  
  5483.       .mat-subheader {
  5484.         color: rgba(0, 0, 0, 0.54);
  5485.       }
  5486.     }
  5487.  
  5488.     .mat-list-item-disabled {
  5489.       background-color: #eee;
  5490.     }
  5491.  
  5492.     .mat-action-list .mat-list-item {
  5493.       &:focus, &:hover {
  5494.         background: rgba(0, 0, 0, 0.04);
  5495.       }
  5496.     }
  5497.  
  5498.     .mat-list-option {
  5499.       &:focus, &:hover {
  5500.         background: rgba(0, 0, 0, 0.04);
  5501.       }
  5502.     }
  5503.  
  5504.     .mat-nav-list .mat-list-item {
  5505.       &:focus, &:hover {
  5506.         background: rgba(0, 0, 0, 0.04);
  5507.       }
  5508.     }
  5509.  
  5510.     .mat-menu-panel {
  5511.       background: #fff;
  5512.  
  5513.       &:not([class*=mat-elevation-z]) {
  5514.         box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  5515.       }
  5516.     }
  5517.  
  5518.     .mat-menu-item {
  5519.       background: 0 0;
  5520.       color: rgba(0, 0, 0, 0.87);
  5521.  
  5522.       &[disabled] {
  5523.         color: rgba(0, 0, 0, 0.38);
  5524.  
  5525.         &::after {
  5526.           color: rgba(0, 0, 0, 0.38);
  5527.         }
  5528.       }
  5529.  
  5530.       .mat-icon-no-color {
  5531.         color: rgba(0, 0, 0, 0.54);
  5532.       }
  5533.     }
  5534.  
  5535.     .mat-menu-item-submenu-trigger::after {
  5536.       color: rgba(0, 0, 0, 0.54);
  5537.     }
  5538.  
  5539.     .mat-menu-item-highlighted:not([disabled]) {
  5540.       background: rgba(0, 0, 0, 0.04);
  5541.     }
  5542.  
  5543.     .mat-menu-item {
  5544.       &.cdk-keyboard-focused:not([disabled]), &.cdk-program-focused:not([disabled]), &:hover:not([disabled]) {
  5545.         background: rgba(0, 0, 0, 0.04);
  5546.       }
  5547.     }
  5548.  
  5549.     .mat-paginator {
  5550.       background: #fff;
  5551.       color: rgba(0, 0, 0, 0.54);
  5552.     }
  5553.  
  5554.     .mat-paginator-page-size .mat-select-trigger {
  5555.       color: rgba(0, 0, 0, 0.54);
  5556.     }
  5557.  
  5558.     .mat-paginator-decrement, .mat-paginator-increment {
  5559.       border-top: 2px solid rgba(0, 0, 0, 0.54);
  5560.       border-right: 2px solid rgba(0, 0, 0, 0.54);
  5561.     }
  5562.  
  5563.     .mat-paginator-first, .mat-paginator-last {
  5564.       border-top: 2px solid rgba(0, 0, 0, 0.54);
  5565.     }
  5566.  
  5567.     .mat-icon-button[disabled] {
  5568.       .mat-paginator-decrement, .mat-paginator-first, .mat-paginator-increment, .mat-paginator-last {
  5569.         border-color: rgba(0, 0, 0, 0.38);
  5570.       }
  5571.     }
  5572.  
  5573.     .mat-progress-bar-background {
  5574.       fill: #f1f8e9;
  5575.     }
  5576.  
  5577.     .mat-progress-bar-buffer {
  5578.       background-color: #f1f8e9;
  5579.     }
  5580.  
  5581.     .mat-progress-bar-fill::after {
  5582.       background-color: #689f38;
  5583.     }
  5584.  
  5585.     .mat-progress-bar {
  5586.       &.mat-accent {
  5587.         .mat-progress-bar-background {
  5588.           fill: #f5f5f5;
  5589.         }
  5590.  
  5591.         .mat-progress-bar-buffer {
  5592.           background-color: #f5f5f5;
  5593.         }
  5594.  
  5595.         .mat-progress-bar-fill::after {
  5596.           background-color: #e0e0e0;
  5597.         }
  5598.       }
  5599.  
  5600.       &.mat-warn {
  5601.         .mat-progress-bar-background {
  5602.           fill: #ff5252;
  5603.         }
  5604.  
  5605.         .mat-progress-bar-buffer {
  5606.           background-color: #ff5252;
  5607.         }
  5608.  
  5609.         .mat-progress-bar-fill::after {
  5610.           background-color: #f44336;
  5611.         }
  5612.       }
  5613.     }
  5614.  
  5615.     .mat-progress-spinner circle, .mat-spinner circle {
  5616.       stroke: #689f38;
  5617.     }
  5618.  
  5619.     .mat-progress-spinner.mat-accent circle, .mat-spinner.mat-accent circle {
  5620.       stroke: #e0e0e0;
  5621.     }
  5622.  
  5623.     .mat-progress-spinner.mat-warn circle, .mat-spinner.mat-warn circle {
  5624.       stroke: #f44336;
  5625.     }
  5626.  
  5627.     .mat-radio-outer-circle {
  5628.       border-color: rgba(0, 0, 0, 0.54);
  5629.     }
  5630.  
  5631.     .mat-radio-button {
  5632.       &.mat-primary {
  5633.         &.mat-radio-checked .mat-radio-outer-circle {
  5634.           border-color: #689f38;
  5635.         }
  5636.  
  5637.         .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), &.mat-radio-checked .mat-radio-persistent-ripple, &:active .mat-radio-persistent-ripple {
  5638.           background-color: #689f38;
  5639.         }
  5640.       }
  5641.  
  5642.       &.mat-accent {
  5643.         &.mat-radio-checked .mat-radio-outer-circle {
  5644.           border-color: #e0e0e0;
  5645.         }
  5646.  
  5647.         .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), &.mat-radio-checked .mat-radio-persistent-ripple, &:active .mat-radio-persistent-ripple {
  5648.           background-color: #e0e0e0;
  5649.         }
  5650.       }
  5651.  
  5652.       &.mat-warn {
  5653.         &.mat-radio-checked .mat-radio-outer-circle {
  5654.           border-color: #f44336;
  5655.         }
  5656.  
  5657.         .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple), &.mat-radio-checked .mat-radio-persistent-ripple, &:active .mat-radio-persistent-ripple {
  5658.           background-color: #f44336;
  5659.         }
  5660.       }
  5661.  
  5662.       &.mat-radio-disabled {
  5663.         .mat-radio-outer-circle, &.mat-radio-checked .mat-radio-outer-circle {
  5664.           border-color: rgba(0, 0, 0, 0.38);
  5665.         }
  5666.  
  5667.         .mat-radio-inner-circle, .mat-radio-ripple .mat-ripple-element {
  5668.           background-color: rgba(0, 0, 0, 0.38);
  5669.         }
  5670.  
  5671.         .mat-radio-label-content {
  5672.           color: rgba(0, 0, 0, 0.38);
  5673.         }
  5674.       }
  5675.  
  5676.       .mat-ripple-element {
  5677.         background-color: #000;
  5678.       }
  5679.     }
  5680.  
  5681.     .mat-select-value {
  5682.       color: rgba(0, 0, 0, 0.87);
  5683.     }
  5684.  
  5685.     .mat-select-placeholder {
  5686.       color: rgba(0, 0, 0, 0.42);
  5687.     }
  5688.  
  5689.     .mat-select-disabled .mat-select-value {
  5690.       color: rgba(0, 0, 0, 0.38);
  5691.     }
  5692.  
  5693.     .mat-select-arrow {
  5694.       color: rgba(0, 0, 0, 0.54);
  5695.     }
  5696.  
  5697.     .mat-select-panel {
  5698.       background: #fff;
  5699.  
  5700.       &:not([class*=mat-elevation-z]) {
  5701.         box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  5702.       }
  5703.  
  5704.       .mat-option.mat-selected:not(.mat-option-multiple) {
  5705.         background: rgba(0, 0, 0, 0.12);
  5706.       }
  5707.     }
  5708.  
  5709.     .mat-form-field {
  5710.       &.mat-focused {
  5711.         &.mat-primary .mat-select-arrow {
  5712.           color: #689f38;
  5713.         }
  5714.  
  5715.         &.mat-accent .mat-select-arrow {
  5716.           color: #e0e0e0;
  5717.         }
  5718.       }
  5719.  
  5720.       .mat-select.mat-select-invalid .mat-select-arrow, &.mat-focused.mat-warn .mat-select-arrow {
  5721.         color: #f44336;
  5722.       }
  5723.  
  5724.       .mat-select.mat-select-disabled .mat-select-arrow {
  5725.         color: rgba(0, 0, 0, 0.38);
  5726.       }
  5727.     }
  5728.  
  5729.     .mat-drawer-container {
  5730.       background-color: #fafafa;
  5731.       color: rgba(0, 0, 0, 0.87);
  5732.     }
  5733.  
  5734.     .mat-drawer {
  5735.       background-color: #fff;
  5736.       color: rgba(0, 0, 0, 0.87);
  5737.  
  5738.       &.mat-drawer-push {
  5739.         background-color: #fff;
  5740.       }
  5741.  
  5742.       &:not(.mat-drawer-side) {
  5743.         box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12);
  5744.       }
  5745.     }
  5746.  
  5747.     .mat-drawer-side {
  5748.       border-right: 1px solid rgba(0, 0, 0, 0.12);
  5749.  
  5750.       &.mat-drawer-end {
  5751.         border-left: 1px solid rgba(0, 0, 0, 0.12);
  5752.         border-right: none;
  5753.       }
  5754.     }
  5755.  
  5756.     [dir=rtl] .mat-drawer-side {
  5757.       border-left: 1px solid rgba(0, 0, 0, 0.12);
  5758.       border-right: none;
  5759.  
  5760.       &.mat-drawer-end {
  5761.         border-left: none;
  5762.         border-right: 1px solid rgba(0, 0, 0, 0.12);
  5763.       }
  5764.     }
  5765.  
  5766.     .mat-drawer-backdrop.mat-drawer-shown {
  5767.       background-color: rgba(0, 0, 0, 0.6);
  5768.     }
  5769.  
  5770.     .mat-slide-toggle {
  5771.       &.mat-checked {
  5772.         .mat-slide-toggle-thumb {
  5773.           background-color: #e0e0e0;
  5774.         }
  5775.  
  5776.         .mat-slide-toggle-bar {
  5777.           background-color: rgba(224, 224, 224, 0.54);
  5778.         }
  5779.  
  5780.         .mat-ripple-element {
  5781.           background-color: #e0e0e0;
  5782.         }
  5783.       }
  5784.  
  5785.       &.mat-primary.mat-checked {
  5786.         .mat-slide-toggle-thumb {
  5787.           background-color: #689f38;
  5788.         }
  5789.  
  5790.         .mat-slide-toggle-bar {
  5791.           background-color: rgba(104, 159, 56, 0.54);
  5792.         }
  5793.  
  5794.         .mat-ripple-element {
  5795.           background-color: #689f38;
  5796.         }
  5797.       }
  5798.  
  5799.       &.mat-warn.mat-checked {
  5800.         .mat-slide-toggle-thumb {
  5801.           background-color: #f44336;
  5802.         }
  5803.  
  5804.         .mat-slide-toggle-bar {
  5805.           background-color: rgba(244, 67, 54, 0.54);
  5806.         }
  5807.  
  5808.         .mat-ripple-element {
  5809.           background-color: #f44336;
  5810.         }
  5811.       }
  5812.  
  5813.       &:not(.mat-checked) .mat-ripple-element {
  5814.         background-color: #000;
  5815.       }
  5816.     }
  5817.  
  5818.     .mat-slide-toggle-thumb {
  5819.       box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
  5820.       background-color: #fafafa;
  5821.     }
  5822.  
  5823.     .mat-slide-toggle-bar {
  5824.       background-color: rgba(0, 0, 0, 0.38);
  5825.     }
  5826.  
  5827.     .mat-slider-track-background {
  5828.       background-color: rgba(0, 0, 0, 0.26);
  5829.     }
  5830.  
  5831.     .mat-primary {
  5832.       .mat-slider-thumb, .mat-slider-thumb-label, .mat-slider-track-fill {
  5833.         background-color: #689f38;
  5834.       }
  5835.  
  5836.       .mat-slider-thumb-label-text {
  5837.         color: #fff;
  5838.       }
  5839.     }
  5840.  
  5841.     .mat-accent {
  5842.       .mat-slider-thumb, .mat-slider-thumb-label, .mat-slider-track-fill {
  5843.         background-color: #e0e0e0;
  5844.       }
  5845.  
  5846.       .mat-slider-thumb-label-text {
  5847.         color: rgba(0, 0, 0, 0.87);
  5848.       }
  5849.     }
  5850.  
  5851.     .mat-warn {
  5852.       .mat-slider-thumb, .mat-slider-thumb-label, .mat-slider-track-fill {
  5853.         background-color: #f44336;
  5854.       }
  5855.  
  5856.       .mat-slider-thumb-label-text {
  5857.         color: #fff;
  5858.       }
  5859.     }
  5860.  
  5861.     .mat-slider-focus-ring {
  5862.       background-color: rgba(224, 224, 224, 0.2);
  5863.     }
  5864.  
  5865.     .cdk-focused .mat-slider-track-background, .mat-slider:hover .mat-slider-track-background {
  5866.       background-color: rgba(0, 0, 0, 0.38);
  5867.     }
  5868.  
  5869.     .mat-slider-disabled {
  5870.       .mat-slider-thumb, .mat-slider-track-background, .mat-slider-track-fill, &:hover .mat-slider-track-background {
  5871.         background-color: rgba(0, 0, 0, 0.26);
  5872.       }
  5873.     }
  5874.  
  5875.     .mat-slider-min-value {
  5876.       .mat-slider-focus-ring {
  5877.         background-color: rgba(0, 0, 0, 0.12);
  5878.       }
  5879.  
  5880.       &.mat-slider-thumb-label-showing {
  5881.         .mat-slider-thumb, .mat-slider-thumb-label {
  5882.           background-color: rgba(0, 0, 0, 0.87);
  5883.         }
  5884.  
  5885.         &.cdk-focused {
  5886.           .mat-slider-thumb, .mat-slider-thumb-label {
  5887.             background-color: rgba(0, 0, 0, 0.26);
  5888.           }
  5889.         }
  5890.       }
  5891.  
  5892.       &:not(.mat-slider-thumb-label-showing) {
  5893.         .mat-slider-thumb {
  5894.           border-color: rgba(0, 0, 0, 0.26);
  5895.           background-color: transparent;
  5896.         }
  5897.  
  5898.         &.cdk-focused .mat-slider-thumb, &:hover .mat-slider-thumb {
  5899.           border-color: rgba(0, 0, 0, 0.38);
  5900.         }
  5901.  
  5902.         &.cdk-focused.mat-slider-disabled .mat-slider-thumb, &:hover.mat-slider-disabled .mat-slider-thumb {
  5903.           border-color: rgba(0, 0, 0, 0.26);
  5904.         }
  5905.       }
  5906.     }
  5907.  
  5908.     .mat-slider-has-ticks .mat-slider-wrapper::after {