/*!******************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./src/scss/fonts/rubik.css ***!
  \******************************************************************************************************************************************************************************************************************/
@font-face {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 300;
    src: local('Rubik Light'), local('Rubik-Light'), url('rubik.0e8ecd229cfa4a6c.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    src: local('Rubik'), local('Rubik-Regular'), url('rubik.0e8ecd229cfa4a6c.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 500;
    src: local('Rubik Medium'), local('Rubik-Medium'), url('rubik.0e8ecd229cfa4a6c.woff2') format('woff2');
    font-display: swap;
}

@font-face {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 700;
    src: local('Rubik Bold'), local('Rubik-Bold'), url('rubik.0e8ecd229cfa4a6c.woff2') format('woff2');

    font-display: swap;
}
/*
@font-face {
    font-family: 'Rubik';
    src: url("rubik.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
} */

 /* @import url('https://fonts.googleapis.com/css?family=Rubik:300,400,500,700');  */

/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
.mat-ripple{overflow:hidden;position:relative}.mat-ripple:not(:empty){transform:translateZ(0)}.mat-ripple.mat-ripple-unbounded{overflow:visible}.mat-ripple-element{position:absolute;border-radius:50%;pointer-events:none;transition:opacity,transform 0ms cubic-bezier(0, 0, 0.2, 1);transform:scale3d(0, 0, 0)}.cdk-high-contrast-active .mat-ripple-element{display:none}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;top:0;bottom:0;left:0;right:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}textarea.cdk-textarea-autosize{resize:none}textarea.cdk-textarea-autosize-measuring{padding:2px 0 !important;box-sizing:content-box !important;height:auto !important;overflow:hidden !important}textarea.cdk-textarea-autosize-measuring-firefox{padding:2px 0 !important;box-sizing:content-box !important;height:0 !important}@keyframes cdk-text-field-autofill-start{/*!*/}@keyframes cdk-text-field-autofill-end{/*!*/}.cdk-text-field-autofill-monitored:-webkit-autofill{animation:cdk-text-field-autofill-start 0s 1ms}.cdk-text-field-autofill-monitored:not(:-webkit-autofill){animation:cdk-text-field-autofill-end 0s 1ms}.mat-focus-indicator{position:relative}.mat-focus-indicator::before{top:0;left:0;right:0;bottom:0;position:absolute;box-sizing:border-box;pointer-events:none;display:var(--mat-focus-indicator-display, none);border:var(--mat-focus-indicator-border-width, 3px) var(--mat-focus-indicator-border-style, solid) var(--mat-focus-indicator-border-color, transparent);border-radius:var(--mat-focus-indicator-border-radius, 4px)}.mat-focus-indicator:focus::before{content:""}.cdk-high-contrast-active{--mat-focus-indicator-display: block}.mat-mdc-focus-indicator{position:relative}.mat-mdc-focus-indicator::before{top:0;left:0;right:0;bottom:0;position:absolute;box-sizing:border-box;pointer-events:none;display:var(--mat-mdc-focus-indicator-display, none);border:var(--mat-mdc-focus-indicator-border-width, 3px) var(--mat-mdc-focus-indicator-border-style, solid) var(--mat-mdc-focus-indicator-border-color, transparent);border-radius:var(--mat-mdc-focus-indicator-border-radius, 4px)}.mat-mdc-focus-indicator:focus::before{content:""}.cdk-high-contrast-active{--mat-mdc-focus-indicator-display: block}.mat-ripple-element{background-color:rgba(0,0,0,.1)}html{--mat-option-selected-state-label-text-color:#673ab7;--mat-option-label-text-color:rgba(0, 0, 0, 0.87);--mat-option-hover-state-layer-color:rgba(0, 0, 0, 0.04);--mat-option-focus-state-layer-color:rgba(0, 0, 0, 0.04);--mat-option-selected-state-layer-color:rgba(0, 0, 0, 0.04)}.mat-accent{--mat-option-selected-state-label-text-color:#ffd740}.mat-warn{--mat-option-selected-state-label-text-color:#f44336}html{--mat-optgroup-label-text-color:rgba(0, 0, 0, 0.87)}.mat-pseudo-checkbox-full{color:rgba(0,0,0,.54)}.mat-pseudo-checkbox-full.mat-pseudo-checkbox-disabled{color:#b0b0b0}.mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,.mat-primary .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after{color:#673ab7}.mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,.mat-primary .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full{background:#673ab7}.mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,.mat-primary .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after{color:#fafafa}.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after{color:#ffd740}.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full{background:#ffd740}.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after{color:#fafafa}.mat-accent .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,.mat-accent .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after{color:#ffd740}.mat-accent .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,.mat-accent .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full{background:#ffd740}.mat-accent .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,.mat-accent .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after{color:#fafafa}.mat-warn .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,.mat-warn .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after{color:#f44336}.mat-warn .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,.mat-warn .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full{background:#f44336}.mat-warn .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,.mat-warn .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after{color:#fafafa}.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after{color:#b0b0b0}.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full{background:#b0b0b0}.mat-app-background{background-color:#fafafa;color:rgba(0,0,0,.87)}.mat-elevation-z0,.mat-mdc-elevation-specific.mat-elevation-z0{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z1,.mat-mdc-elevation-specific.mat-elevation-z1{box-shadow:0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z2,.mat-mdc-elevation-specific.mat-elevation-z2{box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z3,.mat-mdc-elevation-specific.mat-elevation-z3{box-shadow:0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z4,.mat-mdc-elevation-specific.mat-elevation-z4{box-shadow:0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z5,.mat-mdc-elevation-specific.mat-elevation-z5{box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z6,.mat-mdc-elevation-specific.mat-elevation-z6{box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12)}.mat-elevation-z7,.mat-mdc-elevation-specific.mat-elevation-z7{box-shadow:0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12)}.mat-elevation-z8,.mat-mdc-elevation-specific.mat-elevation-z8{box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12)}.mat-elevation-z9,.mat-mdc-elevation-specific.mat-elevation-z9{box-shadow:0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12)}.mat-elevation-z10,.mat-mdc-elevation-specific.mat-elevation-z10{box-shadow:0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12)}.mat-elevation-z11,.mat-mdc-elevation-specific.mat-elevation-z11{box-shadow:0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12)}.mat-elevation-z12,.mat-mdc-elevation-specific.mat-elevation-z12{box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12)}.mat-elevation-z13,.mat-mdc-elevation-specific.mat-elevation-z13{box-shadow:0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12)}.mat-elevation-z14,.mat-mdc-elevation-specific.mat-elevation-z14{box-shadow:0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12)}.mat-elevation-z15,.mat-mdc-elevation-specific.mat-elevation-z15{box-shadow:0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12)}.mat-elevation-z16,.mat-mdc-elevation-specific.mat-elevation-z16{box-shadow:0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12)}.mat-elevation-z17,.mat-mdc-elevation-specific.mat-elevation-z17{box-shadow:0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12)}.mat-elevation-z18,.mat-mdc-elevation-specific.mat-elevation-z18{box-shadow:0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12)}.mat-elevation-z19,.mat-mdc-elevation-specific.mat-elevation-z19{box-shadow:0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12)}.mat-elevation-z20,.mat-mdc-elevation-specific.mat-elevation-z20{box-shadow:0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12)}.mat-elevation-z21,.mat-mdc-elevation-specific.mat-elevation-z21{box-shadow:0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12)}.mat-elevation-z22,.mat-mdc-elevation-specific.mat-elevation-z22{box-shadow:0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12)}.mat-elevation-z23,.mat-mdc-elevation-specific.mat-elevation-z23{box-shadow:0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12)}.mat-elevation-z24,.mat-mdc-elevation-specific.mat-elevation-z24{box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12)}.mat-theme-loaded-marker{display:none}html{--mat-option-label-text-font:Roboto, sans-serif;--mat-option-label-text-line-height:24px;--mat-option-label-text-size:16px;--mat-option-label-text-tracking:0.03125em;--mat-option-label-text-weight:400}html{--mat-optgroup-label-text-font:Roboto, sans-serif;--mat-optgroup-label-text-line-height:24px;--mat-optgroup-label-text-size:16px;--mat-optgroup-label-text-tracking:0.03125em;--mat-optgroup-label-text-weight:400}.mat-mdc-card{--mdc-elevated-card-container-color:white;--mdc-elevated-card-container-elevation:0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);--mdc-outlined-card-container-color:white;--mdc-outlined-card-outline-color:rgba(0, 0, 0, 0.12);--mdc-outlined-card-container-elevation:0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);--mat-card-subtitle-text-color:rgba(0, 0, 0, 0.54)}.mat-mdc-card{--mat-card-title-text-font:Roboto, sans-serif;--mat-card-title-text-line-height:32px;--mat-card-title-text-size:20px;--mat-card-title-text-tracking:0.0125em;--mat-card-title-text-weight:500;--mat-card-subtitle-text-font:Roboto, sans-serif;--mat-card-subtitle-text-line-height:22px;--mat-card-subtitle-text-size:14px;--mat-card-subtitle-text-tracking:0.0071428571em;--mat-card-subtitle-text-weight:500}.mat-mdc-progress-bar{--mdc-linear-progress-active-indicator-color:#673ab7;--mdc-linear-progress-track-color:rgba(103, 58, 183, 0.25)}@keyframes mdc-linear-progress-buffering{}.mat-mdc-progress-bar .mdc-linear-progress__buffer-dots{background-color:rgba(103, 58, 183, 0.25);background-color:var(--mdc-linear-progress-track-color, rgba(103, 58, 183, 0.25))}@media(forced-colors: active){.mat-mdc-progress-bar .mdc-linear-progress__buffer-dots{background-color:ButtonBorder}}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.mat-mdc-progress-bar .mdc-linear-progress__buffer-dots{background-color:rgba(0,0,0,0);background-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(103, 58, 183, 0.25)'/%3E%3C/svg%3E")}}.mat-mdc-progress-bar .mdc-linear-progress__buffer-bar{background-color:rgba(103, 58, 183, 0.25);background-color:var(--mdc-linear-progress-track-color, rgba(103, 58, 183, 0.25))}.mat-mdc-progress-bar.mat-accent{--mdc-linear-progress-active-indicator-color:#ffd740;--mdc-linear-progress-track-color:rgba(255, 215, 64, 0.25)}@keyframes mdc-linear-progress-buffering{}.mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-dots{background-color:rgba(255, 215, 64, 0.25);background-color:var(--mdc-linear-progress-track-color, rgba(255, 215, 64, 0.25))}@media(forced-colors: active){.mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-dots{background-color:ButtonBorder}}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-dots{background-color:rgba(0,0,0,0);background-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(255, 215, 64, 0.25)'/%3E%3C/svg%3E")}}.mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-bar{background-color:rgba(255, 215, 64, 0.25);background-color:var(--mdc-linear-progress-track-color, rgba(255, 215, 64, 0.25))}.mat-mdc-progress-bar.mat-warn{--mdc-linear-progress-active-indicator-color:#f44336;--mdc-linear-progress-track-color:rgba(244, 67, 54, 0.25)}@keyframes mdc-linear-progress-buffering{}.mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-dots{background-color:rgba(244, 67, 54, 0.25);background-color:var(--mdc-linear-progress-track-color, rgba(244, 67, 54, 0.25))}@media(forced-colors: active){.mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-dots{background-color:ButtonBorder}}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-dots{background-color:rgba(0,0,0,0);background-image:url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(244, 67, 54, 0.25)'/%3E%3C/svg%3E")}}.mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-bar{background-color:rgba(244, 67, 54, 0.25);background-color:var(--mdc-linear-progress-track-color, rgba(244, 67, 54, 0.25))}.mat-mdc-tooltip{--mdc-plain-tooltip-container-color:#616161;--mdc-plain-tooltip-supporting-text-color:#fff}.mat-mdc-tooltip{--mdc-plain-tooltip-supporting-text-font:Roboto, sans-serif;--mdc-plain-tooltip-supporting-text-size:12px;--mdc-plain-tooltip-supporting-text-weight:400;--mdc-plain-tooltip-supporting-text-tracking:0.0333333333em}html{--mdc-filled-text-field-caret-color:#673ab7;--mdc-filled-text-field-focus-active-indicator-color:#673ab7;--mdc-filled-text-field-focus-label-text-color:rgba(103, 58, 183, 0.87);--mdc-filled-text-field-container-color:whitesmoke;--mdc-filled-text-field-disabled-container-color:#fafafa;--mdc-filled-text-field-label-text-color:rgba(0, 0, 0, 0.6);--mdc-filled-text-field-disabled-label-text-color:rgba(0, 0, 0, 0.38);--mdc-filled-text-field-input-text-color:rgba(0, 0, 0, 0.87);--mdc-filled-text-field-disabled-input-text-color:rgba(0, 0, 0, 0.38);--mdc-filled-text-field-input-text-placeholder-color:rgba(0, 0, 0, 0.6);--mdc-filled-text-field-error-focus-label-text-color:#f44336;--mdc-filled-text-field-error-label-text-color:#f44336;--mdc-filled-text-field-error-caret-color:#f44336;--mdc-filled-text-field-active-indicator-color:rgba(0, 0, 0, 0.42);--mdc-filled-text-field-disabled-active-indicator-color:rgba(0, 0, 0, 0.06);--mdc-filled-text-field-hover-active-indicator-color:rgba(0, 0, 0, 0.87);--mdc-filled-text-field-error-active-indicator-color:#f44336;--mdc-filled-text-field-error-focus-active-indicator-color:#f44336;--mdc-filled-text-field-error-hover-active-indicator-color:#f44336;--mdc-outlined-text-field-caret-color:#673ab7;--mdc-outlined-text-field-focus-outline-color:#673ab7;--mdc-outlined-text-field-focus-label-text-color:rgba(103, 58, 183, 0.87);--mdc-outlined-text-field-label-text-color:rgba(0, 0, 0, 0.6);--mdc-outlined-text-field-disabled-label-text-color:rgba(0, 0, 0, 0.38);--mdc-outlined-text-field-input-text-color:rgba(0, 0, 0, 0.87);--mdc-outlined-text-field-disabled-input-text-color:rgba(0, 0, 0, 0.38);--mdc-outlined-text-field-input-text-placeholder-color:rgba(0, 0, 0, 0.6);--mdc-outlined-text-field-error-caret-color:#f44336;--mdc-outlined-text-field-error-focus-label-text-color:#f44336;--mdc-outlined-text-field-error-label-text-color:#f44336;--mdc-outlined-text-field-outline-color:rgba(0, 0, 0, 0.38);--mdc-outlined-text-field-disabled-outline-color:rgba(0, 0, 0, 0.06);--mdc-outlined-text-field-hover-outline-color:rgba(0, 0, 0, 0.87);--mdc-outlined-text-field-error-focus-outline-color:#f44336;--mdc-outlined-text-field-error-hover-outline-color:#f44336;--mdc-outlined-text-field-error-outline-color:#f44336;--mat-form-field-disabled-input-text-placeholder-color:rgba(0, 0, 0, 0.38)}.mat-mdc-form-field-error{color:var(--mdc-theme-error, #f44336)}.mat-mdc-form-field-subscript-wrapper,.mat-mdc-form-field-bottom-align::before{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mat-form-field-subscript-text-font);line-height:var(--mat-form-field-subscript-text-line-height);font-size:var(--mat-form-field-subscript-text-size);letter-spacing:var(--mat-form-field-subscript-text-tracking);font-weight:var(--mat-form-field-subscript-text-weight)}.mat-mdc-form-field-focus-overlay{background-color:rgba(0,0,0,.87)}.mat-mdc-form-field:hover .mat-mdc-form-field-focus-overlay{opacity:.04}.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay{opacity:.12}.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after{color:rgba(0,0,0,.54)}.mat-mdc-form-field-type-mat-native-select.mat-focused.mat-primary .mat-mdc-form-field-infix::after{color:rgba(103,58,183,.87)}.mat-mdc-form-field-type-mat-native-select.mat-focused.mat-accent .mat-mdc-form-field-infix::after{color:rgba(255,215,64,.87)}.mat-mdc-form-field-type-mat-native-select.mat-focused.mat-warn .mat-mdc-form-field-infix::after{color:rgba(244,67,54,.87)}.mat-mdc-form-field-type-mat-native-select.mat-form-field-disabled .mat-mdc-form-field-infix::after{color:rgba(0,0,0,.38)}.mat-mdc-form-field.mat-accent{--mdc-filled-text-field-caret-color:#ffd740;--mdc-filled-text-field-focus-active-indicator-color:#ffd740;--mdc-filled-text-field-focus-label-text-color:rgba(255, 215, 64, 0.87);--mdc-outlined-text-field-caret-color:#ffd740;--mdc-outlined-text-field-focus-outline-color:#ffd740;--mdc-outlined-text-field-focus-label-text-color:rgba(255, 215, 64, 0.87)}.mat-mdc-form-field.mat-warn{--mdc-filled-text-field-caret-color:#f44336;--mdc-filled-text-field-focus-active-indicator-color:#f44336;--mdc-filled-text-field-focus-label-text-color:rgba(244, 67, 54, 0.87);--mdc-outlined-text-field-caret-color:#f44336;--mdc-outlined-text-field-focus-outline-color:#f44336;--mdc-outlined-text-field-focus-label-text-color:rgba(244, 67, 54, 0.87)}.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:1px solid rgba(0,0,0,0)}[dir=rtl] .mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch{border-left:none;border-right:1px solid rgba(0,0,0,0)}.mat-mdc-form-field-infix{min-height:56px}.mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:28px}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY( -34.75px) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));transform:var(--mat-mdc-form-field-label-transform)}.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix{padding-top:16px;padding-bottom:16px}.mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix{padding-top:24px;padding-bottom:8px}.mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:16px;padding-bottom:16px}html{--mdc-filled-text-field-label-text-font:Roboto, sans-serif;--mdc-filled-text-field-label-text-size:16px;--mdc-filled-text-field-label-text-tracking:0.03125em;--mdc-filled-text-field-label-text-weight:400;--mdc-outlined-text-field-label-text-font:Roboto, sans-serif;--mdc-outlined-text-field-label-text-size:16px;--mdc-outlined-text-field-label-text-tracking:0.03125em;--mdc-outlined-text-field-label-text-weight:400;--mat-form-field-container-text-font:Roboto, sans-serif;--mat-form-field-container-text-line-height:24px;--mat-form-field-container-text-size:16px;--mat-form-field-container-text-tracking:0.03125em;--mat-form-field-container-text-weight:400;--mat-form-field-outlined-label-text-populated-size:16px;--mat-form-field-subscript-text-font:Roboto, sans-serif;--mat-form-field-subscript-text-line-height:20px;--mat-form-field-subscript-text-size:12px;--mat-form-field-subscript-text-tracking:0.0333333333em;--mat-form-field-subscript-text-weight:400}html{--mat-select-panel-background-color:white;--mat-select-enabled-trigger-text-color:rgba(0, 0, 0, 0.87);--mat-select-disabled-trigger-text-color:rgba(0, 0, 0, 0.38);--mat-select-placeholder-text-color:rgba(0, 0, 0, 0.6);--mat-select-enabled-arrow-color:rgba(0, 0, 0, 0.54);--mat-select-disabled-arrow-color:rgba(0, 0, 0, 0.38);--mat-select-focused-arrow-color:rgba(103, 58, 183, 0.87);--mat-select-invalid-arrow-color:rgba(244, 67, 54, 0.87)}html .mat-mdc-form-field.mat-accent{--mat-select-panel-background-color:white;--mat-select-enabled-trigger-text-color:rgba(0, 0, 0, 0.87);--mat-select-disabled-trigger-text-color:rgba(0, 0, 0, 0.38);--mat-select-placeholder-text-color:rgba(0, 0, 0, 0.6);--mat-select-enabled-arrow-color:rgba(0, 0, 0, 0.54);--mat-select-disabled-arrow-color:rgba(0, 0, 0, 0.38);--mat-select-focused-arrow-color:rgba(255, 215, 64, 0.87);--mat-select-invalid-arrow-color:rgba(244, 67, 54, 0.87)}html .mat-mdc-form-field.mat-warn{--mat-select-panel-background-color:white;--mat-select-enabled-trigger-text-color:rgba(0, 0, 0, 0.87);--mat-select-disabled-trigger-text-color:rgba(0, 0, 0, 0.38);--mat-select-placeholder-text-color:rgba(0, 0, 0, 0.6);--mat-select-enabled-arrow-color:rgba(0, 0, 0, 0.54);--mat-select-disabled-arrow-color:rgba(0, 0, 0, 0.38);--mat-select-focused-arrow-color:rgba(244, 67, 54, 0.87);--mat-select-invalid-arrow-color:rgba(244, 67, 54, 0.87)}html{--mat-select-trigger-text-font:Roboto, sans-serif;--mat-select-trigger-text-line-height:24px;--mat-select-trigger-text-size:16px;--mat-select-trigger-text-tracking:0.03125em;--mat-select-trigger-text-weight:400}html{--mat-autocomplete-background-color:white}.mat-mdc-dialog-container{--mdc-dialog-container-color:white;--mdc-dialog-subhead-color:rgba(0, 0, 0, 0.87);--mdc-dialog-supporting-text-color:rgba(0, 0, 0, 0.6)}.mat-mdc-dialog-container{--mdc-dialog-subhead-font:Roboto, sans-serif;--mdc-dialog-subhead-line-height:32px;--mdc-dialog-subhead-size:20px;--mdc-dialog-subhead-weight:500;--mdc-dialog-subhead-tracking:0.0125em;--mdc-dialog-supporting-text-font:Roboto, sans-serif;--mdc-dialog-supporting-text-line-height:24px;--mdc-dialog-supporting-text-size:16px;--mdc-dialog-supporting-text-weight:400;--mdc-dialog-supporting-text-tracking:0.03125em}.mat-mdc-standard-chip{--mdc-chip-disabled-label-text-color:#212121;--mdc-chip-elevated-container-color:#e0e0e0;--mdc-chip-elevated-disabled-container-color:#e0e0e0;--mdc-chip-focus-state-layer-color:black;--mdc-chip-focus-state-layer-opacity:0.12;--mdc-chip-label-text-color:#212121;--mdc-chip-with-icon-icon-color:#212121;--mdc-chip-with-icon-disabled-icon-color:#212121;--mdc-chip-with-icon-selected-icon-color:#212121;--mdc-chip-with-trailing-icon-disabled-trailing-icon-color:#212121;--mdc-chip-with-trailing-icon-trailing-icon-color:#212121}.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary,.mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary{--mdc-chip-disabled-label-text-color:white;--mdc-chip-elevated-container-color:#673ab7;--mdc-chip-elevated-disabled-container-color:#673ab7;--mdc-chip-focus-state-layer-color:black;--mdc-chip-focus-state-layer-opacity:0.12;--mdc-chip-label-text-color:white;--mdc-chip-with-icon-icon-color:white;--mdc-chip-with-icon-disabled-icon-color:white;--mdc-chip-with-icon-selected-icon-color:white;--mdc-chip-with-trailing-icon-disabled-trailing-icon-color:white;--mdc-chip-with-trailing-icon-trailing-icon-color:white}.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent,.mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent{--mdc-chip-disabled-label-text-color:rgba(0, 0, 0, 0.87);--mdc-chip-elevated-container-color:#ffd740;--mdc-chip-elevated-disabled-container-color:#ffd740;--mdc-chip-focus-state-layer-color:black;--mdc-chip-focus-state-layer-opacity:0.12;--mdc-chip-label-text-color:rgba(0, 0, 0, 0.87);--mdc-chip-with-icon-icon-color:rgba(0, 0, 0, 0.87);--mdc-chip-with-icon-disabled-icon-color:rgba(0, 0, 0, 0.87);--mdc-chip-with-icon-selected-icon-color:rgba(0, 0, 0, 0.87);--mdc-chip-with-trailing-icon-disabled-trailing-icon-color:rgba(0, 0, 0, 0.87);--mdc-chip-with-trailing-icon-trailing-icon-color:rgba(0, 0, 0, 0.87)}.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn,.mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn{--mdc-chip-disabled-label-text-color:white;--mdc-chip-elevated-container-color:#f44336;--mdc-chip-elevated-disabled-container-color:#f44336;--mdc-chip-focus-state-layer-color:black;--mdc-chip-focus-state-layer-opacity:0.12;--mdc-chip-label-text-color:white;--mdc-chip-with-icon-icon-color:white;--mdc-chip-with-icon-disabled-icon-color:white;--mdc-chip-with-icon-selected-icon-color:white;--mdc-chip-with-trailing-icon-disabled-trailing-icon-color:white;--mdc-chip-with-trailing-icon-trailing-icon-color:white}.mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height:32px}.mat-mdc-standard-chip{--mdc-chip-label-text-font:Roboto, sans-serif;--mdc-chip-label-text-line-height:20px;--mdc-chip-label-text-size:14px;--mdc-chip-label-text-tracking:0.0178571429em;--mdc-chip-label-text-weight:400}.mat-mdc-slide-toggle{--mdc-switch-selected-focus-state-layer-color:#5e35b1;--mdc-switch-selected-handle-color:#5e35b1;--mdc-switch-selected-hover-state-layer-color:#5e35b1;--mdc-switch-selected-pressed-state-layer-color:#5e35b1;--mdc-switch-selected-focus-handle-color:#311b92;--mdc-switch-selected-hover-handle-color:#311b92;--mdc-switch-selected-pressed-handle-color:#311b92;--mdc-switch-selected-focus-track-color:#9575cd;--mdc-switch-selected-hover-track-color:#9575cd;--mdc-switch-selected-pressed-track-color:#9575cd;--mdc-switch-selected-track-color:#9575cd;--mdc-switch-disabled-selected-handle-color:#424242;--mdc-switch-disabled-selected-icon-color:#fff;--mdc-switch-disabled-selected-track-color:#424242;--mdc-switch-disabled-unselected-handle-color:#424242;--mdc-switch-disabled-unselected-icon-color:#fff;--mdc-switch-disabled-unselected-track-color:#424242;--mdc-switch-handle-surface-color:var(--mdc-theme-surface, #fff);--mdc-switch-handle-elevation-shadow:0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);--mdc-switch-handle-shadow-color:black;--mdc-switch-disabled-handle-elevation-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);--mdc-switch-selected-icon-color:#fff;--mdc-switch-unselected-focus-handle-color:#212121;--mdc-switch-unselected-focus-state-layer-color:#424242;--mdc-switch-unselected-focus-track-color:#e0e0e0;--mdc-switch-unselected-handle-color:#616161;--mdc-switch-unselected-hover-handle-color:#212121;--mdc-switch-unselected-hover-state-layer-color:#424242;--mdc-switch-unselected-hover-track-color:#e0e0e0;--mdc-switch-unselected-icon-color:#fff;--mdc-switch-unselected-pressed-handle-color:#212121;--mdc-switch-unselected-pressed-state-layer-color:#424242;--mdc-switch-unselected-pressed-track-color:#e0e0e0;--mdc-switch-unselected-track-color:#e0e0e0}.mat-mdc-slide-toggle .mdc-form-field{color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}.mat-mdc-slide-toggle .mdc-switch--disabled+label{color:rgba(0,0,0,.38)}.mat-mdc-slide-toggle.mat-accent{--mdc-switch-selected-focus-state-layer-color:#ffb300;--mdc-switch-selected-handle-color:#ffb300;--mdc-switch-selected-hover-state-layer-color:#ffb300;--mdc-switch-selected-pressed-state-layer-color:#ffb300;--mdc-switch-selected-focus-handle-color:#ff6f00;--mdc-switch-selected-hover-handle-color:#ff6f00;--mdc-switch-selected-pressed-handle-color:#ff6f00;--mdc-switch-selected-focus-track-color:#ffd54f;--mdc-switch-selected-hover-track-color:#ffd54f;--mdc-switch-selected-pressed-track-color:#ffd54f;--mdc-switch-selected-track-color:#ffd54f}.mat-mdc-slide-toggle.mat-warn{--mdc-switch-selected-focus-state-layer-color:#e53935;--mdc-switch-selected-handle-color:#e53935;--mdc-switch-selected-hover-state-layer-color:#e53935;--mdc-switch-selected-pressed-state-layer-color:#e53935;--mdc-switch-selected-focus-handle-color:#b71c1c;--mdc-switch-selected-hover-handle-color:#b71c1c;--mdc-switch-selected-pressed-handle-color:#b71c1c;--mdc-switch-selected-focus-track-color:#e57373;--mdc-switch-selected-hover-track-color:#e57373;--mdc-switch-selected-pressed-track-color:#e57373;--mdc-switch-selected-track-color:#e57373}.mat-mdc-slide-toggle{--mdc-switch-state-layer-size:48px}.mat-mdc-slide-toggle{--mat-slide-toggle-label-text-font:Roboto, sans-serif;--mat-slide-toggle-label-text-size:14px;--mat-slide-toggle-label-text-tracking:0.0178571429em;--mat-slide-toggle-label-text-line-height:20px;--mat-slide-toggle-label-text-weight:400}.mat-mdc-slide-toggle .mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.875rem;font-size:var(--mdc-typography-body2-font-size, 0.875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit)}.mat-mdc-radio-button .mdc-form-field{color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}.mat-mdc-radio-button.mat-primary{--mdc-radio-disabled-selected-icon-color:#000;--mdc-radio-disabled-unselected-icon-color:#000;--mdc-radio-unselected-hover-icon-color:#212121;--mdc-radio-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-selected-focus-icon-color:#673ab7;--mdc-radio-selected-hover-icon-color:#673ab7;--mdc-radio-selected-icon-color:#673ab7;--mdc-radio-selected-pressed-icon-color:#673ab7;--mat-radio-ripple-color:#000;--mat-radio-checked-ripple-color:#673ab7;--mat-radio-disabled-label-color:rgba(0, 0, 0, 0.38)}.mat-mdc-radio-button.mat-accent{--mdc-radio-disabled-selected-icon-color:#000;--mdc-radio-disabled-unselected-icon-color:#000;--mdc-radio-unselected-hover-icon-color:#212121;--mdc-radio-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-selected-focus-icon-color:#ffd740;--mdc-radio-selected-hover-icon-color:#ffd740;--mdc-radio-selected-icon-color:#ffd740;--mdc-radio-selected-pressed-icon-color:#ffd740;--mat-radio-ripple-color:#000;--mat-radio-checked-ripple-color:#ffd740;--mat-radio-disabled-label-color:rgba(0, 0, 0, 0.38)}.mat-mdc-radio-button.mat-warn{--mdc-radio-disabled-selected-icon-color:#000;--mdc-radio-disabled-unselected-icon-color:#000;--mdc-radio-unselected-hover-icon-color:#212121;--mdc-radio-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-selected-focus-icon-color:#f44336;--mdc-radio-selected-hover-icon-color:#f44336;--mdc-radio-selected-icon-color:#f44336;--mdc-radio-selected-pressed-icon-color:#f44336;--mat-radio-ripple-color:#000;--mat-radio-checked-ripple-color:#f44336;--mat-radio-disabled-label-color:rgba(0, 0, 0, 0.38)}.mat-mdc-radio-button .mdc-radio{--mdc-radio-state-layer-size:40px}.mat-mdc-radio-button .mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.mat-mdc-slider{--mdc-slider-label-container-color:black;--mdc-slider-label-label-text-color:white;--mdc-slider-disabled-handle-color:#000;--mdc-slider-disabled-active-track-color:#000;--mdc-slider-disabled-inactive-track-color:#000;--mdc-slider-with-tick-marks-disabled-container-color:#000;--mat-mdc-slider-value-indicator-opacity: 0.6}.mat-mdc-slider.mat-primary{--mdc-slider-handle-color:#673ab7;--mdc-slider-focus-handle-color:#673ab7;--mdc-slider-hover-handle-color:#673ab7;--mdc-slider-active-track-color:#673ab7;--mdc-slider-inactive-track-color:#673ab7;--mdc-slider-with-tick-marks-active-container-color:#fff;--mdc-slider-with-tick-marks-inactive-container-color:#673ab7;--mat-mdc-slider-ripple-color: #673ab7;--mat-mdc-slider-hover-ripple-color: rgba(103, 58, 183, 0.05);--mat-mdc-slider-focus-ripple-color: rgba(103, 58, 183, 0.2)}.mat-mdc-slider.mat-accent{--mdc-slider-handle-color:#ffd740;--mdc-slider-focus-handle-color:#ffd740;--mdc-slider-hover-handle-color:#ffd740;--mdc-slider-active-track-color:#ffd740;--mdc-slider-inactive-track-color:#ffd740;--mdc-slider-with-tick-marks-active-container-color:#000;--mdc-slider-with-tick-marks-inactive-container-color:#ffd740;--mat-mdc-slider-ripple-color: #ffd740;--mat-mdc-slider-hover-ripple-color: rgba(255, 215, 64, 0.05);--mat-mdc-slider-focus-ripple-color: rgba(255, 215, 64, 0.2)}.mat-mdc-slider.mat-warn{--mdc-slider-handle-color:#f44336;--mdc-slider-focus-handle-color:#f44336;--mdc-slider-hover-handle-color:#f44336;--mdc-slider-active-track-color:#f44336;--mdc-slider-inactive-track-color:#f44336;--mdc-slider-with-tick-marks-active-container-color:#fff;--mdc-slider-with-tick-marks-inactive-container-color:#f44336;--mat-mdc-slider-ripple-color: #f44336;--mat-mdc-slider-hover-ripple-color: rgba(244, 67, 54, 0.05);--mat-mdc-slider-focus-ripple-color: rgba(244, 67, 54, 0.2)}.mat-mdc-slider{--mdc-slider-label-label-text-font:Roboto, sans-serif;--mdc-slider-label-label-text-size:14px;--mdc-slider-label-label-text-line-height:22px;--mdc-slider-label-label-text-tracking:0.0071428571em;--mdc-slider-label-label-text-weight:500}html{--mat-menu-item-label-text-color:rgba(0, 0, 0, 0.87);--mat-menu-item-icon-color:rgba(0, 0, 0, 0.87);--mat-menu-item-hover-state-layer-color:rgba(0, 0, 0, 0.04);--mat-menu-item-focus-state-layer-color:rgba(0, 0, 0, 0.04);--mat-menu-container-color:white}html{--mat-menu-item-label-text-font:Roboto, sans-serif;--mat-menu-item-label-text-size:16px;--mat-menu-item-label-text-tracking:0.03125em;--mat-menu-item-label-text-line-height:24px;--mat-menu-item-label-text-weight:400}.mat-mdc-list-base{--mdc-list-list-item-label-text-color:rgba(0, 0, 0, 0.87);--mdc-list-list-item-supporting-text-color:rgba(0, 0, 0, 0.54);--mdc-list-list-item-leading-icon-color:rgba(0, 0, 0, 0.38);--mdc-list-list-item-trailing-supporting-text-color:rgba(0, 0, 0, 0.38);--mdc-list-list-item-trailing-icon-color:rgba(0, 0, 0, 0.38);--mdc-list-list-item-selected-trailing-icon-color:rgba(0, 0, 0, 0.38);--mdc-list-list-item-disabled-label-text-color:black;--mdc-list-list-item-disabled-leading-icon-color:black;--mdc-list-list-item-disabled-trailing-icon-color:black;--mdc-list-list-item-hover-label-text-color:rgba(0, 0, 0, 0.87);--mdc-list-list-item-hover-leading-icon-color:rgba(0, 0, 0, 0.38);--mdc-list-list-item-hover-trailing-icon-color:rgba(0, 0, 0, 0.38);--mdc-list-list-item-focus-label-text-color:rgba(0, 0, 0, 0.87);--mdc-list-list-item-hover-state-layer-color:black;--mdc-list-list-item-hover-state-layer-opacity:0.04;--mdc-list-list-item-focus-state-layer-color:black;--mdc-list-list-item-focus-state-layer-opacity:0.12}.mdc-list-item__start,.mdc-list-item__end{--mdc-radio-disabled-selected-icon-color:#000;--mdc-radio-disabled-unselected-icon-color:#000;--mdc-radio-unselected-hover-icon-color:#212121;--mdc-radio-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-selected-focus-icon-color:#673ab7;--mdc-radio-selected-hover-icon-color:#673ab7;--mdc-radio-selected-icon-color:#673ab7;--mdc-radio-selected-pressed-icon-color:#673ab7}.mat-accent .mdc-list-item__start,.mat-accent .mdc-list-item__end{--mdc-radio-disabled-selected-icon-color:#000;--mdc-radio-disabled-unselected-icon-color:#000;--mdc-radio-unselected-hover-icon-color:#212121;--mdc-radio-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-selected-focus-icon-color:#ffd740;--mdc-radio-selected-hover-icon-color:#ffd740;--mdc-radio-selected-icon-color:#ffd740;--mdc-radio-selected-pressed-icon-color:#ffd740}.mat-warn .mdc-list-item__start,.mat-warn .mdc-list-item__end{--mdc-radio-disabled-selected-icon-color:#000;--mdc-radio-disabled-unselected-icon-color:#000;--mdc-radio-unselected-hover-icon-color:#212121;--mdc-radio-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-radio-selected-focus-icon-color:#f44336;--mdc-radio-selected-hover-icon-color:#f44336;--mdc-radio-selected-icon-color:#f44336;--mdc-radio-selected-pressed-icon-color:#f44336}.mat-mdc-list-option{--mdc-checkbox-disabled-selected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-disabled-unselected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-selected-checkmark-color:#fff;--mdc-checkbox-selected-focus-icon-color:#673ab7;--mdc-checkbox-selected-hover-icon-color:#673ab7;--mdc-checkbox-selected-icon-color:#673ab7;--mdc-checkbox-selected-pressed-icon-color:#673ab7;--mdc-checkbox-unselected-focus-icon-color:#212121;--mdc-checkbox-unselected-hover-icon-color:#212121;--mdc-checkbox-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-selected-focus-state-layer-color:#673ab7;--mdc-checkbox-selected-hover-state-layer-color:#673ab7;--mdc-checkbox-selected-pressed-state-layer-color:#673ab7;--mdc-checkbox-unselected-focus-state-layer-color:black;--mdc-checkbox-unselected-hover-state-layer-color:black;--mdc-checkbox-unselected-pressed-state-layer-color:black}.mat-mdc-list-option.mat-accent{--mdc-checkbox-disabled-selected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-disabled-unselected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-selected-checkmark-color:#000;--mdc-checkbox-selected-focus-icon-color:#ffd740;--mdc-checkbox-selected-hover-icon-color:#ffd740;--mdc-checkbox-selected-icon-color:#ffd740;--mdc-checkbox-selected-pressed-icon-color:#ffd740;--mdc-checkbox-unselected-focus-icon-color:#212121;--mdc-checkbox-unselected-hover-icon-color:#212121;--mdc-checkbox-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-selected-focus-state-layer-color:#ffd740;--mdc-checkbox-selected-hover-state-layer-color:#ffd740;--mdc-checkbox-selected-pressed-state-layer-color:#ffd740;--mdc-checkbox-unselected-focus-state-layer-color:black;--mdc-checkbox-unselected-hover-state-layer-color:black;--mdc-checkbox-unselected-pressed-state-layer-color:black}.mat-mdc-list-option.mat-warn{--mdc-checkbox-disabled-selected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-disabled-unselected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-selected-checkmark-color:#fff;--mdc-checkbox-selected-focus-icon-color:#f44336;--mdc-checkbox-selected-hover-icon-color:#f44336;--mdc-checkbox-selected-icon-color:#f44336;--mdc-checkbox-selected-pressed-icon-color:#f44336;--mdc-checkbox-unselected-focus-icon-color:#212121;--mdc-checkbox-unselected-hover-icon-color:#212121;--mdc-checkbox-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-selected-focus-state-layer-color:#f44336;--mdc-checkbox-selected-hover-state-layer-color:#f44336;--mdc-checkbox-selected-pressed-state-layer-color:#f44336;--mdc-checkbox-unselected-focus-state-layer-color:black;--mdc-checkbox-unselected-hover-state-layer-color:black;--mdc-checkbox-unselected-pressed-state-layer-color:black}.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__primary-text,.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text{color:#673ab7}.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected.mdc-list-item--with-leading-icon .mdc-list-item__start,.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated.mdc-list-item--with-leading-icon .mdc-list-item__start{color:#673ab7}.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__start,.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__content,.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__end{opacity:1}.mat-mdc-list-base{--mdc-list-list-item-one-line-container-height:48px;--mdc-list-list-item-two-line-container-height:64px;--mdc-list-list-item-three-line-container-height:88px}.mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line,.mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line,.mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line{height:56px}.mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines,.mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines,.mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines{height:72px}.mat-mdc-list-base{--mdc-list-list-item-label-text-font:Roboto, sans-serif;--mdc-list-list-item-label-text-line-height:24px;--mdc-list-list-item-label-text-size:16px;--mdc-list-list-item-label-text-tracking:0.03125em;--mdc-list-list-item-label-text-weight:400;--mdc-list-list-item-supporting-text-font:Roboto, sans-serif;--mdc-list-list-item-supporting-text-line-height:20px;--mdc-list-list-item-supporting-text-size:14px;--mdc-list-list-item-supporting-text-tracking:0.0178571429em;--mdc-list-list-item-supporting-text-weight:400;--mdc-list-list-item-trailing-supporting-text-font:Roboto, sans-serif;--mdc-list-list-item-trailing-supporting-text-line-height:20px;--mdc-list-list-item-trailing-supporting-text-size:12px;--mdc-list-list-item-trailing-supporting-text-tracking:0.0333333333em;--mdc-list-list-item-trailing-supporting-text-weight:400}.mdc-list-group__subheader{font-size:16px;font-weight:400;line-height:28px;font-family:Roboto, sans-serif;letter-spacing:.009375em}html{--mat-paginator-container-text-color:rgba(0, 0, 0, 0.87);--mat-paginator-container-background-color:white;--mat-paginator-enabled-icon-color:rgba(0, 0, 0, 0.54);--mat-paginator-disabled-icon-color:rgba(0, 0, 0, 0.12)}html{--mat-paginator-container-size:56px}.mat-mdc-paginator .mat-mdc-form-field-infix{min-height:40px}.mat-mdc-paginator .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:20px}.mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{--mat-mdc-form-field-label-transform: translateY( -26.75px) scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));transform:var(--mat-mdc-form-field-label-transform)}.mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.mat-mdc-paginator .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix{padding-top:8px;padding-bottom:8px}.mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label{display:none}html{--mat-paginator-container-text-font:Roboto, sans-serif;--mat-paginator-container-text-line-height:20px;--mat-paginator-container-text-size:12px;--mat-paginator-container-text-tracking:0.0333333333em;--mat-paginator-container-text-weight:400;--mat-paginator-select-trigger-text-size:12px}.mat-mdc-tab-group,.mat-mdc-tab-nav-bar{--mdc-tab-indicator-active-indicator-color:#673ab7;--mat-tab-header-disabled-ripple-color:rgba(0, 0, 0, 0.38);--mat-tab-header-pagination-icon-color:#000;--mat-tab-header-inactive-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-active-label-text-color:#673ab7;--mat-tab-header-active-ripple-color:#673ab7;--mat-tab-header-inactive-ripple-color:#673ab7;--mat-tab-header-inactive-focus-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-inactive-hover-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-active-focus-label-text-color:#673ab7;--mat-tab-header-active-hover-label-text-color:#673ab7;--mat-tab-header-active-focus-indicator-color:#673ab7;--mat-tab-header-active-hover-indicator-color:#673ab7}.mat-mdc-tab-group.mat-accent,.mat-mdc-tab-nav-bar.mat-accent{--mdc-tab-indicator-active-indicator-color:#ffd740;--mat-tab-header-disabled-ripple-color:rgba(0, 0, 0, 0.38);--mat-tab-header-pagination-icon-color:#000;--mat-tab-header-inactive-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-active-label-text-color:#ffd740;--mat-tab-header-active-ripple-color:#ffd740;--mat-tab-header-inactive-ripple-color:#ffd740;--mat-tab-header-inactive-focus-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-inactive-hover-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-active-focus-label-text-color:#ffd740;--mat-tab-header-active-hover-label-text-color:#ffd740;--mat-tab-header-active-focus-indicator-color:#ffd740;--mat-tab-header-active-hover-indicator-color:#ffd740}.mat-mdc-tab-group.mat-warn,.mat-mdc-tab-nav-bar.mat-warn{--mdc-tab-indicator-active-indicator-color:#f44336;--mat-tab-header-disabled-ripple-color:rgba(0, 0, 0, 0.38);--mat-tab-header-pagination-icon-color:#000;--mat-tab-header-inactive-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-active-label-text-color:#f44336;--mat-tab-header-active-ripple-color:#f44336;--mat-tab-header-inactive-ripple-color:#f44336;--mat-tab-header-inactive-focus-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-inactive-hover-label-text-color:rgba(0, 0, 0, 0.6);--mat-tab-header-active-focus-label-text-color:#f44336;--mat-tab-header-active-hover-label-text-color:#f44336;--mat-tab-header-active-focus-indicator-color:#f44336;--mat-tab-header-active-hover-indicator-color:#f44336}.mat-mdc-tab-group.mat-background-primary,.mat-mdc-tab-nav-bar.mat-background-primary{--mat-tab-header-with-background-background-color:#673ab7;--mat-tab-header-with-background-foreground-color:white}.mat-mdc-tab-group.mat-background-accent,.mat-mdc-tab-nav-bar.mat-background-accent{--mat-tab-header-with-background-background-color:#ffd740;--mat-tab-header-with-background-foreground-color:rgba(0, 0, 0, 0.87)}.mat-mdc-tab-group.mat-background-warn,.mat-mdc-tab-nav-bar.mat-background-warn{--mat-tab-header-with-background-background-color:#f44336;--mat-tab-header-with-background-foreground-color:white}.mat-mdc-tab-header{--mdc-secondary-navigation-tab-container-height:48px}.mat-mdc-tab-header{--mat-tab-header-label-text-font:Roboto, sans-serif;--mat-tab-header-label-text-size:14px;--mat-tab-header-label-text-tracking:0.0892857143em;--mat-tab-header-label-text-line-height:36px;--mat-tab-header-label-text-weight:500}html{--mdc-checkbox-disabled-selected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-disabled-unselected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-selected-checkmark-color:#000;--mdc-checkbox-selected-focus-icon-color:#ffd740;--mdc-checkbox-selected-hover-icon-color:#ffd740;--mdc-checkbox-selected-icon-color:#ffd740;--mdc-checkbox-selected-pressed-icon-color:#ffd740;--mdc-checkbox-unselected-focus-icon-color:#212121;--mdc-checkbox-unselected-hover-icon-color:#212121;--mdc-checkbox-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-selected-focus-state-layer-color:#ffd740;--mdc-checkbox-selected-hover-state-layer-color:#ffd740;--mdc-checkbox-selected-pressed-state-layer-color:#ffd740;--mdc-checkbox-unselected-focus-state-layer-color:black;--mdc-checkbox-unselected-hover-state-layer-color:black;--mdc-checkbox-unselected-pressed-state-layer-color:black}.mat-mdc-checkbox.mat-primary{--mdc-checkbox-disabled-selected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-disabled-unselected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-selected-checkmark-color:#fff;--mdc-checkbox-selected-focus-icon-color:#673ab7;--mdc-checkbox-selected-hover-icon-color:#673ab7;--mdc-checkbox-selected-icon-color:#673ab7;--mdc-checkbox-selected-pressed-icon-color:#673ab7;--mdc-checkbox-unselected-focus-icon-color:#212121;--mdc-checkbox-unselected-hover-icon-color:#212121;--mdc-checkbox-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-selected-focus-state-layer-color:#673ab7;--mdc-checkbox-selected-hover-state-layer-color:#673ab7;--mdc-checkbox-selected-pressed-state-layer-color:#673ab7;--mdc-checkbox-unselected-focus-state-layer-color:black;--mdc-checkbox-unselected-hover-state-layer-color:black;--mdc-checkbox-unselected-pressed-state-layer-color:black}.mat-mdc-checkbox.mat-warn{--mdc-checkbox-disabled-selected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-disabled-unselected-icon-color:rgba(0, 0, 0, 0.38);--mdc-checkbox-selected-checkmark-color:#fff;--mdc-checkbox-selected-focus-icon-color:#f44336;--mdc-checkbox-selected-hover-icon-color:#f44336;--mdc-checkbox-selected-icon-color:#f44336;--mdc-checkbox-selected-pressed-icon-color:#f44336;--mdc-checkbox-unselected-focus-icon-color:#212121;--mdc-checkbox-unselected-hover-icon-color:#212121;--mdc-checkbox-unselected-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-unselected-pressed-icon-color:rgba(0, 0, 0, 0.54);--mdc-checkbox-selected-focus-state-layer-color:#f44336;--mdc-checkbox-selected-hover-state-layer-color:#f44336;--mdc-checkbox-selected-pressed-state-layer-color:#f44336;--mdc-checkbox-unselected-focus-state-layer-color:black;--mdc-checkbox-unselected-hover-state-layer-color:black;--mdc-checkbox-unselected-pressed-state-layer-color:black}.mat-mdc-checkbox .mdc-form-field{color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}.mat-mdc-checkbox.mat-mdc-checkbox-disabled label{color:rgba(0,0,0,.38)}html{--mdc-checkbox-state-layer-size:40px}.mat-mdc-checkbox .mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-body2-font-size, 14px);line-height:var(--mdc-typography-body2-line-height, 20px);font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);-webkit-text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:var(--mdc-typography-body2-text-transform, none)}.mat-mdc-button.mat-unthemed{--mdc-text-button-label-text-color:#000}.mat-mdc-button.mat-primary{--mdc-text-button-label-text-color:#673ab7}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color:#ffd740}.mat-mdc-button.mat-warn{--mdc-text-button-label-text-color:#f44336}.mat-mdc-button[disabled][disabled]{--mdc-text-button-disabled-label-text-color:rgba(0, 0, 0, 0.38);--mdc-text-button-label-text-color:rgba(0, 0, 0, 0.38)}.mat-mdc-unelevated-button.mat-unthemed{--mdc-filled-button-container-color:#fff;--mdc-filled-button-label-text-color:#000}.mat-mdc-unelevated-button.mat-primary{--mdc-filled-button-container-color:#673ab7;--mdc-filled-button-label-text-color:#fff}.mat-mdc-unelevated-button.mat-accent{--mdc-filled-button-container-color:#ffd740;--mdc-filled-button-label-text-color:#000}.mat-mdc-unelevated-button.mat-warn{--mdc-filled-button-container-color:#f44336;--mdc-filled-button-label-text-color:#fff}.mat-mdc-unelevated-button[disabled][disabled]{--mdc-filled-button-disabled-container-color:rgba(0, 0, 0, 0.12);--mdc-filled-button-disabled-label-text-color:rgba(0, 0, 0, 0.38);--mdc-filled-button-container-color:rgba(0, 0, 0, 0.12);--mdc-filled-button-label-text-color:rgba(0, 0, 0, 0.38)}.mat-mdc-raised-button.mat-unthemed{--mdc-protected-button-container-color:#fff;--mdc-protected-button-label-text-color:#000}.mat-mdc-raised-button.mat-primary{--mdc-protected-button-container-color:#673ab7;--mdc-protected-button-label-text-color:#fff}.mat-mdc-raised-button.mat-accent{--mdc-protected-button-container-color:#ffd740;--mdc-protected-button-label-text-color:#000}.mat-mdc-raised-button.mat-warn{--mdc-protected-button-container-color:#f44336;--mdc-protected-button-label-text-color:#fff}.mat-mdc-raised-button[disabled][disabled]{--mdc-protected-button-disabled-container-color:rgba(0, 0, 0, 0.12);--mdc-protected-button-disabled-label-text-color:rgba(0, 0, 0, 0.38);--mdc-protected-button-container-color:rgba(0, 0, 0, 0.12);--mdc-protected-button-label-text-color:rgba(0, 0, 0, 0.38);--mdc-protected-button-container-elevation:0}.mat-mdc-outlined-button{--mdc-outlined-button-outline-color:rgba(0, 0, 0, 0.12)}.mat-mdc-outlined-button.mat-unthemed{--mdc-outlined-button-label-text-color:#000}.mat-mdc-outlined-button.mat-primary{--mdc-outlined-button-label-text-color:#673ab7}.mat-mdc-outlined-button.mat-accent{--mdc-outlined-button-label-text-color:#ffd740}.mat-mdc-outlined-button.mat-warn{--mdc-outlined-button-label-text-color:#f44336}.mat-mdc-outlined-button[disabled][disabled]{--mdc-outlined-button-label-text-color:rgba(0, 0, 0, 0.38);--mdc-outlined-button-disabled-label-text-color:rgba(0, 0, 0, 0.38);--mdc-outlined-button-outline-color:rgba(0, 0, 0, 0.12);--mdc-outlined-button-disabled-outline-color:rgba(0, 0, 0, 0.12)}.mat-mdc-button,.mat-mdc-outlined-button{--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1)}.mat-mdc-button:hover .mat-mdc-button-persistent-ripple::before,.mat-mdc-outlined-button:hover .mat-mdc-button-persistent-ripple::before{opacity:.04}.mat-mdc-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-outlined-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-outlined-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-button:active .mat-mdc-button-persistent-ripple::before,.mat-mdc-outlined-button:active .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-button.mat-primary,.mat-mdc-outlined-button.mat-primary{--mat-mdc-button-persistent-ripple-color: #673ab7;--mat-mdc-button-ripple-color: rgba(103, 58, 183, 0.1)}.mat-mdc-button.mat-accent,.mat-mdc-outlined-button.mat-accent{--mat-mdc-button-persistent-ripple-color: #ffd740;--mat-mdc-button-ripple-color: rgba(255, 215, 64, 0.1)}.mat-mdc-button.mat-warn,.mat-mdc-outlined-button.mat-warn{--mat-mdc-button-persistent-ripple-color: #f44336;--mat-mdc-button-ripple-color: rgba(244, 67, 54, 0.1)}.mat-mdc-raised-button,.mat-mdc-unelevated-button{--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1)}.mat-mdc-raised-button:hover .mat-mdc-button-persistent-ripple::before,.mat-mdc-unelevated-button:hover .mat-mdc-button-persistent-ripple::before{opacity:.04}.mat-mdc-raised-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-raised-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-unelevated-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-unelevated-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-raised-button:active .mat-mdc-button-persistent-ripple::before,.mat-mdc-unelevated-button:active .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-raised-button.mat-primary,.mat-mdc-unelevated-button.mat-primary{--mat-mdc-button-persistent-ripple-color: #fff;--mat-mdc-button-ripple-color: rgba(255, 255, 255, 0.1)}.mat-mdc-raised-button.mat-accent,.mat-mdc-unelevated-button.mat-accent{--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1)}.mat-mdc-raised-button.mat-warn,.mat-mdc-unelevated-button.mat-warn{--mat-mdc-button-persistent-ripple-color: #fff;--mat-mdc-button-ripple-color: rgba(255, 255, 255, 0.1)}.mat-mdc-button.mat-mdc-button-base,.mat-mdc-raised-button.mat-mdc-button-base,.mat-mdc-unelevated-button.mat-mdc-button-base,.mat-mdc-outlined-button.mat-mdc-button-base{height:36px}.mdc-button{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 14px);line-height:var(--mdc-typography-button-line-height, 36px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, 0.0892857143em);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.mat-mdc-icon-button{--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);--mdc-icon-button-icon-color:inherit;--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1)}.mat-mdc-icon-button:hover .mat-mdc-button-persistent-ripple::before{opacity:.04}.mat-mdc-icon-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-icon-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-icon-button:active .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-icon-button.mat-primary{--mat-mdc-button-persistent-ripple-color: #6200ee;--mat-mdc-button-ripple-color: rgba(98, 0, 238, 0.1)}.mat-mdc-icon-button.mat-accent{--mat-mdc-button-persistent-ripple-color: #018786;--mat-mdc-button-ripple-color: rgba(1, 135, 134, 0.1)}.mat-mdc-icon-button.mat-warn{--mat-mdc-button-persistent-ripple-color: #b00020;--mat-mdc-button-ripple-color: rgba(176, 0, 32, 0.1)}.mat-mdc-icon-button.mat-primary{--mdc-icon-button-icon-color:#673ab7;--mat-mdc-button-persistent-ripple-color: #673ab7;--mat-mdc-button-ripple-color: rgba(103, 58, 183, 0.1)}.mat-mdc-icon-button.mat-accent{--mdc-icon-button-icon-color:#ffd740;--mat-mdc-button-persistent-ripple-color: #ffd740;--mat-mdc-button-ripple-color: rgba(255, 215, 64, 0.1)}.mat-mdc-icon-button.mat-warn{--mdc-icon-button-icon-color:#f44336;--mat-mdc-button-persistent-ripple-color: #f44336;--mat-mdc-button-ripple-color: rgba(244, 67, 54, 0.1)}.mat-mdc-icon-button[disabled][disabled]{--mdc-icon-button-icon-color:rgba(0, 0, 0, 0.38);--mdc-icon-button-disabled-icon-color:rgba(0, 0, 0, 0.38)}.mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size:48px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:12px}.mat-mdc-fab,.mat-mdc-mini-fab{--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1)}.mat-mdc-fab:hover .mat-mdc-button-persistent-ripple::before,.mat-mdc-mini-fab:hover .mat-mdc-button-persistent-ripple::before{opacity:.04}.mat-mdc-fab.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-fab.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-mini-fab.cdk-program-focused .mat-mdc-button-persistent-ripple::before,.mat-mdc-mini-fab.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-fab:active .mat-mdc-button-persistent-ripple::before,.mat-mdc-mini-fab:active .mat-mdc-button-persistent-ripple::before{opacity:.12}.mat-mdc-fab.mat-primary,.mat-mdc-mini-fab.mat-primary{--mat-mdc-button-persistent-ripple-color: #fff;--mat-mdc-button-ripple-color: rgba(255, 255, 255, 0.1)}.mat-mdc-fab.mat-accent,.mat-mdc-mini-fab.mat-accent{--mat-mdc-button-persistent-ripple-color: #000;--mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1)}.mat-mdc-fab.mat-warn,.mat-mdc-mini-fab.mat-warn{--mat-mdc-button-persistent-ripple-color: #fff;--mat-mdc-button-ripple-color: rgba(255, 255, 255, 0.1)}.mat-mdc-fab[disabled][disabled],.mat-mdc-mini-fab[disabled][disabled]{--mdc-fab-container-color:rgba(0, 0, 0, 0.12);--mdc-fab-icon-color:rgba(0, 0, 0, 0.38);--mat-mdc-fab-color: rgba(0, 0, 0, 0.38)}.mat-mdc-fab.mat-unthemed,.mat-mdc-mini-fab.mat-unthemed{--mdc-fab-container-color:white;--mdc-fab-icon-color:black;--mat-mdc-fab-color: #000}.mat-mdc-fab.mat-primary,.mat-mdc-mini-fab.mat-primary{--mdc-fab-container-color:#673ab7;--mdc-fab-icon-color:white;--mat-mdc-fab-color: #fff}.mat-mdc-fab.mat-accent,.mat-mdc-mini-fab.mat-accent{--mdc-fab-container-color:#ffd740;--mdc-fab-icon-color:black;--mat-mdc-fab-color: #000}.mat-mdc-fab.mat-warn,.mat-mdc-mini-fab.mat-warn{--mdc-fab-container-color:#f44336;--mdc-fab-icon-color:white;--mat-mdc-fab-color: #fff}.mdc-fab--extended{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--mdc-typography-button-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:var(--mdc-typography-button-font-size, 14px);line-height:var(--mdc-typography-button-line-height, 36px);font-weight:var(--mdc-typography-button-font-weight, 500);letter-spacing:var(--mdc-typography-button-letter-spacing, 0.0892857143em);-webkit-text-decoration:var(--mdc-typography-button-text-decoration, none);text-decoration:var(--mdc-typography-button-text-decoration, none);text-transform:var(--mdc-typography-button-text-transform, none)}.mat-mdc-extended-fab{--mdc-extended-fab-label-text-font:Roboto, sans-serif;--mdc-extended-fab-label-text-size:14px;--mdc-extended-fab-label-text-tracking:0.0892857143em;--mdc-extended-fab-label-text-weight:500}.mat-mdc-snack-bar-container{--mdc-snackbar-container-color:#333333;--mdc-snackbar-supporting-text-color:rgba(255, 255, 255, 0.87);--mat-snack-bar-button-color:#ffd740}.mat-mdc-snack-bar-container{--mdc-snackbar-supporting-text-font:Roboto, sans-serif;--mdc-snackbar-supporting-text-line-height:20px;--mdc-snackbar-supporting-text-size:14px;--mdc-snackbar-supporting-text-weight:400}html{--mat-table-background-color:white;--mat-table-header-headline-color:rgba(0, 0, 0, 0.87);--mat-table-row-item-label-text-color:rgba(0, 0, 0, 0.87);--mat-table-row-item-outline-color:rgba(0, 0, 0, 0.12)}html{--mat-table-header-container-height:56px;--mat-table-footer-container-height:52px;--mat-table-row-item-container-height:52px}html{--mat-table-header-headline-font:Roboto, sans-serif;--mat-table-header-headline-line-height:22px;--mat-table-header-headline-size:14px;--mat-table-header-headline-weight:500;--mat-table-header-headline-tracking:0.0071428571em;--mat-table-row-item-label-text-font:Roboto, sans-serif;--mat-table-row-item-label-text-line-height:20px;--mat-table-row-item-label-text-size:14px;--mat-table-row-item-label-text-weight:400;--mat-table-row-item-label-text-tracking:0.0178571429em;--mat-table-footer-supporting-text-font:Roboto, sans-serif;--mat-table-footer-supporting-text-line-height:20px;--mat-table-footer-supporting-text-size:14px;--mat-table-footer-supporting-text-weight:400;--mat-table-footer-supporting-text-tracking:0.0178571429em}.mat-mdc-progress-spinner{--mdc-circular-progress-active-indicator-color:#673ab7}.mat-mdc-progress-spinner.mat-accent{--mdc-circular-progress-active-indicator-color:#ffd740}.mat-mdc-progress-spinner.mat-warn{--mdc-circular-progress-active-indicator-color:#f44336}.mat-badge{position:relative}.mat-badge.mat-badge{overflow:visible}.mat-badge-content{position:absolute;text-align:center;display:inline-block;border-radius:50%;transition:transform 200ms ease-in-out;transform:scale(0.6);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;background-color:var(--mat-badge-background-color);color:var(--mat-badge-text-color);font-family:Roboto, sans-serif;font-family:var(--mat-badge-text-font, Roboto, sans-serif);font-size:12px;font-size:var(--mat-badge-text-size, 12px);font-weight:600;font-weight:var(--mat-badge-text-weight, 600)}.cdk-high-contrast-active .mat-badge-content{outline:solid 1px;border-radius:0}.mat-badge-disabled .mat-badge-content{background-color:var(--mat-badge-disabled-state-background-color);color:var(--mat-badge-disabled-state-text-color)}.mat-badge-hidden .mat-badge-content{display:none}.ng-animate-disabled .mat-badge-content,.mat-badge-content._mat-animation-noopable{transition:none}.mat-badge-content.mat-badge-active{transform:none}.mat-badge-small .mat-badge-content{width:16px;height:16px;line-height:16px;font-size:9px;font-size:var(--mat-badge-small-size-text-size, 9px)}.mat-badge-small.mat-badge-above .mat-badge-content{top:-8px}.mat-badge-small.mat-badge-below .mat-badge-content{bottom:-8px}.mat-badge-small.mat-badge-before .mat-badge-content{left:-16px}[dir=rtl] .mat-badge-small.mat-badge-before .mat-badge-content{left:auto;right:-16px}.mat-badge-small.mat-badge-after .mat-badge-content{right:-16px}[dir=rtl] .mat-badge-small.mat-badge-after .mat-badge-content{right:auto;left:-16px}.mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-8px}[dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-8px}.mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-8px}[dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-8px}.mat-badge-medium .mat-badge-content{width:22px;height:22px;line-height:22px}.mat-badge-medium.mat-badge-above .mat-badge-content{top:-11px}.mat-badge-medium.mat-badge-below .mat-badge-content{bottom:-11px}.mat-badge-medium.mat-badge-before .mat-badge-content{left:-22px}[dir=rtl] .mat-badge-medium.mat-badge-before .mat-badge-content{left:auto;right:-22px}.mat-badge-medium.mat-badge-after .mat-badge-content{right:-22px}[dir=rtl] .mat-badge-medium.mat-badge-after .mat-badge-content{right:auto;left:-22px}.mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-11px}[dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-11px}.mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-11px}[dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-11px}.mat-badge-large .mat-badge-content{width:28px;height:28px;line-height:28px;font-size:24px;font-size:var(--mat-badge-large-size-text-size, 24px)}.mat-badge-large.mat-badge-above .mat-badge-content{top:-14px}.mat-badge-large.mat-badge-below .mat-badge-content{bottom:-14px}.mat-badge-large.mat-badge-before .mat-badge-content{left:-28px}[dir=rtl] .mat-badge-large.mat-badge-before .mat-badge-content{left:auto;right:-28px}.mat-badge-large.mat-badge-after .mat-badge-content{right:-28px}[dir=rtl] .mat-badge-large.mat-badge-after .mat-badge-content{right:auto;left:-28px}.mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content{left:-14px}[dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content{left:auto;right:-14px}.mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content{right:-14px}[dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content{right:auto;left:-14px}html{--mat-badge-background-color:#673ab7;--mat-badge-text-color:white;--mat-badge-disabled-state-background-color:#b9b9b9;--mat-badge-disabled-state-text-color:rgba(0, 0, 0, 0.38)}.mat-badge-accent{--mat-badge-background-color:#ffd740;--mat-badge-text-color:rgba(0, 0, 0, 0.87)}.mat-badge-warn{--mat-badge-background-color:#f44336;--mat-badge-text-color:white}html{--mat-badge-text-font:Roboto, sans-serif;--mat-badge-text-size:12px;--mat-badge-text-weight:600;--mat-badge-small-size-text-size:9px;--mat-badge-large-size-text-size:24px}html{--mat-bottom-sheet-container-text-color:rgba(0, 0, 0, 0.87);--mat-bottom-sheet-container-background-color:white}html{--mat-bottom-sheet-container-text-font:Roboto, sans-serif;--mat-bottom-sheet-container-text-line-height:20px;--mat-bottom-sheet-container-text-size:14px;--mat-bottom-sheet-container-text-tracking:0.0178571429em;--mat-bottom-sheet-container-text-weight:400}html{--mat-legacy-button-toggle-text-color:rgba(0, 0, 0, 0.38);--mat-legacy-button-toggle-state-layer-color:rgba(0, 0, 0, 0.12);--mat-legacy-button-toggle-selected-state-text-color:rgba(0, 0, 0, 0.54);--mat-legacy-button-toggle-selected-state-background-color:#e0e0e0;--mat-legacy-button-toggle-disabled-state-text-color:rgba(0, 0, 0, 0.26);--mat-legacy-button-toggle-disabled-state-background-color:#eeeeee;--mat-legacy-button-toggle-disabled-selected-state-background-color:#bdbdbd;--mat-standard-button-toggle-text-color:rgba(0, 0, 0, 0.87);--mat-standard-button-toggle-background-color:white;--mat-standard-button-toggle-state-layer-color:black;--mat-standard-button-toggle-selected-state-background-color:#e0e0e0;--mat-standard-button-toggle-selected-state-text-color:rgba(0, 0, 0, 0.87);--mat-standard-button-toggle-disabled-state-text-color:rgba(0, 0, 0, 0.26);--mat-standard-button-toggle-disabled-state-background-color:white;--mat-standard-button-toggle-disabled-selected-state-text-color:rgba(0, 0, 0, 0.87);--mat-standard-button-toggle-disabled-selected-state-background-color:#bdbdbd;--mat-standard-button-toggle-divider-color:#e0e0e0}html{--mat-standard-button-toggle-height:48px}html{--mat-legacy-button-toggle-text-font:Roboto, sans-serif;--mat-standard-button-toggle-text-font:Roboto, sans-serif}html{--mat-datepicker-calendar-date-selected-state-text-color:white;--mat-datepicker-calendar-date-selected-state-background-color:#673ab7;--mat-datepicker-calendar-date-selected-disabled-state-background-color:rgba(103, 58, 183, 0.4);--mat-datepicker-calendar-date-today-selected-state-outline-color:white;--mat-datepicker-calendar-date-focus-state-background-color:rgba(103, 58, 183, 0.3);--mat-datepicker-calendar-date-hover-state-background-color:rgba(103, 58, 183, 0.3);--mat-datepicker-toggle-active-state-icon-color:#673ab7;--mat-datepicker-calendar-date-in-range-state-background-color:rgba(103, 58, 183, 0.2);--mat-datepicker-calendar-date-in-comparison-range-state-background-color:rgba(249, 171, 0, 0.2);--mat-datepicker-calendar-date-in-overlap-range-state-background-color:#a8dab5;--mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color:#46a35e;--mat-datepicker-toggle-icon-color:rgba(0, 0, 0, 0.54);--mat-datepicker-calendar-body-label-text-color:rgba(0, 0, 0, 0.54);--mat-datepicker-calendar-period-button-icon-color:rgba(0, 0, 0, 0.54);--mat-datepicker-calendar-navigation-button-icon-color:rgba(0, 0, 0, 0.54);--mat-datepicker-calendar-header-divider-color:rgba(0, 0, 0, 0.12);--mat-datepicker-calendar-header-text-color:rgba(0, 0, 0, 0.54);--mat-datepicker-calendar-date-today-outline-color:rgba(0, 0, 0, 0.38);--mat-datepicker-calendar-date-today-disabled-state-outline-color:rgba(0, 0, 0, 0.18);--mat-datepicker-calendar-date-text-color:rgba(0, 0, 0, 0.87);--mat-datepicker-calendar-date-outline-color:transparent;--mat-datepicker-calendar-date-disabled-state-text-color:rgba(0, 0, 0, 0.38);--mat-datepicker-calendar-date-preview-state-outline-color:rgba(0, 0, 0, 0.24);--mat-datepicker-range-input-separator-color:rgba(0, 0, 0, 0.87);--mat-datepicker-range-input-disabled-state-separator-color:rgba(0, 0, 0, 0.38);--mat-datepicker-range-input-disabled-state-text-color:rgba(0, 0, 0, 0.38);--mat-datepicker-calendar-container-background-color:white;--mat-datepicker-calendar-container-text-color:rgba(0, 0, 0, 0.87)}.mat-datepicker-content.mat-accent{--mat-datepicker-calendar-date-selected-state-text-color:rgba(0, 0, 0, 0.87);--mat-datepicker-calendar-date-selected-state-background-color:#ffd740;--mat-datepicker-calendar-date-selected-disabled-state-background-color:rgba(255, 215, 64, 0.4);--mat-datepicker-calendar-date-today-selected-state-outline-color:rgba(0, 0, 0, 0.87);--mat-datepicker-calendar-date-focus-state-background-color:rgba(255, 215, 64, 0.3);--mat-datepicker-calendar-date-hover-state-background-color:rgba(255, 215, 64, 0.3);--mat-datepicker-calendar-date-in-range-state-background-color:rgba(255, 215, 64, 0.2);--mat-datepicker-calendar-date-in-comparison-range-state-background-color:rgba(249, 171, 0, 0.2);--mat-datepicker-calendar-date-in-overlap-range-state-background-color:#a8dab5;--mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color:#46a35e}.mat-datepicker-content.mat-warn{--mat-datepicker-calendar-date-selected-state-text-color:white;--mat-datepicker-calendar-date-selected-state-background-color:#f44336;--mat-datepicker-calendar-date-selected-disabled-state-background-color:rgba(244, 67, 54, 0.4);--mat-datepicker-calendar-date-today-selected-state-outline-color:white;--mat-datepicker-calendar-date-focus-state-background-color:rgba(244, 67, 54, 0.3);--mat-datepicker-calendar-date-hover-state-background-color:rgba(244, 67, 54, 0.3);--mat-datepicker-calendar-date-in-range-state-background-color:rgba(244, 67, 54, 0.2);--mat-datepicker-calendar-date-in-comparison-range-state-background-color:rgba(249, 171, 0, 0.2);--mat-datepicker-calendar-date-in-overlap-range-state-background-color:#a8dab5;--mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color:#46a35e}.mat-datepicker-toggle-active.mat-accent{--mat-datepicker-toggle-active-state-icon-color:#ffd740}.mat-datepicker-toggle-active.mat-warn{--mat-datepicker-toggle-active-state-icon-color:#f44336}.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size:40px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:8px}.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target{display:none}html{--mat-datepicker-calendar-text-font:Roboto, sans-serif;--mat-datepicker-calendar-text-size:13px;--mat-datepicker-calendar-body-label-text-size:14px;--mat-datepicker-calendar-body-label-text-weight:500;--mat-datepicker-calendar-period-button-text-size:14px;--mat-datepicker-calendar-period-button-text-weight:500;--mat-datepicker-calendar-header-text-size:11px;--mat-datepicker-calendar-header-text-weight:400}html{--mat-divider-color:rgba(0, 0, 0, 0.12)}html{--mat-expansion-container-background-color:white;--mat-expansion-container-text-color:rgba(0, 0, 0, 0.87);--mat-expansion-actions-divider-color:rgba(0, 0, 0, 0.12);--mat-expansion-header-hover-state-layer-color:rgba(0, 0, 0, 0.04);--mat-expansion-header-focus-state-layer-color:rgba(0, 0, 0, 0.04);--mat-expansion-header-disabled-state-text-color:rgba(0, 0, 0, 0.26);--mat-expansion-header-text-color:rgba(0, 0, 0, 0.87);--mat-expansion-header-description-color:rgba(0, 0, 0, 0.54);--mat-expansion-header-indicator-color:rgba(0, 0, 0, 0.54)}html{--mat-expansion-header-collapsed-state-height:48px;--mat-expansion-header-expanded-state-height:64px}html{--mat-expansion-header-text-font:Roboto, sans-serif;--mat-expansion-header-text-size:14px;--mat-expansion-header-text-weight:500;--mat-expansion-header-text-line-height:inherit;--mat-expansion-header-text-tracking:inherit;--mat-expansion-container-text-font:Roboto, sans-serif;--mat-expansion-container-text-line-height:20px;--mat-expansion-container-text-size:14px;--mat-expansion-container-text-tracking:0.0178571429em;--mat-expansion-container-text-weight:400}html{--mat-grid-list-tile-header-primary-text-size:14px;--mat-grid-list-tile-header-secondary-text-size:12px;--mat-grid-list-tile-footer-primary-text-size:14px;--mat-grid-list-tile-footer-secondary-text-size:12px}html{--mat-icon-color:inherit}.mat-icon.mat-primary{--mat-icon-color:#673ab7}.mat-icon.mat-accent{--mat-icon-color:#ffd740}.mat-icon.mat-warn{--mat-icon-color:#f44336}html{--mat-sidenav-container-divider-color:rgba(0, 0, 0, 0.12);--mat-sidenav-container-background-color:white;--mat-sidenav-container-text-color:rgba(0, 0, 0, 0.87);--mat-sidenav-content-background-color:#fafafa;--mat-sidenav-content-text-color:rgba(0, 0, 0, 0.87);--mat-sidenav-scrim-color:rgba(0, 0, 0, 0.6)}html{--mat-stepper-header-icon-foreground-color:white;--mat-stepper-header-selected-state-icon-background-color:#673ab7;--mat-stepper-header-selected-state-icon-foreground-color:white;--mat-stepper-header-done-state-icon-background-color:#673ab7;--mat-stepper-header-done-state-icon-foreground-color:white;--mat-stepper-header-edit-state-icon-background-color:#673ab7;--mat-stepper-header-edit-state-icon-foreground-color:white;--mat-stepper-container-color:white;--mat-stepper-line-color:rgba(0, 0, 0, 0.12);--mat-stepper-header-hover-state-layer-color:rgba(0, 0, 0, 0.04);--mat-stepper-header-focus-state-layer-color:rgba(0, 0, 0, 0.04);--mat-stepper-header-label-text-color:rgba(0, 0, 0, 0.54);--mat-stepper-header-optional-label-text-color:rgba(0, 0, 0, 0.54);--mat-stepper-header-selected-state-label-text-color:rgba(0, 0, 0, 0.87);--mat-stepper-header-error-state-label-text-color:#f44336;--mat-stepper-header-icon-background-color:rgba(0, 0, 0, 0.54);--mat-stepper-header-error-state-icon-foreground-color:#f44336;--mat-stepper-header-error-state-icon-background-color:transparent}html .mat-step-header.mat-accent{--mat-stepper-header-icon-foreground-color:rgba(0, 0, 0, 0.87);--mat-stepper-header-selected-state-icon-background-color:#ffd740;--mat-stepper-header-selected-state-icon-foreground-color:rgba(0, 0, 0, 0.87);--mat-stepper-header-done-state-icon-background-color:#ffd740;--mat-stepper-header-done-state-icon-foreground-color:rgba(0, 0, 0, 0.87);--mat-stepper-header-edit-state-icon-background-color:#ffd740;--mat-stepper-header-edit-state-icon-foreground-color:rgba(0, 0, 0, 0.87)}html .mat-step-header.mat-warn{--mat-stepper-header-icon-foreground-color:white;--mat-stepper-header-selected-state-icon-background-color:#f44336;--mat-stepper-header-selected-state-icon-foreground-color:white;--mat-stepper-header-done-state-icon-background-color:#f44336;--mat-stepper-header-done-state-icon-foreground-color:white;--mat-stepper-header-edit-state-icon-background-color:#f44336;--mat-stepper-header-edit-state-icon-foreground-color:white}html{--mat-stepper-header-height:72px}html{--mat-stepper-container-text-font:Roboto, sans-serif;--mat-stepper-header-label-text-font:Roboto, sans-serif;--mat-stepper-header-label-text-size:14px;--mat-stepper-header-label-text-weight:400;--mat-stepper-header-error-state-label-text-size:16px;--mat-stepper-header-selected-state-label-text-size:16px;--mat-stepper-header-selected-state-label-text-weight:400}.mat-sort-header-arrow{color:#757575}html{--mat-toolbar-container-background-color:whitesmoke;--mat-toolbar-container-text-color:rgba(0, 0, 0, 0.87)}.mat-toolbar.mat-primary{--mat-toolbar-container-background-color:#673ab7;--mat-toolbar-container-text-color:white}.mat-toolbar.mat-accent{--mat-toolbar-container-background-color:#ffd740;--mat-toolbar-container-text-color:rgba(0, 0, 0, 0.87)}.mat-toolbar.mat-warn{--mat-toolbar-container-background-color:#f44336;--mat-toolbar-container-text-color:white}html{--mat-toolbar-standard-height:64px;--mat-toolbar-mobile-height:56px}html{--mat-toolbar-title-text-font:Roboto, sans-serif;--mat-toolbar-title-text-line-height:32px;--mat-toolbar-title-text-size:20px;--mat-toolbar-title-text-tracking:0.0125em;--mat-toolbar-title-text-weight:500}.mat-tree{background:#fff}.mat-tree-node,.mat-nested-tree-node{color:rgba(0,0,0,.87)}.mat-tree-node{min-height:48px}.mat-tree{font-family:Roboto, sans-serif}.mat-tree-node,.mat-nested-tree-node{font-weight:400;font-size:14px}.mat-h1,.mat-headline-5,.mat-typography .mat-h1,.mat-typography .mat-headline-5,.mat-typography h1{font-size:24px;font-weight:400;line-height:32px;font-family:Roboto, sans-serif;letter-spacing:normal;margin:0 0 16px}.mat-h2,.mat-headline-6,.mat-typography .mat-h2,.mat-typography .mat-headline-6,.mat-typography h2{font-size:20px;font-weight:500;line-height:32px;font-family:Roboto, sans-serif;letter-spacing:.0125em;margin:0 0 16px}.mat-h3,.mat-subtitle-1,.mat-typography .mat-h3,.mat-typography .mat-subtitle-1,.mat-typography h3{font-size:16px;font-weight:400;line-height:28px;font-family:Roboto, sans-serif;letter-spacing:.009375em;margin:0 0 16px}.mat-h4,.mat-body-1,.mat-typography .mat-h4,.mat-typography .mat-body-1,.mat-typography h4{font-size:16px;font-weight:400;line-height:24px;font-family:Roboto, sans-serif;letter-spacing:.03125em;margin:0 0 16px}.mat-h5,.mat-typography .mat-h5,.mat-typography h5{font:400 calc(14px * 0.83)/20px Roboto, sans-serif;margin:0 0 12px}.mat-h6,.mat-typography .mat-h6,.mat-typography h6{font:400 calc(14px * 0.67)/20px Roboto, sans-serif;margin:0 0 12px}.mat-body-strong,.mat-subtitle-2,.mat-typography .mat-body-strong,.mat-typography .mat-subtitle-2{font-size:14px;font-weight:500;line-height:22px;font-family:Roboto, sans-serif;letter-spacing:.0071428571em}.mat-body,.mat-body-2,.mat-typography .mat-body,.mat-typography .mat-body-2,.mat-typography{font-size:14px;font-weight:400;line-height:20px;font-family:Roboto, sans-serif;letter-spacing:.0178571429em}.mat-body p,.mat-body-2 p,.mat-typography .mat-body p,.mat-typography .mat-body-2 p,.mat-typography p{margin:0 0 12px}.mat-small,.mat-caption,.mat-typography .mat-small,.mat-typography .mat-caption{font-size:12px;font-weight:400;line-height:20px;font-family:Roboto, sans-serif;letter-spacing:.0333333333em}.mat-headline-1,.mat-typography .mat-headline-1{font-size:96px;font-weight:300;line-height:96px;font-family:Roboto, sans-serif;letter-spacing:-0.015625em;margin:0 0 56px}.mat-headline-2,.mat-typography .mat-headline-2{font-size:60px;font-weight:300;line-height:60px;font-family:Roboto, sans-serif;letter-spacing:-.0083333333em;margin:0 0 64px}.mat-headline-3,.mat-typography .mat-headline-3{font-size:48px;font-weight:400;line-height:50px;font-family:Roboto, sans-serif;letter-spacing:normal;margin:0 0 64px}.mat-headline-4,.mat-typography .mat-headline-4{font-size:34px;font-weight:400;line-height:40px;font-family:Roboto, sans-serif;letter-spacing:.0073529412em;margin:0 0 64px}
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/@angular-devkit/build-angular/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/scss/styles.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/* RESET STYLES*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

blockquote, q {
  quotes: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

/* tables still need ?cellspacing=?0?? in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
table td, table th {
  padding: 0;
}

input[type=radio], input[type=checkbox] {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/*--- Text elements --- */
p {
  margin: 0;
}

p img.left {
  float: left;
  padding: 0;
}

p img.right {
  float: right;
}

blockquote {
  color: var(--gray-color3);
  font-style: italic;
}

strong {
  font-weight: bold;
}

em, dfn {
  font-style: italic;
}

sup, sub {
  line-height: 0;
}

abbr, acronym {
  border-bottom: 1px dotted var(--gray-color3);
}

address {
  font-style: italic;
}

del {
  color: var(--gray-color3);
}

a {
  text-decoration: none;
  color: var(--link-color);
  transition: color linear 0.2s;
  cursor: pointer;
}
a:hover {
  text-decoration: underline;
  color: var(--link-color-hover);
  outline: none;
}
a.active, a:active {
  color: var(--link-color-active);
  outline: none;
}

/*--- Lists --- */
ul, ol {
  list-style: none;
  margin: 0;
}

li ul, li ol {
  margin: 0;
}

dl {
  margin: 0;
}

dd {
  margin-left: 0;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.hidden {
  display: none !important;
  visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

.visible {
  visibility: visible !important;
}

*, *:after, *:before {
  box-sizing: border-box;
}

/************Global styles used for all components***********/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
html {
  height: 100%;
}

body {
  font-family: var(--default-font);
  font-feature-settings: "tnum";
  font-weight: 400;
  font-size: var(--default-font-size);
  color: var(--gray-color1);
  line-height: 1.3076923077;
  overflow-y: scroll;
  height: 100%;
  position: relative;
  background: var(--ultra-light-blue1);
}
body > ui-view {
  min-height: 100%;
}
body:before {
  content: "";
  width: 70px;
  height: 70px;
  background: url('loader.4266f1f48ab9faa6.png') center/contain no-repeat;
  animation-name: loading;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  position: absolute;
  left: calc(50% - 35px);
  top: calc(50% - 70px);
}

page-default-master {
  background: var(--ultra-light-blue1);
  position: relative;
  display: block;
  min-height: 100vh;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.1;
}

h1 {
  font-size: 24px;
  font-weight: 600;
  color: var(--black-color0);
}

a.non-underline, span.non-underline {
  font-weight: 500;
  font-size: 11px;
}
a.non-underline:hover, span.non-underline:hover {
  text-decoration: none !important;
}

input, button, textarea {
  font-family: var(--default-font);
}

textarea:disabled {
  cursor: default;
  background-color: light-dark(var(--gray-color29), var(--gray-color30));
}

textarea::placeholder {
  color: var(--default-input-placeholder-color);
  font-style: italic;
  opacity: 1;
}

.intercom-lightweight-app-launcher, .intercom-launcher-frame {
  left: 5px !important;
}

.text-right {
  text-align: right !important;
}

.text-left {
  text-align: left;
}

.link-default {
  color: var(--link-color);
  cursor: pointer;
}
.link-default:hover {
  text-decoration: none;
  color: var(--link-color-hover);
}
.link-default.active, .link-default:active {
  text-decoration: none;
  color: var(--link-color-active);
}
.link-default.disabled {
  pointer-events: none;
  cursor: default;
  color: var(--default-font-color);
  opacity: 0.5;
}

.link-login {
  color: var(--blue-color6);
  cursor: pointer;
  font-weight: 500;
  font-size: 13px;
}
.link-login:hover {
  text-decoration: none;
  color: var(--link-color-hover);
}
.link-login.active, .link-login:active {
  text-decoration: none;
  color: var(--link-color-active);
}
.link-login.disabled {
  pointer-events: none;
  cursor: default;
  color: var(--default-font-color);
  opacity: 0.5;
}

.subtab {
  font-weight: 400;
  font-size: 13px;
  white-space: nowrap;
  text-decoration: none !important;
  border-radius: 20px;
  padding: 6px 15px;
  margin-right: 10px;
  color: var(--blue-color6) !important;
  cursor: pointer;
}
.subtab.active {
  background: var(--button-blue-background);
}
.subtab:hover {
  text-decoration: none !important;
}
.subtab.disabled {
  color: var(--gray-color15) !important;
  cursor: unset !important;
}

a.link-non-decorated:hover, a.link-non-decorated:active {
  text-decoration: none;
}

.hideTransition {
  transition: none !important;
}

.draggable-icon, .draggable-icon:before, .draggable-icon:after {
  content: "";
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 4px;
  background: var(--gray-color2);
}

.draggable-icon {
  top: 50%;
  left: 30px;
  margin-top: -1px;
}
.draggable-icon:before {
  left: 0;
  top: -5px;
}
.draggable-icon:after {
  left: 0;
  bottom: -5px;
}

.upcase-xs, .upcase-s, .upcase-m, .notification-feature, .text-tag, .notification-count,
.upcase-ml, .upcase-l, app-settings-bank-accounts .sub-block-title, app-settings-bank-accounts .accounts-sub-tile, .popover-title .text, .upcase-l-2, app-settings-companies .card-container .card-header .card-title, .card-container .card-header .card-title,
.upcase-l-3, .upcase-xl, .upcase-xxl {
  font-weight: 500;
}

.upcase-xs {
  font-size: 9px;
}

.upcase-s {
  font-size: 10px;
}

.upcase-m, .notification-feature, .text-tag, .notification-count {
  font-size: 11px;
}

.upcase-ml {
  font-size: 12px;
}

.upcase-l, app-settings-bank-accounts .sub-block-title, app-settings-bank-accounts .accounts-sub-tile, .popover-title .text {
  font-size: 13px;
}

.upcase-l-2, app-settings-companies .card-container .card-header .card-title, .card-container .card-header .card-title {
  font-size: 14px;
}

.upcase-l-3 {
  font-size: 15px;
}

.upcase-xl {
  font-size: 16px;
}

.upcase-xxl {
  font-size: 24px;
}

.gray1-text {
  color: var(--gray-color1);
}

.gray2-text, page-planning .cash-flow-table.main-table .item-inner-level3 .title {
  color: var(--gray-color1);
}

.gray11-text {
  color: var(--gray-color11);
}

.black1-text, page-integration-global .dialog-inner .sub-block-title, app-settings-bank-accounts .sub-block-title, app-settings-bank-accounts .accounts-sub-tile, app-settings-companies .card-container .card-header .card-title, .popover-title .text, planning-manage-budget .notifications .notification-item.confirmation .text, planning-manage-budget .notifications .notification-item.info-message .text, .card-container .card-header .card-title {
  color: var(--black-color0);
}

.black2-text {
  color: var(--black-color1);
}

.bold-text {
  font-weight: 500;
}

.white-text {
  color: var(--white-color);
}

.orange-text, planning-manage-budget .notifications .notification-item.warning .icon, planning-manage-budget .notifications .notification-item.warning .text {
  color: var(--orange-color1);
}

.light-orange-text {
  color: var(--orange-color4);
}

.green-text, planning-manage-budget .notifications .notification-item.confirmation .icon {
  color: var(--green-color1);
}

.blue-text, planning-manage-budget .notifications .notification-item.info-message .icon, .text-tag {
  color: var(--blue-color3);
}

.header-text, today-overview-chart .chart-wrapper .chart-content .table-header {
  color: var(--black-color0);
  font-size: 13px;
  font-weight: 500;
}

.capitalize {
  text-transform: capitalize;
}

.bold-default-amount {
  font-weight: 400;
  font-size: 24px;
}

.menu-collapsed .toggle-accounts {
  width: calc(100vw - 370px);
}

.info-block-a {
  align-items: center;
  width: 20px;
  height: auto;
  position: relative;
  display: inline-block;
  text-align: center;
  margin: 0 5px 0;
}
.info-block-a:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image: url(/assets/images/icons/header-my-info-hover.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}

.img-fluid {
  max-width: 100%;
  height: auto;
  display: block;
  width: 100%;
}

.notification-count {
  display: inline-block;
  background-color: var(--notification-color);
  border-radius: 50%;
  width: 14px;
  height: 14px;
  line-height: 14px;
  text-align: center;
  color: var(--white-color);
  font-size: 0;
  position: relative;
}
.notification-count:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 0;
  height: 0;
  border: 2px solid var(--white-color);
  border-radius: var(--border-radius);
}

.text-tag {
  display: inline-block;
  border: 1px solid var(--blue-color3);
  border-radius: var(--border-radius);
  height: 18px;
  line-height: 18px;
  padding: 0px 5px;
  transition: background linear 0.2s;
}
.text-tag.gray {
  border-color: var(--default-border-color);
  color: var(--default-font-color);
}
.text-tag.deletable:after {
  font-family: "DefaultIcons", sans-serif;
  content: "\e870";
  margin-left: 4px;
  font-size: 12px;
  line-height: 17px;
  vertical-align: top;
}
.text-tag:hover, .text-tag:active, .text-tag.active {
  text-decoration: none;
  background: var(--blue-color3);
  color: var(--white-color);
}

.notification-feature {
  display: inline-block;
  background: var(--notification-color);
  height: 18px;
  line-height: 18px;
  padding: 0 7px;
  text-align: center;
  border-radius: 10px;
  color: var(--white-color);
}

[hidden] {
  display: none !important;
}

.clear {
  clear: both;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.text-center {
  text-align: center;
}

.left-aligned {
  margin-right: auto;
}

.right-aligned {
  margin-left: auto;
}

header.side-panel-header {
  padding: 35px 20px 20px;
}

.table-wrap {
  position: relative;
  padding: 15px;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin: 0 25px;
}

table.table thead tr {
  border-bottom: var(--default-border-header);
}
table.table tbody tr {
  border-bottom: var(--default-border);
}

.table-wrapper {
  padding: 15px;
}
.table-wrapper .table-header {
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 13px;
  line-height: 13px;
  border-bottom: var(--default-border-header);
  color: var(--black-color0);
}
.table-wrapper .table-row {
  display: flex;
  align-items: center;
  border-bottom: var(--default-border);
}

.default-table {
  width: 100%;
}
.default-table tbody tr:first-child {
  border-top: var(--default-border);
}
.default-table tbody tr.selected td {
  background: var(--green-color3);
}
.default-table td {
  vertical-align: top;
  padding: 10px 15px;
  border-bottom: var(--default-border);
}
.default-table td:first-child {
  padding-left: 20px;
}
.default-table th {
  text-align: left;
  padding: 5px 15px;
  font-weight: 500;
}
.default-table th:first-child {
  padding-left: 20px;
}
.default-table .icons {
  width: 1%;
  white-space: nowrap;
  text-align: center;
}
.default-table ui-text-box, .default-table ui-dropdown {
  width: 100%;
}

.filter-all ui-dropdown .drp-label {
  padding: 0 20px 0 10px;
}

.row-action {
  display: inline-block;
  flex-shrink: 0;
  cursor: pointer;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  line-height: 40px;
  font-size: 18px;
  text-align: center;
  transition: background linear 0.2s;
}
.row-action .tooltip {
  top: calc(100% + 5px);
  right: 0;
}
.row-action .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 22px);
}
.row-action:hover {
  background: var(--gray-color4);
  text-decoration: none;
}
.row-action.icon-basic-magnifier-plus {
  color: var(--blue-color3);
}
.row-action.icon-basic-share {
  color: var(--default-font-color);
}
.row-action.icon-basic-elaboration-mail-next {
  color: var(--default-font-color);
}
.row-action.icon-basic-trashcan {
  font-size: 16px;
  color: var(--orange-color1);
}
.row-action.disabled {
  pointer-events: none;
  cursor: default;
  color: var(--default-font-color);
  opacity: 0.5;
}

.file-upload-wrapper {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  position: relative;
}
.file-upload-wrapper .input-file {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.file-upload-wrapper:hover {
  cursor: pointer;
}
.file-upload-wrapper:hover ui-button button {
  background: var(--green-color2) !important;
  cursor: pointer;
}

input[type=file]::-webkit-file-upload-button {
  cursor: pointer;
}

.default-font {
  font-family: var(--default-font);
}

.modal-red-title {
  color: var(--orange-color1);
}

.modal-blue-title {
  background: var(--ultra-light-blue2);
  color: var(--gray-color1);
  border-radius: 3px;
  padding: 5px;
  margin: 5px 0;
  display: block;
}

.beta-red-title {
  color: var(--orange-color1);
  font-size: 16px;
  vertical-align: top;
}

.beta {
  color: var(--orange-color1) !important;
  display: inline;
  padding-left: 3px;
}

.modal-gray-title {
  color: var(--gray-color11);
}

.radio-button-subtitle {
  color: var(--gray-color11);
  margin-top: 8px;
  display: block;
  font-weight: 400;
}

.mat-select-value-text {
  font-size: 11px;
  font-weight: 500;
  color: var(--blue-color3);
  font-family: var(--default-font);
}

.mat-select-trigger {
  min-width: 135px;
}

.mat-form-field-appearance-legacy .mat-form-field-infix {
  padding: 19px 0 0 !important;
  border: none;
}

.mat-select-arrow {
  color: var(--blue-color3) !important;
}

.mat-select-panel .mat-option {
  font-family: var(--default-font);
  font-size: 12px !important;
}
.mat-select-panel .mat-option.mat-selected {
  color: var(--blue-color3) !important;
}

mat-accordion, mat-expansion-panel {
  display: block;
}

.mat-datepicker-actions {
  justify-content: space-between !important;
}
.mat-datepicker-actions .mat-button {
  color: var(--blue-color3) !important;
  background-color: unset;
  border-radius: 20px !important;
}
.mat-datepicker-actions .mat-button:hover, .mat-datepicker-actions .mat-button.selected {
  background-color: var(--ultra-light-blue2) !important;
}
.mat-datepicker-actions .apply-button {
  position: absolute !important;
}

.loader {
  color: var(--green-color1);
  height: 30px;
  width: 30px;
  position: relative;
  margin: 0 15px;
}
.loader .image-load {
  width: 30px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -15px 0 0 -15px;
  animation-name: loading;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.loader.hide {
  display: none;
}

@keyframes loading {
  from {
    transform: rotate(0);
  }
  to {
    transform: rotate(360deg);
  }
}
.tooltip-amount {
  display: flex;
  align-items: center;
}
.tooltip-amount .tooltip-amount-positive, .tooltip-amount .tooltip-amount-negative {
  margin-right: 4px;
}

.tooltip-amount-positive {
  font-size: 20px;
  color: var(--green-color1);
}

.tooltip-amount-negative {
  font-size: 20px;
  color: var(--orange-color1);
}

.tooltip-ml-amount-positive {
  font-size: 12px;
  color: var(--green-color1);
}

.tooltip-ml-amount-negative {
  font-size: 12px;
  color: var(--orange-color1);
}

.details-link, .center-details-link {
  cursor: pointer;
  color: var(--blue-color3);
}
.details-link:hover, .center-details-link:hover {
  text-decoration: underline;
}

.center-details-link {
  cursor: pointer;
  text-align: center;
}

.amount-positive {
  font-size: 18px !important;
  line-height: 20px;
  color: var(--green-color1);
}

.amount-negative {
  font-size: 18px !important;
  line-height: 20px;
  color: var(--orange-color1);
}

.no-new-transactions {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
  border-radius: var(--border-radius);
  margin: 25px;
}

.separate {
  padding-right: 5px;
}

.search-text .text-boxes {
  padding-right: 30px !important;
}

.filter-input-wrapper .iconsax {
  position: absolute;
  top: calc(50% - 11px);
  right: 10px;
  cursor: pointer;
}

.filter-btn-wrapper .picker .ngx-datepicker {
  height: 35px;
}

app-manual-search .filter,
app-matched .filter {
  margin-left: 0 !important;
}

app-matched .search-text {
  max-width: unset !important;
}

.search-form {
  display: flex;
  align-items: center;
  flex-direction: column;
}
.search-form__row {
  flex-direction: row;
}
.search-form .filter-row {
  margin-right: auto;
}
.search-form .filter-row:first-child {
  padding-bottom: 5px;
}
.search-form .search-text {
  max-width: 160px;
}
.search-form .search-text .text-boxes {
  padding-right: 25px;
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
.search-form .filter {
  margin-left: 5px;
}
.search-form .drp-label {
  background-color: var(--gray-color13) !important;
  border-radius: 20px !important;
  border: none !important;
}
.search-form ui-dropdown {
  min-width: 160px !important;
}
.search-form ui-dropdown .drp-menu {
  max-width: 500px;
}

.chart-hidden-wrapper {
  width: 0;
  height: 0;
  overflow: hidden;
  position: absolute;
  top: -3000px;
  left: -3000px;
}
.chart-hidden-wrapper.loaded {
  width: 100%;
  height: auto;
  overflow: visible;
  position: static;
}

.dropdown.colored {
  width: 100%;
  display: inline-block;
  vertical-align: top;
  margin: 0;
}
.dropdown.colored .chevronx.iconsax {
  --Iconsax-Color: var(--black-color0);
}
.dropdown.colored .drp-label, .dropdown.colored .label {
  border-radius: 20px;
  justify-content: center;
  border: none;
}
.dropdown.colored .drp-label .text, .dropdown.colored .label .text {
  flex: 1;
  text-align: center;
}

.dropdown.colored.color-1 .chevronx.iconsax {
  --Iconsax-Color: var(--button-text-color);
}
.dropdown.colored.color-1 .drp-label {
  background: var(--orange-color1);
  color: var(--button-text-color);
}
.dropdown.colored.color-2 .chevronx.iconsax {
  --Iconsax-Color: var(--button-dropdown-arrow);
}
.dropdown.colored.color-2 .drp-label {
  border: 1px solid var(--white-color13);
}
.dropdown.colored.color-3 .chevronx.iconsax {
  --Iconsax-Color: var(--button-text-color);
}
.dropdown.colored.color-3 .drp-label {
  background: var(--green-color1);
  color: var(--button-text-color);
}
.dropdown.colored.color-4 .chevronx.iconsax {
  --Iconsax-Color: var(--button-text-color);
}
.dropdown.colored.color-4 .drp-label {
  background: var(--orange-color4);
  color: var(--button-text-color);
}
.dropdown.colored.color-5 .chevronx.iconsax {
  --Iconsax-Color: var(--black-color0);
}
.dropdown.colored.color-5 .drp-label {
  background: var(--gray-color13);
  color: var(--gray-color11);
}
.dropdown.colored.color-6 .chevronx.iconsax {
  --Iconsax-Color: var(--button-text-color);
}
.dropdown.colored.color-6 .drp-label {
  background: var(--blue-color6);
  color: var(--button-text-color);
}
.dropdown.colored.color-7 .chevronx.iconsax {
  --Iconsax-Color: var(--black-color0);
}
.dropdown.colored.color-7 .drp-label {
  background: var(--gray-color14);
  color: var(--gray-color11);
}
.dropdown.colored.color-8 .chevronx.iconsax {
  --Iconsax-Color: var(--white-color);
}
.dropdown.colored.color-8 .drp-label {
  background: var(--black-color0);
  color: var(--white-color);
}
.dropdown.colored.color-9 .chevronx.iconsax {
  --Iconsax-Color: var(--button-text-color);
}
.dropdown.colored.color-9 .drp-label {
  background: var(--green-color2);
  color: var(--button-text-color);
}
.dropdown.colored.color-10 .drp-label {
  border: 1px solid var(--white-color13);
}
.dropdown.colored .drp-label.disabled .chevronx.iconsax {
  display: none;
}

td.colorRow {
  height: 100%;
  position: relative;
  width: 10px;
  padding: 0;
}
td.colorRow .colored {
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
}
td.colorRow .colored .chevronx.iconsax {
  --Iconsax-Color: var(--white-color);
}
td.colorRow .colored.color-2 {
  background: var(--white-color);
  color: var(--green-color5);
}
td.colorRow .colored.color-2 .chevronx.iconsax {
  --Iconsax-Color: var(--black-color0);
}
td.colorRow .colored.color-3 {
  background: var(--green-color1);
  color: var(--white-color);
}
td.colorRow .colored.color-4 {
  background: var(--orange-color4);
  color: var(--white-color);
}
td.colorRow .colored.color-1 {
  background: var(--orange-color1);
  color: var(--white-color);
}
td.colorRow .colored.color-6 {
  background: var(--blue-color6);
  color: var(--white-color);
}
td.colorRow .colored.color-7 {
  background: var(--gray-color14);
  color: var(--gray-color11);
}
td.colorRow .colored.color-8 {
  background: var(--black-color0);
  color: var(--white-color);
}
td.colorRow .colored.color-5 {
  background: var(--gray-color13);
  color: var(--gray-color11);
}
td.colorRow .colored.color-9 {
  background: var(--green-color2);
  color: var(--white-color);
}

.widgets {
  max-width: 1400px;
}

.mat-calendar {
  height: 324px !important;
}
.mat-calendar .mat-calendar-body {
  color: var(--gray-color20) !important;
  font-weight: normal;
  font-family: "Rubik", sans-serif !important;
  font-size: 14px !important;
}
.mat-calendar .mat-calendar-button-1 {
  font-family: "Rubik", sans-serif !important;
  color: var(--gray-color5) !important;
  font-weight: 400 !important;
}
.mat-calendar .mat-calendar-table-header {
  display: none;
}
.mat-calendar .mat-calendar-body-label {
  opacity: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.mat-calendar .mat-calendar-body-selected {
  background-color: var(--green-color1) !important;
  box-shadow: none !important;
  color: white !important;
}
.mat-calendar .mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
  border: 2px solid var(--green-color1) !important;
}

.tooltip-base, today-chart .btn-toggle-wrapper .hint-tooltip, today-overview-chart .btn-toggle-wrapper .hint-tooltip, app-navigation .submenu-item, app-navigation .submenu-title, app-navigation .submenu-drp, .tooltip {
  background: var(--tooltip-background);
  color: var(--tooltip-color);
  line-height: 1;
  font-size: 12px;
  font-weight: normal;
  font-family: "Rubik", sans-serif;
  white-space: nowrap;
  padding: 12px !important;
}

.wrapper-tooltip {
  position: relative;
}
.wrapper-tooltip:hover .tooltip {
  display: block;
}

.tooltip {
  position: absolute;
  height: auto;
  display: none;
  z-index: 10;
  border-radius: var(--border-radius);
  width: auto !important;
  text-align: center;
}
.tooltip:after {
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent var(--tooltip-background) transparent;
}

.card-title-border {
  position: relative;
  margin: 0 15px;
  padding: 15px 0;
}
.card-title-border:after {
  border-bottom: var(--default-border);
  width: 77px;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: var(--gray-color14);
}
.card-title-border span {
  font-weight: 500;
  font-size: 16px;
  color: var(--gray-color5);
}

.tabs-container [nav] {
  border-bottom: var(--default-border);
  height: 40px;
  padding-left: 20px;
  display: flex;
}
.tabs-container [nav] .nav-item {
  padding: 0 20px;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid transparent;
  margin-bottom: -1px;
}
.tabs-container [nav] .nav-item .notifications {
  margin-left: 8px;
}
.tabs-container [nav] .nav-item .text {
  font-size: 15px;
  color: var(--gray-color11);
  transition: linear 0.2s;
}
.tabs-container [nav] .nav-item.active {
  border-bottom: 3px solid var(--green-color1);
}
.tabs-container [nav] .nav-item.active .text {
  color: var(--menu-link-color);
  font-weight: 500;
}
.tabs-container [nav] .nav-item.active .iconsax {
  --Iconsax-Color: var(--gray-color5);
}
.tabs-container [nav] .nav-item:not(.active):hover .text {
  color: var(--link-color-hover);
}
.tabs-container [nav] .nav-item:not(.active):hover .iconsax {
  --Iconsax-Color: var(--blue-color4);
}
.tabs-container .selected {
  width: 134px;
  font-size: 13px;
  height: 32px;
  font-weight: 400;
  background: transparent;
  color: var(--black-color1);
  border: 1px solid var(--gray-color16);
  border-radius: var(--border-radius);
  padding: 0 10px;
  cursor: pointer;
  transition: border-color 0.2s linear;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tabs-container .selected.add-category-select {
  width: calc(100% - 25px);
  margin: 7px 0 0 25px;
}

.setting-container {
  position: relative;
}
.setting-container .edit-plan-popover {
  top: 28px;
  right: 0;
}
.setting-container .edit-plan-popover .inner {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  background: var(--white-color);
  display: flex;
  flex-direction: column;
}
.setting-container .edit-plan-popover ui-button {
  width: 100%;
}
.setting-container .edit-plan-popover ui-button:hover {
  background: var(--dropdown-hower-background);
}
.setting-container .edit-plan-popover ui-button:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.setting-container .edit-plan-popover ui-button:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.setting-container .edit-plan-popover ui-button:not(:last-child) {
  border-bottom: var(--default-border);
}
.setting-container .edit-plan-popover ui-button .textx {
  white-space: nowrap;
}
.setting-container .edit-plan-popover .item {
  display: flex;
  align-items: center;
  padding: 8px;
  cursor: pointer;
  transition: linear 0.2s;
}
.setting-container .edit-plan-popover .item:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.setting-container .edit-plan-popover .item:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.setting-container .edit-plan-popover .item:not(:last-child) {
  border-bottom: var(--default-border);
}
.setting-container .edit-plan-popover .item .iconsax {
  --Iconsax-Size: 20px;
}
.setting-container .edit-plan-popover .item .text {
  margin: 0 8px;
  line-height: 1;
}
.setting-container .edit-plan-popover .item:hover {
  background: var(--dropdown-hower-background);
}
.setting-container .edit-plan-popover .item.activate {
  background: var(--green-color1);
  color: var(--white-color);
}
.setting-container .edit-plan-popover .item.activate:hover {
  background: var(--green-color2);
}
.setting-container .edit-plan-popover .item img {
  width: 15px;
  height: 15px;
}
.setting-container .edit-plan-popover .item.inactivate {
  background: var(--dropdown-hower-background);
}
.setting-container .edit-plan-popover .item.inactivate:hover {
  background: var(--dropdown-hower-background);
}
.setting-container .edit-plan-popover .item .icon-arrows-check {
  font-size: 23px;
  margin: -1px -4px 0;
  height: 15px;
  display: flex;
  align-items: center;
}
.setting-container .edit-plan-popover .item .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
}
.setting-container .edit-plan-popover .item .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 13px;
  height: 11px;
  cursor: pointer;
  background-image: url(/assets/images/icons/filter-variant-plus-blue.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}
.setting-container.to-top ui-basic-popover {
  bottom: 27px;
  top: auto;
}

.picker {
  position: relative;
}
.picker .ngx-datepicker {
  background-color: transparent;
  border-radius: 5px;
  border: 1px solid var(--gray-color14);
  height: 32px;
  padding: 0 30px 0 10px;
  position: relative;
  width: 100%;
  color: var(--black-color0);
}
.picker .ngx-datepicker.gray {
  background-color: var(--gray-color13);
  border-radius: 20px;
  border: none;
  font-size: 13px;
  color: var(--gray-color5);
}
.picker .ngx-datepicker.gray::placeholder {
  color: var(--default-input-placeholder-color);
  font-style: italic;
  opacity: 1;
}
.picker .ngx-datepicker.whiteBg {
  background: var(--white-color);
}
.picker .md-drppicker {
  margin-top: 0 !important;
  display: flex;
  background: var(--white-input-background);
}
.picker .md-drppicker .calendar-table {
  border: 1px solid var(--white-color);
  background: var(--white-input-background);
}
.picker .md-drppicker td.off {
  background: var(--ultra-light-blue1);
}
.picker .md-drppicker td.available.prev,
.picker .md-drppicker th.available.prev,
.picker .md-drppicker td.available.next,
.picker .md-drppicker th.available.next {
  opacity: 0.8;
  transition: background-color 0.2s ease;
  border-radius: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.picker .md-drppicker td.available.prev::before,
.picker .md-drppicker th.available.prev::before,
.picker .md-drppicker td.available.next::before,
.picker .md-drppicker th.available.next::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background-color: var(--black-color0);
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 3.7 6"><path d="M3.7 0.7L2.3 3.0 3.7 5.3 3 6 0 3 3 0 3.7 0.7"/></svg>');
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
.picker .md-drppicker td.available.prev:hover,
.picker .md-drppicker th.available.prev:hover,
.picker .md-drppicker td.available.next:hover,
.picker .md-drppicker th.available.next:hover {
  background-color: var(--gray-color9);
}
.picker .md-drppicker td.available.next,
.picker .md-drppicker th.available.next {
  transform: rotate(180deg);
}
.picker.blue {
  position: relative;
}
.picker.blue label {
  display: none;
}
.picker.blue .ngx-datepicker {
  border: none;
  width: 80px;
  padding: 0;
  height: auto;
  color: var(--blue-color3);
  cursor: pointer;
}
.picker.blue .ngx-datepicker.disabled {
  cursor: default;
  color: var(--gray-color3);
}
.picker.blue .ngx-datepicker.disabled:hover {
  color: var(--gray-color3);
}
.picker.blue .ngx-datepicker:hover {
  color: var(--blue-color8);
}
.picker.blue .md-drppicker {
  margin-top: unset;
}
.picker.gray .ngx-datepicker {
  background-color: var(--gray-color13);
  border-radius: 20px;
  border: none;
  font-size: 13px;
  color: var(--gray-color5);
}
.picker.gray .ngx-datepicker::placeholder {
  color: var(--default-input-placeholder-color);
  font-style: italic;
  opacity: 1;
}
.picker .md-drppicker th.month > div {
  padding-right: 10px;
  margin-right: 5px;
}
.picker .md-drppicker .calendar td {
  height: 32px;
  width: 32px;
}
.picker .md-drppicker td.start-date.end-date {
  border-radius: 50%;
}
.picker .date-range-picker-icon, .picker .date-range-picker-clear {
  position: absolute;
  right: 5px;
  top: calc(50% - 10px);
  cursor: pointer;
}
.picker ngx-daterangepicker-material * {
  font-family: "Rubik", sans-serif;
}
.picker ngx-daterangepicker-material tbody, .picker ngx-daterangepicker-material tfoot, .picker ngx-daterangepicker-material thead, .picker ngx-daterangepicker-material tr, .picker ngx-daterangepicker-material th, .picker ngx-daterangepicker-material td {
  vertical-align: middle !important;
}
.picker ngx-daterangepicker-material .md-drppicker td.in-range {
  background-color: var(--white-color1) !important;
  color: var(--black-color0);
}
.picker ngx-daterangepicker-material .md-drppicker td.active, .picker ngx-daterangepicker-material .md-drppicker td.active:hover {
  background-color: var(--green-color1) !important;
}
.picker ngx-daterangepicker-material .md-drppicker th {
  color: var(--gray-color1);
  font-weight: 400;
}
.picker ngx-daterangepicker-material .ranges {
  margin-top: 35px;
  width: max-content;
}
.picker ngx-daterangepicker-material .md-drppicker .ranges ul li {
  margin-bottom: 2px;
  border-radius: 20px;
}
.picker ngx-daterangepicker-material .md-drppicker .ranges ul li:hover, .picker ngx-daterangepicker-material .md-drppicker .ranges ul li.active {
  background: var(--button-blue-date-range);
}
.picker ngx-daterangepicker-material .md-drppicker .ranges ul li > button {
  color: var(--blue-color3);
}
.picker ngx-daterangepicker-material .md-drppicker .ranges ul li > button.active {
  background-color: var(--button-blue-date-range);
  color: var(--blue-color3);
  border-radius: 20px;
}
.picker .invalid {
  border-color: var(--orange-color1) !important;
}

:root {
  --Iconsax-Size: 20px;
  --Iconsax-Color: var(--gray-color1);
  --ff-primary-color: var(--green-color1) !important;
  --ff-secondary-color: var(--gray-color1) !important;
  --ff-text-color: var(--blue-color16) !important;
  --ff-dialog-border-radius: 4px !important;
  --ff-border-radius: 5px !important;
  --ff-bg-fade: var(--black-color8) !important;
}

.iconsax {
  display: inline-block;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: var(--Iconsax-Size);
  vertical-align: middle;
}
.iconsax.iconsax-red {
  --Iconsax-Color: var(--orange-color1);
}
.iconsax.iconsax-green {
  --Iconsax-Color: var(--green-color1);
}
.iconsax.iconsax-blue {
  --Iconsax-Color: var(--blue-color6);
}
.iconsax.iconsax-black {
  --Iconsax-Color: var(--black-color0);
}
.iconsax.iconsax-white {
  --Iconsax-Color: var(--white-color);
}
.iconsax.iconsax-white-icon {
  --Iconsax-Color: var(--button-text-color);
}

.confirm-delete .text-boxes {
  text-align: left;
}

.iconsax svg {
  display: block;
  width: var(--Iconsax-Size);
  height: var(--Iconsax-Size);
}

.iconsax svg [stroke] {
  stroke: var(--Iconsax-Color);
}

.iconsax svg [fill] {
  fill: var(--Iconsax-Color);
}

.ngx-toastr {
  border-radius: 5px !important;
  box-shadow: 0 0 10px var(--input-shadow-color) !important;
}

.ngx-toastr.toast-info {
  background-color: var(--button-blue-background);
  background-image: url(/assets/images/iconsax/life-buoy-blue.svg);
}
.ngx-toastr.toast-info .toast-title {
  font-weight: bold;
  color: var(--gray-color5);
}
.ngx-toastr.toast-info .toast-message {
  word-wrap: break-word;
  color: var(--gray-color1);
}

.ngx-toastr.toast-error {
  background-color: var(--orange-color5);
  background-image: url(/assets/images/iconsax/danger-red.svg);
}
.ngx-toastr.toast-error .toast-title {
  font-weight: bold;
  color: var(--black-color0);
}
.ngx-toastr.toast-error .toast-message {
  word-wrap: break-word;
  color: var(--black-color0);
}

.theme-dark .ngx-toastr.toast-error .toast-title,
.theme-dark .ngx-toastr.toast-error .toast-message {
  color: var(--orange-color1);
}

.ngx-toastr.toast-success {
  background-color: var(--green-color6);
  background-image: url(/assets/images/iconsax/tick-circle-green.svg);
}
.ngx-toastr.toast-success .toast-title {
  font-weight: bold;
  color: var(--gray-color5);
}
.ngx-toastr.toast-success .toast-message {
  word-wrap: break-word;
  color: var(--gray-color1);
}

.mat-chip-remove {
  display: flex;
  align-items: center;
}

.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before {
  border: none !important;
}

.mat-chip-list-wrapper {
  border: 1px solid var(--gray-color14);
  border-radius: 5px;
}

.mdc-line-ripple {
  display: none !important;
}

.mdc-list-item .mat-pseudo-checkbox {
  display: none;
}
.mdc-list-item .mdc-list-item__primary-text {
  color: var(--black-color0) !important;
}

.mdc-list-item--selected {
  background: none !important;
}
.mdc-list-item--selected:hover {
  background: var(--black-color4);
}

.mat-chip-list .mat-mdc-chip-input {
  font-size: 13px !important;
  padding-left: 5px;
}

.mdc-menu-surface.mat-mdc-autocomplete-panel {
  padding: 0 !important;
  background: var(--white-color);
}

.mat-mdc-option {
  padding: 0 !important;
}
.mat-mdc-option span {
  padding-left: 16px;
  padding-right: 16px;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
}

.stick-header {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--white-color);
  border-radius: var(--border-radius);
}

transactions-rules .mat-mdc-text-field-wrapper, invoices-rules .mat-mdc-text-field-wrapper, planning-edit-budget-dialog .mat-mdc-text-field-wrapper, transaction-expected-dialog .mat-mdc-text-field-wrapper, payables-dialog .mat-mdc-text-field-wrapper {
  background: none !important;
  padding: 0;
}
transactions-rules .mat-chip-list-wrapper, invoices-rules .mat-chip-list-wrapper, planning-edit-budget-dialog .mat-chip-list-wrapper, transaction-expected-dialog .mat-chip-list-wrapper, payables-dialog .mat-chip-list-wrapper {
  margin: 0 !important;
}
transactions-rules .mat-mdc-form-field-infix, invoices-rules .mat-mdc-form-field-infix, planning-edit-budget-dialog .mat-mdc-form-field-infix, transaction-expected-dialog .mat-mdc-form-field-infix, payables-dialog .mat-mdc-form-field-infix {
  padding: 0 !important;
  min-height: auto !important;
}
transactions-rules .mat-chip-remove .mat-icon,
transactions-rules .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing, invoices-rules .mat-chip-remove .mat-icon,
invoices-rules .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing, planning-edit-budget-dialog .mat-chip-remove .mat-icon,
planning-edit-budget-dialog .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing, transaction-expected-dialog .mat-chip-remove .mat-icon,
transaction-expected-dialog .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing, payables-dialog .mat-chip-remove .mat-icon,
payables-dialog .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing {
  width: 20px !important;
  height: 20px !important;
}
transactions-rules .mat-mdc-form-field-focus-overlay, invoices-rules .mat-mdc-form-field-focus-overlay, planning-edit-budget-dialog .mat-mdc-form-field-focus-overlay, transaction-expected-dialog .mat-mdc-form-field-focus-overlay, payables-dialog .mat-mdc-form-field-focus-overlay {
  background-color: transparent !important;
}
transactions-rules .mdc-evolution-chip__cell--primary, invoices-rules .mdc-evolution-chip__cell--primary, planning-edit-budget-dialog .mdc-evolution-chip__cell--primary, transaction-expected-dialog .mdc-evolution-chip__cell--primary, payables-dialog .mdc-evolution-chip__cell--primary {
  overflow: hidden !important;
}

:root {
  --ff-primary-color: var(--green-color1) !important;
  --ff-secondary-color: var(--gray-color31) !important;
  --ff-text-color: var(--blue-color16) !important;
  --ff-dialog-border-radius: 4px !important;
  --ff-border-radius: 5px !important;
  --ff-bg-fade: var(--black-color8) !important;
}

.flatfile_primary {
  border: 1px solid var(--ff-primary-color);
  background-color: var(--ff-primary-color);
  color: var(--white-color);
}

.flatfile_primary {
  border: 1px solid var(--ff-primary-color) !important;
  border-radius: 20px !important;
  background-color: var(--ff-primary-color) !important;
  color: var(--white-color);
}

.flatfile_secondary {
  border: 1px solid var(--ff-secondary-color) !important;
  border-radius: 20px !important;
  background-color: transparent;
  color: var(--gray-color1);
}

.flatfile_iframe-wrapper {
  min-height: 700px !important;
}

.flatfile_displayAsModal #flatfile_iframe {
  min-height: 700px !important;
  height: calc(100vh - 100px) !important;
}

.mdc-evolution-chip__text-label .chip-name {
  color: var(--black-color0);
  font-size: 13px;
}

.mat-mdc-input-element {
  color: var(--black-color0) !important;
}
.mat-mdc-input-element::placeholder {
  color: var(--input-color-placeholder) !important;
}

.drp-menu .custom-switch-btn {
  background-color: var(--selector-checkbox-background) !important;
}
.drp-menu .custom-switch.custom-switch-label-io .custom-switch-input:checked + .custom-switch-btn {
  background-color: var(--green-color1) !important;
}
.drp-menu .custom-switch-btn.disabled {
  opacity: 0.4;
}

wg-group-snapshot-charts .highcharts-label span {
  font-size: 13px;
  line-height: 20px;
}

.contracts-search-field .search-text .text-boxes {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-sign-in, page-sign-up {
  min-height: 100vh;
}

page-login-master, page-sign-up, page-sign-in, page-restoring, page-resent-password, page-new-password {
  display: flex;
  min-height: 100vh;
}
page-login-master .phone-bar, page-sign-up .phone-bar, page-sign-in .phone-bar, page-restoring .phone-bar, page-resent-password .phone-bar, page-new-password .phone-bar {
  background: var(--white-color);
  display: flex;
  flex-direction: column;
  color: var(--white-color);
  width: 100%;
  padding: 24px 30px 10px;
}
page-login-master .right-bar, page-sign-up .right-bar, page-sign-in .right-bar, page-restoring .right-bar, page-resent-password .right-bar, page-new-password .right-bar {
  flex-grow: 0;
  background: var(--gray-color6);
  width: 420px;
  box-shadow: 0 0 -4px rgba(0, 0, 0, 0.7);
  display: flex;
  flex-direction: column;
  align-items: center;
}
page-login-master .right-bar .logo, page-sign-up .right-bar .logo, page-sign-in .right-bar .logo, page-restoring .right-bar .logo, page-resent-password .right-bar .logo, page-new-password .right-bar .logo {
  margin-top: 25px;
}
page-login-master .right-bar-signin, page-sign-up .right-bar-signin, page-sign-in .right-bar-signin, page-restoring .right-bar-signin, page-resent-password .right-bar-signin, page-new-password .right-bar-signin {
  display: flex;
  width: 60%;
  flex-grow: 1;
  background-color: var(--ultra-light-blue1);
  position: relative;
}
page-login-master .right-bar-signin.en, page-sign-up .right-bar-signin.en, page-sign-in .right-bar-signin.en, page-restoring .right-bar-signin.en, page-resent-password .right-bar-signin.en, page-new-password .right-bar-signin.en {
  background: url(/assets/images/login_image_2025_EN.png) 100% 50%/90% auto no-repeat var(--ultra-light-blue1);
}
page-login-master .right-bar-signin.de, page-sign-up .right-bar-signin.de, page-sign-in .right-bar-signin.de, page-restoring .right-bar-signin.de, page-resent-password .right-bar-signin.de, page-new-password .right-bar-signin.de {
  background: url(/assets/images/login_image_2025.png) 100% 50%/90% auto no-repeat var(--ultra-light-blue1);
}
page-login-master .right-bar-signin.it, page-sign-up .right-bar-signin.it, page-sign-in .right-bar-signin.it, page-restoring .right-bar-signin.it, page-resent-password .right-bar-signin.it, page-new-password .right-bar-signin.it {
  background: url(/assets/images/login_image_2025_IT.png) 100% 50%/95% auto no-repeat var(--ultra-light-blue1);
}
page-login-master .right-bar-signin:hover, page-sign-up .right-bar-signin:hover, page-sign-in .right-bar-signin:hover, page-restoring .right-bar-signin:hover, page-resent-password .right-bar-signin:hover, page-new-password .right-bar-signin:hover {
  cursor: pointer;
}
page-login-master .right-bar-signup, page-sign-up .right-bar-signup, page-sign-in .right-bar-signup, page-restoring .right-bar-signup, page-resent-password .right-bar-signup, page-new-password .right-bar-signup {
  background-color: var(--ultra-light-blue1);
  position: relative;
  display: flex;
  width: 60%;
  flex-grow: 1;
  background: url(/assets/images/signup_image_2025a.png) 100% 50%/90% auto no-repeat var(--ultra-light-blue1);
}
page-login-master .right-bar-signup.en, page-sign-up .right-bar-signup.en, page-sign-in .right-bar-signup.en, page-restoring .right-bar-signup.en, page-resent-password .right-bar-signup.en, page-new-password .right-bar-signup.en {
  background: url(/assets/images/signup_image_2025_EN.png) 100% 50%/90% auto no-repeat var(--ultra-light-blue1);
}
page-login-master .right-bar-signup.it, page-sign-up .right-bar-signup.it, page-sign-in .right-bar-signup.it, page-restoring .right-bar-signup.it, page-resent-password .right-bar-signup.it, page-new-password .right-bar-signup.it {
  background: url(/assets/images/signup_image_2025_IT.png) 100% 50%/90% auto no-repeat var(--ultra-light-blue1);
}
page-login-master .left-bar-signup, page-sign-up .left-bar-signup, page-sign-in .left-bar-signup, page-restoring .left-bar-signup, page-resent-password .left-bar-signup, page-new-password .left-bar-signup {
  flex-grow: 1;
  background: url(/assets/images/signup-bg.jpg) left top;
  background-size: cover;
}
page-login-master .left-bar-new-password, page-sign-up .left-bar-new-password, page-sign-in .left-bar-new-password, page-restoring .left-bar-new-password, page-resent-password .left-bar-new-password, page-new-password .left-bar-new-password {
  flex-grow: 1;
  background: url(/assets/images/signup-bg.jpg) left top;
  background-size: cover;
}
page-login-master .left-bar, page-login-master .left-bar-signup, page-sign-up .left-bar, page-sign-up .left-bar-signup, page-sign-in .left-bar, page-sign-in .left-bar-signup, page-restoring .left-bar, page-restoring .left-bar-signup, page-resent-password .left-bar, page-resent-password .left-bar-signup, page-new-password .left-bar, page-new-password .left-bar-signup {
  flex-grow: 0;
  background: var(--white-color);
  width: 40%;
  min-width: 300px;
  box-shadow: 0 0 -4px var(--shadow-color2);
  display: flex;
  flex-direction: column;
  align-items: center;
}
page-login-master .left-bar .logo, page-login-master .left-bar-signup .logo, page-sign-up .left-bar .logo, page-sign-up .left-bar-signup .logo, page-sign-in .left-bar .logo, page-sign-in .left-bar-signup .logo, page-restoring .left-bar .logo, page-restoring .left-bar-signup .logo, page-resent-password .left-bar .logo, page-resent-password .left-bar-signup .logo, page-new-password .left-bar .logo, page-new-password .left-bar-signup .logo {
  margin: 0 auto 45px;
}
page-login-master .left-bar .logo img, page-login-master .left-bar-signup .logo img, page-sign-up .left-bar .logo img, page-sign-up .left-bar-signup .logo img, page-sign-in .left-bar .logo img, page-sign-in .left-bar-signup .logo img, page-restoring .left-bar .logo img, page-restoring .left-bar-signup .logo img, page-resent-password .left-bar .logo img, page-resent-password .left-bar-signup .logo img, page-new-password .left-bar .logo img, page-new-password .left-bar-signup .logo img {
  width: 157px;
  height: 41px;
}
@media (max-height: 800px) {
  page-login-master .left-bar .logo, page-login-master .left-bar-signup .logo, page-sign-up .left-bar .logo, page-sign-up .left-bar-signup .logo, page-sign-in .left-bar .logo, page-sign-in .left-bar-signup .logo, page-restoring .left-bar .logo, page-restoring .left-bar-signup .logo, page-resent-password .left-bar .logo, page-resent-password .left-bar-signup .logo, page-new-password .left-bar .logo, page-new-password .left-bar-signup .logo {
    top: 25px;
  }
}
page-login-master .left-bar .main-view, page-login-master .left-bar-signup .main-view, page-sign-up .left-bar .main-view, page-sign-up .left-bar-signup .main-view, page-sign-in .left-bar .main-view, page-sign-in .left-bar-signup .main-view, page-restoring .left-bar .main-view, page-restoring .left-bar-signup .main-view, page-resent-password .left-bar .main-view, page-resent-password .left-bar-signup .main-view, page-new-password .left-bar .main-view, page-new-password .left-bar-signup .main-view {
  width: 100%;
}
page-login-master .wrap-page-auth, page-sign-up .wrap-page-auth, page-sign-in .wrap-page-auth, page-restoring .wrap-page-auth, page-resent-password .wrap-page-auth, page-new-password .wrap-page-auth {
  width: 100%;
  max-width: 390px;
  margin: auto;
}
page-login-master .wrap-page-auth.token, page-sign-up .wrap-page-auth.token, page-sign-in .wrap-page-auth.token, page-restoring .wrap-page-auth.token, page-resent-password .wrap-page-auth.token, page-new-password .wrap-page-auth.token {
  max-width: 450px;
}
page-login-master .wrap-page-auth.token .desc, page-sign-up .wrap-page-auth.token .desc, page-sign-in .wrap-page-auth.token .desc, page-restoring .wrap-page-auth.token .desc, page-resent-password .wrap-page-auth.token .desc, page-new-password .wrap-page-auth.token .desc {
  margin-top: 20px;
}
page-login-master .page-auth, page-sign-up .page-auth, page-sign-in .page-auth, page-restoring .page-auth, page-resent-password .page-auth, page-new-password .page-auth {
  display: flex;
  flex-direction: column;
  margin: 20px 40px;
}
page-login-master .page-auth .title, page-sign-up .page-auth .title, page-sign-in .page-auth .title, page-restoring .page-auth .title, page-resent-password .page-auth .title, page-new-password .page-auth .title {
  margin-bottom: 5px;
  font-weight: bold;
  font-size: 24px;
  line-height: 28px;
}
page-login-master .page-auth .form, page-sign-up .page-auth .form, page-sign-in .page-auth .form, page-restoring .page-auth .form, page-resent-password .page-auth .form, page-new-password .page-auth .form {
  display: flex;
  flex-direction: column;
}
page-login-master .page-auth .form .form-control, page-sign-up .page-auth .form .form-control, page-sign-in .page-auth .form .form-control, page-restoring .page-auth .form .form-control, page-resent-password .page-auth .form .form-control, page-new-password .page-auth .form .form-control {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}
page-login-master .page-auth .form .form-control .label, page-sign-up .page-auth .form .form-control .label, page-sign-in .page-auth .form .form-control .label, page-restoring .page-auth .form .form-control .label, page-resent-password .page-auth .form .form-control .label, page-new-password .page-auth .form .form-control .label {
  margin-bottom: 4px;
  font-weight: 400;
  font-size: 13px;
  line-height: 17px;
  color: var(--gray-color1);
}
page-login-master .page-auth .form .password-label, page-sign-up .page-auth .form .password-label, page-sign-in .page-auth .form .password-label, page-restoring .page-auth .form .password-label, page-resent-password .page-auth .form .password-label, page-new-password .page-auth .form .password-label {
  display: flex;
}
page-login-master .page-auth .form .forgot-password, page-sign-up .page-auth .form .forgot-password, page-sign-in .page-auth .form .forgot-password, page-restoring .page-auth .form .forgot-password, page-resent-password .page-auth .form .forgot-password, page-new-password .page-auth .form .forgot-password {
  font-weight: 400;
  text-align: end;
  width: 100%;
}
page-login-master .page-auth .form .remember-me, page-sign-up .page-auth .form .remember-me, page-sign-in .page-auth .form .remember-me, page-restoring .page-auth .form .remember-me, page-resent-password .page-auth .form .remember-me, page-new-password .page-auth .form .remember-me {
  margin-top: 18px;
}
page-login-master .page-auth .form .remember-me span, page-sign-up .page-auth .form .remember-me span, page-sign-in .page-auth .form .remember-me span, page-restoring .page-auth .form .remember-me span, page-resent-password .page-auth .form .remember-me span, page-new-password .page-auth .form .remember-me span {
  color: var(--gray-color1);
  font-weight: normal !important;
  font-size: 13px;
  line-height: 17px;
}
page-login-master .page-auth .form .error-summary, page-sign-up .page-auth .form .error-summary, page-sign-in .page-auth .form .error-summary, page-restoring .page-auth .form .error-summary, page-resent-password .page-auth .form .error-summary, page-new-password .page-auth .form .error-summary {
  background: var(--orange-color2);
  padding: 5px;
  margin-top: 18px;
  border-radius: 5px;
}
page-login-master .page-auth .form .error-message, page-sign-up .page-auth .form .error-message, page-sign-in .page-auth .form .error-message, page-restoring .page-auth .form .error-message, page-resent-password .page-auth .form .error-message, page-new-password .page-auth .form .error-message {
  color: var(--orange-color1);
}
page-login-master .page-auth .form .error-message.field, page-sign-up .page-auth .form .error-message.field, page-sign-in .page-auth .form .error-message.field, page-restoring .page-auth .form .error-message.field, page-resent-password .page-auth .form .error-message.field, page-new-password .page-auth .form .error-message.field {
  margin-right: 0px;
}
page-login-master .page-auth .form .button-sign-in, page-sign-up .page-auth .form .button-sign-in, page-sign-in .page-auth .form .button-sign-in, page-restoring .page-auth .form .button-sign-in, page-resent-password .page-auth .form .button-sign-in, page-new-password .page-auth .form .button-sign-in {
  font-size: 13px;
  margin: 18px auto 0;
  width: 200px;
}
page-login-master .page-auth .form .buttons, page-sign-up .page-auth .form .buttons, page-sign-in .page-auth .form .buttons, page-restoring .page-auth .form .buttons, page-resent-password .page-auth .form .buttons, page-new-password .page-auth .form .buttons {
  display: flex;
  margin-top: 20px;
}
page-login-master .page-auth .form .buttons .green, page-sign-up .page-auth .form .buttons .green, page-sign-in .page-auth .form .buttons .green, page-restoring .page-auth .form .buttons .green, page-resent-password .page-auth .form .buttons .green, page-new-password .page-auth .form .buttons .green {
  margin-right: auto;
}
page-login-master .page-auth .form .buttons ui-text-box, page-sign-up .page-auth .form .buttons ui-text-box, page-sign-in .page-auth .form .buttons ui-text-box, page-restoring .page-auth .form .buttons ui-text-box, page-resent-password .page-auth .form .buttons ui-text-box, page-new-password .page-auth .form .buttons ui-text-box {
  margin-top: 18px;
  font-size: 13px;
}
page-login-master .page-auth .sign-up-question, page-sign-up .page-auth .sign-up-question, page-sign-in .page-auth .sign-up-question, page-restoring .page-auth .sign-up-question, page-resent-password .page-auth .sign-up-question, page-new-password .page-auth .sign-up-question {
  margin-top: 50px;
}
page-login-master .page-auth .button-sign-up, page-sign-up .page-auth .button-sign-up, page-sign-in .page-auth .button-sign-up, page-restoring .page-auth .button-sign-up, page-resent-password .page-auth .button-sign-up, page-new-password .page-auth .button-sign-up {
  margin-top: 18px;
}
page-login-master .page-auth .loader, page-sign-up .page-auth .loader, page-sign-in .page-auth .loader, page-restoring .page-auth .loader, page-resent-password .page-auth .loader, page-new-password .page-auth .loader {
  color: var(--white-color);
  height: 18px;
  width: 18px;
  margin-right: 0;
}
page-login-master .page-auth .loader .image-load, page-sign-up .page-auth .loader .image-load, page-sign-in .page-auth .loader .image-load, page-restoring .page-auth .loader .image-load, page-resent-password .page-auth .loader .image-load, page-new-password .page-auth .loader .image-load {
  width: 18px;
  top: 0;
  left: 0;
  margin: 0;
}
page-login-master .page-auth .separator, page-sign-up .page-auth .separator, page-sign-in .page-auth .separator, page-restoring .page-auth .separator, page-resent-password .page-auth .separator, page-new-password .page-auth .separator {
  text-align: center;
  padding-top: 40px;
  width: 140px;
  border-bottom: var(--default-border);
  margin: auto;
}
page-login-master .page-auth .sign-up-label, page-sign-up .page-auth .sign-up-label, page-sign-in .page-auth .sign-up-label, page-restoring .page-auth .sign-up-label, page-resent-password .page-auth .sign-up-label, page-new-password .page-auth .sign-up-label {
  padding-top: 40px;
  text-align: center;
  width: auto;
  font-size: 14px;
  line-height: 17px;
  color: var(--gray-color10);
}
page-login-master .wrap-sign-in-news, page-sign-up .wrap-sign-in-news, page-sign-in .wrap-sign-in-news, page-restoring .wrap-sign-in-news, page-resent-password .wrap-sign-in-news, page-new-password .wrap-sign-in-news {
  width: 100%;
  max-width: 450px;
  margin-left: 50px;
  padding: 70px 0;
  margin-top: auto;
  margin-bottom: auto;
}
page-login-master .sign-in-news, page-sign-up .sign-in-news, page-sign-in .sign-in-news, page-restoring .sign-in-news, page-resent-password .sign-in-news, page-new-password .sign-in-news {
  display: flex;
  flex-direction: column;
  margin: 70px 40px 20px 40px;
}
@media (max-height: 800px) {
  page-login-master .sign-in-news, page-sign-up .sign-in-news, page-sign-in .sign-in-news, page-restoring .sign-in-news, page-resent-password .sign-in-news, page-new-password .sign-in-news {
    margin-top: 25px;
  }
}
page-login-master .sign-in-news .wrap-title, page-sign-up .sign-in-news .wrap-title, page-sign-in .sign-in-news .wrap-title, page-restoring .sign-in-news .wrap-title, page-resent-password .sign-in-news .wrap-title, page-new-password .sign-in-news .wrap-title {
  display: flex;
  align-items: center;
}
page-login-master .sign-in-news .new, page-sign-up .sign-in-news .new, page-sign-in .sign-in-news .new, page-restoring .sign-in-news .new, page-resent-password .sign-in-news .new, page-new-password .sign-in-news .new {
  width: 44px;
  height: 21px;
  background: var(--orange-color1);
  border-radius: 10px;
  padding: 5px;
  font-weight: 500;
  font-size: 12px;
  line-height: 14px;
  color: var(--white-color);
  text-align: center;
}
page-login-master .sign-in-news .title, page-sign-up .sign-in-news .title, page-sign-in .sign-in-news .title, page-restoring .sign-in-news .title, page-resent-password .sign-in-news .title, page-new-password .sign-in-news .title {
  margin-left: 30px;
  font-weight: bold;
  font-size: 24px;
  line-height: 28px;
}
page-login-master .sign-in-news .info, page-sign-up .sign-in-news .info, page-sign-in .sign-in-news .info, page-restoring .sign-in-news .info, page-resent-password .sign-in-news .info, page-new-password .sign-in-news .info {
  font-size: 14px;
  line-height: 17px;
  color: var(--black-color0);
  margin-top: 20px;
}
page-login-master .sign-in-news .link-login, page-sign-up .sign-in-news .link-login, page-sign-in .sign-in-news .link-login, page-restoring .sign-in-news .link-login, page-resent-password .sign-in-news .link-login, page-new-password .sign-in-news .link-login {
  padding-top: 20px;
}
page-login-master .sign-in-news .link-login img, page-sign-up .sign-in-news .link-login img, page-sign-in .sign-in-news .link-login img, page-restoring .sign-in-news .link-login img, page-resent-password .sign-in-news .link-login img, page-new-password .sign-in-news .link-login img {
  margin-left: 15px;
}
page-login-master .button-sign-up, page-sign-up .button-sign-up, page-sign-in .button-sign-up, page-restoring .button-sign-up, page-resent-password .button-sign-up, page-new-password .button-sign-up {
  font-size: 13px;
  margin: auto;
  width: 200px;
}
page-login-master .wrap-sign-up-news, page-sign-up .wrap-sign-up-news, page-sign-in .wrap-sign-up-news, page-restoring .wrap-sign-up-news, page-resent-password .wrap-sign-up-news, page-new-password .wrap-sign-up-news {
  width: 100%;
  padding: 0 80px;
  margin-top: auto;
  margin-bottom: auto;
}
page-login-master .sign-up-news, page-sign-up .sign-up-news, page-sign-in .sign-up-news, page-restoring .sign-up-news, page-resent-password .sign-up-news, page-new-password .sign-up-news {
  display: flex;
  flex-direction: column;
  margin: 0 50px 40px 15px;
}
@media (max-height: 800px) {
  page-login-master .sign-up-news, page-sign-up .sign-up-news, page-sign-in .sign-up-news, page-restoring .sign-up-news, page-resent-password .sign-up-news, page-new-password .sign-up-news {
    margin-top: 25px;
  }
}
page-login-master .sign-up-news .wrap-title, page-sign-up .sign-up-news .wrap-title, page-sign-in .sign-up-news .wrap-title, page-restoring .sign-up-news .wrap-title, page-resent-password .sign-up-news .wrap-title, page-new-password .sign-up-news .wrap-title {
  display: flex;
  flex-direction: column;
}
page-login-master .sign-up-news .news-title, page-sign-up .sign-up-news .news-title, page-sign-in .sign-up-news .news-title, page-restoring .sign-up-news .news-title, page-resent-password .sign-up-news .news-title, page-new-password .sign-up-news .news-title {
  font-weight: bold;
  font-size: 24px;
  line-height: 28px;
}
page-login-master .sign-up-news .info, page-sign-up .sign-up-news .info, page-sign-in .sign-up-news .info, page-restoring .sign-up-news .info, page-resent-password .sign-up-news .info, page-new-password .sign-up-news .info {
  margin-left: 25px;
  font-size: 16px;
  line-height: 25px;
  color: var(--black-color0);
  margin-top: 20px;
  list-style-image: url(/assets/images/icons/long-arrow-alt-right-b.png);
}
page-login-master .sign-up-news .info li, page-sign-up .sign-up-news .info li, page-sign-in .sign-up-news .info li, page-restoring .sign-up-news .info li, page-resent-password .sign-up-news .info li, page-new-password .sign-up-news .info li {
  padding-left: 19px;
}
page-login-master .sign-up-news .link-login, page-sign-up .sign-up-news .link-login, page-sign-in .sign-up-news .link-login, page-restoring .sign-up-news .link-login, page-resent-password .sign-up-news .link-login, page-new-password .sign-up-news .link-login {
  padding-top: 20px;
}
page-login-master .sign-up-news .link-login img, page-sign-up .sign-up-news .link-login img, page-sign-in .sign-up-news .link-login img, page-restoring .sign-up-news .link-login img, page-resent-password .sign-up-news .link-login img, page-new-password .sign-up-news .link-login img {
  margin-right: 15px;
}
page-login-master .error-summary, page-sign-up .error-summary, page-sign-in .error-summary, page-restoring .error-summary, page-resent-password .error-summary, page-new-password .error-summary {
  background: var(--orange-color2);
  padding: 5px;
  margin-top: 18px;
  border-radius: 5px;
}
page-login-master .error-message, page-sign-up .error-message, page-sign-in .error-message, page-restoring .error-message, page-resent-password .error-message, page-new-password .error-message {
  color: var(--orange-color1);
}
page-login-master .error-message.field, page-sign-up .error-message.field, page-sign-in .error-message.field, page-restoring .error-message.field, page-resent-password .error-message.field, page-new-password .error-message.field {
  margin-right: 0;
  background: var(--orange-color2);
  padding: 5px;
}
page-login-master .error-message.field.agree-to-terms, page-sign-up .error-message.field.agree-to-terms, page-sign-in .error-message.field.agree-to-terms, page-restoring .error-message.field.agree-to-terms, page-resent-password .error-message.field.agree-to-terms, page-new-password .error-message.field.agree-to-terms {
  margin-left: auto;
  margin-right: auto !important;
}
page-login-master .error-message.field.password-format, page-sign-up .error-message.field.password-format, page-sign-in .error-message.field.password-format, page-restoring .error-message.field.password-format, page-resent-password .error-message.field.password-format, page-new-password .error-message.field.password-format {
  margin-top: 10px;
}
page-login-master .error-message.field.password-match, page-login-master .error-message.field.maxlength, page-sign-up .error-message.field.password-match, page-sign-up .error-message.field.maxlength, page-sign-in .error-message.field.password-match, page-sign-in .error-message.field.maxlength, page-restoring .error-message.field.password-match, page-restoring .error-message.field.maxlength, page-resent-password .error-message.field.password-match, page-resent-password .error-message.field.maxlength, page-new-password .error-message.field.password-match, page-new-password .error-message.field.maxlength {
  margin-bottom: 2px;
}
@media (max-width: 767px) {
  page-login-master .left-bar, page-login-master .right-bar, page-login-master .right-bar-signin, page-login-master .right-bar-signup, page-sign-up .left-bar, page-sign-up .right-bar, page-sign-up .right-bar-signin, page-sign-up .right-bar-signup, page-sign-in .left-bar, page-sign-in .right-bar, page-sign-in .right-bar-signin, page-sign-in .right-bar-signup, page-restoring .left-bar, page-restoring .right-bar, page-restoring .right-bar-signin, page-restoring .right-bar-signup, page-resent-password .left-bar, page-resent-password .right-bar, page-resent-password .right-bar-signin, page-resent-password .right-bar-signup, page-new-password .left-bar, page-new-password .right-bar, page-new-password .right-bar-signin, page-new-password .right-bar-signup {
    display: none;
  }
  page-login-master .left-bar-signup, page-sign-up .left-bar-signup, page-sign-in .left-bar-signup, page-restoring .left-bar-signup, page-resent-password .left-bar-signup, page-new-password .left-bar-signup {
    width: 100%;
  }
}
@media (min-width: 768px) {
  page-login-master .phone-bar, page-sign-up .phone-bar, page-sign-in .phone-bar, page-restoring .phone-bar, page-resent-password .phone-bar, page-new-password .phone-bar {
    display: none;
  }
}

page-resent-password .button-sign-up {
  width: 220px !important;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.mat-ripple {
  overflow: hidden;
  position: relative;
}
.mat-ripple:not(:empty) {
  transform: translateZ(0);
}

.mat-ripple.mat-ripple-unbounded {
  overflow: visible;
}

.mat-ripple-element {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  transition: opacity, transform 0ms cubic-bezier(0, 0, 0.2, 1);
  transform: scale3d(0, 0, 0);
}
.cdk-high-contrast-active .mat-ripple-element {
  display: none;
}

.cdk-visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
  outline: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  left: 0;
}
[dir=rtl] .cdk-visually-hidden {
  left: auto;
  right: 0;
}

.cdk-overlay-container, .cdk-global-overlay-wrapper {
  pointer-events: none;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.cdk-overlay-container {
  position: fixed;
  z-index: 1000;
}
.cdk-overlay-container:empty {
  display: none;
}

.cdk-global-overlay-wrapper {
  display: flex;
  position: absolute;
  z-index: 1000;
}

.cdk-overlay-pane {
  position: absolute;
  pointer-events: auto;
  box-sizing: border-box;
  z-index: 1000;
  display: flex;
  max-width: 100%;
  max-height: 100%;
}

.cdk-overlay-backdrop {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
  opacity: 0;
}
.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
  opacity: 1;
}
.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
  opacity: 0.6;
}

.cdk-overlay-dark-backdrop {
  background: rgba(0, 0, 0, 0.32);
}

.cdk-overlay-transparent-backdrop {
  transition: visibility 1ms linear, opacity 1ms linear;
  visibility: hidden;
  opacity: 1;
}
.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
  opacity: 0;
  visibility: visible;
}

.cdk-overlay-backdrop-noop-animation {
  transition: none;
}

.cdk-overlay-connected-position-bounding-box {
  position: absolute;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  min-width: 1px;
  min-height: 1px;
}

.cdk-global-scrollblock {
  position: fixed;
  width: 100%;
  overflow-y: scroll;
}

textarea.cdk-textarea-autosize {
  resize: none;
}

textarea.cdk-textarea-autosize-measuring {
  padding: 2px 0 !important;
  box-sizing: content-box !important;
  height: auto !important;
  overflow: hidden !important;
}

textarea.cdk-textarea-autosize-measuring-firefox {
  padding: 2px 0 !important;
  box-sizing: content-box !important;
  height: 0 !important;
}

@keyframes cdk-text-field-autofill-start { /*!*/ }
@keyframes cdk-text-field-autofill-end { /*!*/ }
.cdk-text-field-autofill-monitored:-webkit-autofill {
  animation: cdk-text-field-autofill-start 0s 1ms;
}

.cdk-text-field-autofill-monitored:not(:-webkit-autofill) {
  animation: cdk-text-field-autofill-end 0s 1ms;
}

.mat-focus-indicator {
  position: relative;
}
.mat-focus-indicator::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
  display: var(--mat-focus-indicator-display, none);
  border: var(--mat-focus-indicator-border-width, 3px) var(--mat-focus-indicator-border-style, solid) var(--mat-focus-indicator-border-color, transparent);
  border-radius: var(--mat-focus-indicator-border-radius, 4px);
}
.mat-focus-indicator:focus::before {
  content: "";
}

.cdk-high-contrast-active {
  --mat-focus-indicator-display: block;
}

.mat-mdc-focus-indicator {
  position: relative;
}
.mat-mdc-focus-indicator::before {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
  display: var(--mat-mdc-focus-indicator-display, none);
  border: var(--mat-mdc-focus-indicator-border-width, 3px) var(--mat-mdc-focus-indicator-border-style, solid) var(--mat-mdc-focus-indicator-border-color, transparent);
  border-radius: var(--mat-mdc-focus-indicator-border-radius, 4px);
}
.mat-mdc-focus-indicator:focus::before {
  content: "";
}

.cdk-high-contrast-active {
  --mat-mdc-focus-indicator-display: block;
}

.mat-ripple-element {
  background-color: rgba(0, 0, 0, 0.1);
}

html {
  --mat-option-selected-state-label-text-color: #aed581;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}

.mat-accent {
  --mat-option-selected-state-label-text-color: #039be5;
}

.mat-warn {
  --mat-option-selected-state-label-text-color: #e53935;
}

html {
  --mat-optgroup-label-text-color: rgba(0, 0, 0, 0.87);
}

.mat-pseudo-checkbox-full {
  color: rgba(0, 0, 0, 0.54);
}
.mat-pseudo-checkbox-full.mat-pseudo-checkbox-disabled {
  color: #b0b0b0;
}

.mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,
.mat-primary .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after {
  color: #aed581;
}
.mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,
.mat-primary .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full {
  background: #aed581;
}
.mat-primary .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,
.mat-primary .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after {
  color: #fafafa;
}

.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,
.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after {
  color: #039be5;
}
.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,
.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full {
  background: #039be5;
}
.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,
.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after {
  color: #fafafa;
}

.mat-accent .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,
.mat-accent .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after {
  color: #039be5;
}
.mat-accent .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,
.mat-accent .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full {
  background: #039be5;
}
.mat-accent .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,
.mat-accent .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after {
  color: #fafafa;
}

.mat-warn .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,
.mat-warn .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after {
  color: #e53935;
}
.mat-warn .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,
.mat-warn .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full {
  background: #e53935;
}
.mat-warn .mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full::after,
.mat-warn .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full::after {
  color: #fafafa;
}

.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-minimal::after,
.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-minimal::after {
  color: #b0b0b0;
}
.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-full,
.mat-pseudo-checkbox-disabled.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-full {
  background: #b0b0b0;
}

.mat-app-background {
  background-color: #fafafa;
  color: rgba(0, 0, 0, 0.87);
}

.mat-elevation-z0, .mat-mdc-elevation-specific.mat-elevation-z0 {
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z1, .mat-mdc-elevation-specific.mat-elevation-z1 {
  box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z2, .mat-mdc-elevation-specific.mat-elevation-z2 {
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z3, .mat-mdc-elevation-specific.mat-elevation-z3 {
  box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z4, .mat-mdc-elevation-specific.mat-elevation-z4 {
  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z5, .mat-mdc-elevation-specific.mat-elevation-z5 {
  box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z6, .mat-mdc-elevation-specific.mat-elevation-z6 {
  box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z7, .mat-mdc-elevation-specific.mat-elevation-z7 {
  box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z8, .mat-mdc-elevation-specific.mat-elevation-z8 {
  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z9, .mat-mdc-elevation-specific.mat-elevation-z9 {
  box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z10, .mat-mdc-elevation-specific.mat-elevation-z10 {
  box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z11, .mat-mdc-elevation-specific.mat-elevation-z11 {
  box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z12, .mat-mdc-elevation-specific.mat-elevation-z12 {
  box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z13, .mat-mdc-elevation-specific.mat-elevation-z13 {
  box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z14, .mat-mdc-elevation-specific.mat-elevation-z14 {
  box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z15, .mat-mdc-elevation-specific.mat-elevation-z15 {
  box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z16, .mat-mdc-elevation-specific.mat-elevation-z16 {
  box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z17, .mat-mdc-elevation-specific.mat-elevation-z17 {
  box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z18, .mat-mdc-elevation-specific.mat-elevation-z18 {
  box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z19, .mat-mdc-elevation-specific.mat-elevation-z19 {
  box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z20, .mat-mdc-elevation-specific.mat-elevation-z20 {
  box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z21, .mat-mdc-elevation-specific.mat-elevation-z21 {
  box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z22, .mat-mdc-elevation-specific.mat-elevation-z22 {
  box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z23, .mat-mdc-elevation-specific.mat-elevation-z23 {
  box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
}

.mat-elevation-z24, .mat-mdc-elevation-specific.mat-elevation-z24 {
  box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}

.mat-theme-loaded-marker {
  display: none;
}

.mat-mdc-card {
  --mdc-elevated-card-container-color: white;
  --mdc-elevated-card-container-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mdc-outlined-card-container-color: white;
  --mdc-outlined-card-outline-color: rgba(0, 0, 0, 0.12);
  --mdc-outlined-card-container-elevation: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mat-card-subtitle-text-color: rgba(0, 0, 0, 0.54);
}

.mat-mdc-progress-bar {
  --mdc-linear-progress-active-indicator-color: #aed581;
  --mdc-linear-progress-track-color: rgba(174, 213, 129, 0.25);
}
@keyframes mdc-linear-progress-buffering {
  from {
    /* @noflip */ /*rtl:ignore*/
  }
}
.mat-mdc-progress-bar .mdc-linear-progress__buffer-dots {
  background-color: rgba(174, 213, 129, 0.25);
  /* @alternate */
  background-color: var(--mdc-linear-progress-track-color, rgba(174, 213, 129, 0.25));
}
@media (forced-colors: active) {
  .mat-mdc-progress-bar .mdc-linear-progress__buffer-dots {
    background-color: ButtonBorder;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .mat-mdc-progress-bar .mdc-linear-progress__buffer-dots {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(174, 213, 129, 0.25)'/%3E%3C/svg%3E");
  }
}
.mat-mdc-progress-bar .mdc-linear-progress__buffer-bar {
  background-color: rgba(174, 213, 129, 0.25);
  /* @alternate */
  background-color: var(--mdc-linear-progress-track-color, rgba(174, 213, 129, 0.25));
}
.mat-mdc-progress-bar.mat-accent {
  --mdc-linear-progress-active-indicator-color: #039be5;
  --mdc-linear-progress-track-color: rgba(3, 155, 229, 0.25);
}
@keyframes mdc-linear-progress-buffering {
  from {
    /* @noflip */ /*rtl:ignore*/
  }
}
.mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-dots {
  background-color: rgba(3, 155, 229, 0.25);
  /* @alternate */
  background-color: var(--mdc-linear-progress-track-color, rgba(3, 155, 229, 0.25));
}
@media (forced-colors: active) {
  .mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-dots {
    background-color: ButtonBorder;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-dots {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(3, 155, 229, 0.25)'/%3E%3C/svg%3E");
  }
}
.mat-mdc-progress-bar.mat-accent .mdc-linear-progress__buffer-bar {
  background-color: rgba(3, 155, 229, 0.25);
  /* @alternate */
  background-color: var(--mdc-linear-progress-track-color, rgba(3, 155, 229, 0.25));
}
.mat-mdc-progress-bar.mat-warn {
  --mdc-linear-progress-active-indicator-color: #e53935;
  --mdc-linear-progress-track-color: rgba(229, 57, 53, 0.25);
}
@keyframes mdc-linear-progress-buffering {
  from {
    /* @noflip */ /*rtl:ignore*/
  }
}
.mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-dots {
  background-color: rgba(229, 57, 53, 0.25);
  /* @alternate */
  background-color: var(--mdc-linear-progress-track-color, rgba(229, 57, 53, 0.25));
}
@media (forced-colors: active) {
  .mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-dots {
    background-color: ButtonBorder;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-dots {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='rgba(229, 57, 53, 0.25)'/%3E%3C/svg%3E");
  }
}
.mat-mdc-progress-bar.mat-warn .mdc-linear-progress__buffer-bar {
  background-color: rgba(229, 57, 53, 0.25);
  /* @alternate */
  background-color: var(--mdc-linear-progress-track-color, rgba(229, 57, 53, 0.25));
}
.mat-mdc-tooltip {
  --mdc-plain-tooltip-container-color: #616161;
  --mdc-plain-tooltip-supporting-text-color: #fff;
}

html {
  --mdc-filled-text-field-caret-color: #aed581;
  --mdc-filled-text-field-focus-active-indicator-color: #aed581;
  --mdc-filled-text-field-focus-label-text-color: rgba(174, 213, 129, 0.87);
  --mdc-filled-text-field-container-color: whitesmoke;
  --mdc-filled-text-field-disabled-container-color: #fafafa;
  --mdc-filled-text-field-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-text-field-input-text-color: rgba(0, 0, 0, 0.87);
  --mdc-filled-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-error-focus-label-text-color: #e53935;
  --mdc-filled-text-field-error-label-text-color: #e53935;
  --mdc-filled-text-field-error-caret-color: #e53935;
  --mdc-filled-text-field-active-indicator-color: rgba(0, 0, 0, 0.42);
  --mdc-filled-text-field-disabled-active-indicator-color: rgba(0, 0, 0, 0.06);
  --mdc-filled-text-field-hover-active-indicator-color: rgba(0, 0, 0, 0.87);
  --mdc-filled-text-field-error-active-indicator-color: #e53935;
  --mdc-filled-text-field-error-focus-active-indicator-color: #e53935;
  --mdc-filled-text-field-error-hover-active-indicator-color: #e53935;
  --mdc-outlined-text-field-caret-color: #aed581;
  --mdc-outlined-text-field-focus-outline-color: #aed581;
  --mdc-outlined-text-field-focus-label-text-color: rgba(174, 213, 129, 0.87);
  --mdc-outlined-text-field-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-input-text-color: rgba(0, 0, 0, 0.87);
  --mdc-outlined-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-error-caret-color: #e53935;
  --mdc-outlined-text-field-error-focus-label-text-color: #e53935;
  --mdc-outlined-text-field-error-label-text-color: #e53935;
  --mdc-outlined-text-field-outline-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-disabled-outline-color: rgba(0, 0, 0, 0.06);
  --mdc-outlined-text-field-hover-outline-color: rgba(0, 0, 0, 0.87);
  --mdc-outlined-text-field-error-focus-outline-color: #e53935;
  --mdc-outlined-text-field-error-hover-outline-color: #e53935;
  --mdc-outlined-text-field-error-outline-color: #e53935;
  --mat-form-field-disabled-input-text-placeholder-color: rgba(0, 0, 0, 0.38);
}

.mat-mdc-form-field-error {
  color: var(--mdc-theme-error, #e53935);
}

.mat-mdc-form-field-subscript-wrapper,
.mat-mdc-form-field-bottom-align::before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-family: var(--mat-form-field-subscript-text-font);
  line-height: var(--mat-form-field-subscript-text-line-height);
  font-size: var(--mat-form-field-subscript-text-size);
  letter-spacing: var(--mat-form-field-subscript-text-tracking);
  font-weight: var(--mat-form-field-subscript-text-weight);
}

.mat-mdc-form-field-focus-overlay {
  background-color: rgba(0, 0, 0, 0.87);
}

.mat-mdc-form-field:hover .mat-mdc-form-field-focus-overlay {
  opacity: 0.04;
}

.mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay {
  opacity: 0.12;
}

.mat-mdc-form-field-type-mat-native-select .mat-mdc-form-field-infix::after {
  color: rgba(0, 0, 0, 0.54);
}
.mat-mdc-form-field-type-mat-native-select.mat-focused.mat-primary .mat-mdc-form-field-infix::after {
  color: rgba(174, 213, 129, 0.87);
}
.mat-mdc-form-field-type-mat-native-select.mat-focused.mat-accent .mat-mdc-form-field-infix::after {
  color: rgba(3, 155, 229, 0.87);
}
.mat-mdc-form-field-type-mat-native-select.mat-focused.mat-warn .mat-mdc-form-field-infix::after {
  color: rgba(229, 57, 53, 0.87);
}
.mat-mdc-form-field-type-mat-native-select.mat-form-field-disabled .mat-mdc-form-field-infix::after {
  color: rgba(0, 0, 0, 0.38);
}

.mat-mdc-form-field.mat-accent {
  --mdc-filled-text-field-caret-color: #039be5;
  --mdc-filled-text-field-focus-active-indicator-color: #039be5;
  --mdc-filled-text-field-focus-label-text-color: rgba(3, 155, 229, 0.87);
  --mdc-outlined-text-field-caret-color: #039be5;
  --mdc-outlined-text-field-focus-outline-color: #039be5;
  --mdc-outlined-text-field-focus-label-text-color: rgba(3, 155, 229, 0.87);
}

.mat-mdc-form-field.mat-warn {
  --mdc-filled-text-field-caret-color: #e53935;
  --mdc-filled-text-field-focus-active-indicator-color: #e53935;
  --mdc-filled-text-field-focus-label-text-color: rgba(229, 57, 53, 0.87);
  --mdc-outlined-text-field-caret-color: #e53935;
  --mdc-outlined-text-field-focus-outline-color: #e53935;
  --mdc-outlined-text-field-focus-label-text-color: rgba(229, 57, 53, 0.87);
}

.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch {
  border-left: 1px solid transparent;
}

[dir=rtl] .mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field.mat-mdc-form-field .mdc-notched-outline__notch {
  border-left: none;
  border-right: 1px solid transparent;
}

.mat-mdc-form-field-infix {
  min-height: 56px;
}

.mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
  top: 28px;
}

.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
  --mat-mdc-form-field-label-transform: translateY(
          -34.75px)
          scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
  transform: var(--mat-mdc-form-field-label-transform);
}

.mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
  padding-top: 16px;
  padding-bottom: 16px;
}

.mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
  padding-top: 24px;
  padding-bottom: 8px;
}

.mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
  padding-top: 16px;
  padding-bottom: 16px;
}

html {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(174, 213, 129, 0.87);
  --mat-select-invalid-arrow-color: rgba(229, 57, 53, 0.87);
}
html .mat-mdc-form-field.mat-accent {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(3, 155, 229, 0.87);
  --mat-select-invalid-arrow-color: rgba(229, 57, 53, 0.87);
}
html .mat-mdc-form-field.mat-warn {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(229, 57, 53, 0.87);
  --mat-select-invalid-arrow-color: rgba(229, 57, 53, 0.87);
}

html {
  --mat-autocomplete-background-color: white;
}

.mat-mdc-dialog-container {
  --mdc-dialog-container-color: white;
  --mdc-dialog-subhead-color: rgba(0, 0, 0, 0.87);
  --mdc-dialog-supporting-text-color: rgba(0, 0, 0, 0.6);
}

.mat-mdc-standard-chip {
  --mdc-chip-disabled-label-text-color: #212121;
  --mdc-chip-elevated-container-color: #e0e0e0;
  --mdc-chip-elevated-disabled-container-color: #e0e0e0;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: #212121;
  --mdc-chip-with-icon-icon-color: #212121;
  --mdc-chip-with-icon-disabled-icon-color: #212121;
  --mdc-chip-with-icon-selected-icon-color: #212121;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: #212121;
  --mdc-chip-with-trailing-icon-trailing-icon-color: #212121;
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mdc-chip-disabled-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-elevated-container-color: #aed581;
  --mdc-chip-elevated-disabled-container-color: #aed581;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-disabled-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #039be5;
  --mdc-chip-elevated-disabled-container-color: #039be5;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #e53935;
  --mdc-chip-elevated-disabled-container-color: #e53935;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}

.mat-mdc-chip.mat-mdc-standard-chip {
  --mdc-chip-container-height: 32px;
}

.mat-mdc-slide-toggle {
  --mdc-switch-selected-focus-state-layer-color: #7cb342;
  --mdc-switch-selected-handle-color: #7cb342;
  --mdc-switch-selected-hover-state-layer-color: #7cb342;
  --mdc-switch-selected-pressed-state-layer-color: #7cb342;
  --mdc-switch-selected-focus-handle-color: #33691e;
  --mdc-switch-selected-hover-handle-color: #33691e;
  --mdc-switch-selected-pressed-handle-color: #33691e;
  --mdc-switch-selected-focus-track-color: #aed581;
  --mdc-switch-selected-hover-track-color: #aed581;
  --mdc-switch-selected-pressed-track-color: #aed581;
  --mdc-switch-selected-track-color: #aed581;
  --mdc-switch-disabled-selected-handle-color: #424242;
  --mdc-switch-disabled-selected-icon-color: #fff;
  --mdc-switch-disabled-selected-track-color: #424242;
  --mdc-switch-disabled-unselected-handle-color: #424242;
  --mdc-switch-disabled-unselected-icon-color: #fff;
  --mdc-switch-disabled-unselected-track-color: #424242;
  --mdc-switch-handle-surface-color: var(--mdc-theme-surface, #fff);
  --mdc-switch-handle-elevation-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mdc-switch-handle-shadow-color: black;
  --mdc-switch-disabled-handle-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mdc-switch-selected-icon-color: #fff;
  --mdc-switch-unselected-focus-handle-color: #212121;
  --mdc-switch-unselected-focus-state-layer-color: #424242;
  --mdc-switch-unselected-focus-track-color: #e0e0e0;
  --mdc-switch-unselected-handle-color: #616161;
  --mdc-switch-unselected-hover-handle-color: #212121;
  --mdc-switch-unselected-hover-state-layer-color: #424242;
  --mdc-switch-unselected-hover-track-color: #e0e0e0;
  --mdc-switch-unselected-icon-color: #fff;
  --mdc-switch-unselected-pressed-handle-color: #212121;
  --mdc-switch-unselected-pressed-state-layer-color: #424242;
  --mdc-switch-unselected-pressed-track-color: #e0e0e0;
  --mdc-switch-unselected-track-color: #e0e0e0;
}
.mat-mdc-slide-toggle .mdc-form-field {
  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
}
.mat-mdc-slide-toggle .mdc-switch--disabled + label {
  color: rgba(0, 0, 0, 0.38);
}
.mat-mdc-slide-toggle.mat-accent {
  --mdc-switch-selected-focus-state-layer-color: #039be5;
  --mdc-switch-selected-handle-color: #039be5;
  --mdc-switch-selected-hover-state-layer-color: #039be5;
  --mdc-switch-selected-pressed-state-layer-color: #039be5;
  --mdc-switch-selected-focus-handle-color: #01579b;
  --mdc-switch-selected-hover-handle-color: #01579b;
  --mdc-switch-selected-pressed-handle-color: #01579b;
  --mdc-switch-selected-focus-track-color: #4fc3f7;
  --mdc-switch-selected-hover-track-color: #4fc3f7;
  --mdc-switch-selected-pressed-track-color: #4fc3f7;
  --mdc-switch-selected-track-color: #4fc3f7;
}
.mat-mdc-slide-toggle.mat-warn {
  --mdc-switch-selected-focus-state-layer-color: #e53935;
  --mdc-switch-selected-handle-color: #e53935;
  --mdc-switch-selected-hover-state-layer-color: #e53935;
  --mdc-switch-selected-pressed-state-layer-color: #e53935;
  --mdc-switch-selected-focus-handle-color: #b71c1c;
  --mdc-switch-selected-hover-handle-color: #b71c1c;
  --mdc-switch-selected-pressed-handle-color: #b71c1c;
  --mdc-switch-selected-focus-track-color: #e57373;
  --mdc-switch-selected-hover-track-color: #e57373;
  --mdc-switch-selected-pressed-track-color: #e57373;
  --mdc-switch-selected-track-color: #e57373;
}

.mat-mdc-slide-toggle {
  --mdc-switch-state-layer-size: 48px;
}

.mat-mdc-radio-button .mdc-form-field {
  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
}

.mat-mdc-radio-button.mat-primary {
  --mdc-radio-disabled-selected-icon-color: #000;
  --mdc-radio-disabled-unselected-icon-color: #000;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #aed581;
  --mdc-radio-selected-hover-icon-color: #aed581;
  --mdc-radio-selected-icon-color: #aed581;
  --mdc-radio-selected-pressed-icon-color: #aed581;
  --mat-radio-ripple-color: #000;
  --mat-radio-checked-ripple-color: #aed581;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
}
.mat-mdc-radio-button.mat-accent {
  --mdc-radio-disabled-selected-icon-color: #000;
  --mdc-radio-disabled-unselected-icon-color: #000;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #039be5;
  --mdc-radio-selected-hover-icon-color: #039be5;
  --mdc-radio-selected-icon-color: #039be5;
  --mdc-radio-selected-pressed-icon-color: #039be5;
  --mat-radio-ripple-color: #000;
  --mat-radio-checked-ripple-color: #039be5;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
}
.mat-mdc-radio-button.mat-warn {
  --mdc-radio-disabled-selected-icon-color: #000;
  --mdc-radio-disabled-unselected-icon-color: #000;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #e53935;
  --mdc-radio-selected-hover-icon-color: #e53935;
  --mdc-radio-selected-icon-color: #e53935;
  --mdc-radio-selected-pressed-icon-color: #e53935;
  --mat-radio-ripple-color: #000;
  --mat-radio-checked-ripple-color: #e53935;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
}

.mat-mdc-radio-button .mdc-radio {
  --mdc-radio-state-layer-size: 40px;
}

.mat-mdc-slider {
  --mdc-slider-label-container-color: black;
  --mdc-slider-label-label-text-color: white;
  --mdc-slider-disabled-handle-color: #000;
  --mdc-slider-disabled-active-track-color: #000;
  --mdc-slider-disabled-inactive-track-color: #000;
  --mdc-slider-with-tick-marks-disabled-container-color: #000;
  --mat-mdc-slider-value-indicator-opacity: 0.6;
}
.mat-mdc-slider.mat-primary {
  --mdc-slider-handle-color: #aed581;
  --mdc-slider-focus-handle-color: #aed581;
  --mdc-slider-hover-handle-color: #aed581;
  --mdc-slider-active-track-color: #aed581;
  --mdc-slider-inactive-track-color: #aed581;
  --mdc-slider-with-tick-marks-active-container-color: #000;
  --mdc-slider-with-tick-marks-inactive-container-color: #aed581;
  --mat-mdc-slider-ripple-color: #aed581;
  --mat-mdc-slider-hover-ripple-color: rgba(174, 213, 129, 0.05);
  --mat-mdc-slider-focus-ripple-color: rgba(174, 213, 129, 0.2);
}
.mat-mdc-slider.mat-accent {
  --mdc-slider-handle-color: #039be5;
  --mdc-slider-focus-handle-color: #039be5;
  --mdc-slider-hover-handle-color: #039be5;
  --mdc-slider-active-track-color: #039be5;
  --mdc-slider-inactive-track-color: #039be5;
  --mdc-slider-with-tick-marks-active-container-color: #000;
  --mdc-slider-with-tick-marks-inactive-container-color: #039be5;
  --mat-mdc-slider-ripple-color: #039be5;
  --mat-mdc-slider-hover-ripple-color: rgba(3, 155, 229, 0.05);
  --mat-mdc-slider-focus-ripple-color: rgba(3, 155, 229, 0.2);
}
.mat-mdc-slider.mat-warn {
  --mdc-slider-handle-color: #e53935;
  --mdc-slider-focus-handle-color: #e53935;
  --mdc-slider-hover-handle-color: #e53935;
  --mdc-slider-active-track-color: #e53935;
  --mdc-slider-inactive-track-color: #e53935;
  --mdc-slider-with-tick-marks-active-container-color: #fff;
  --mdc-slider-with-tick-marks-inactive-container-color: #e53935;
  --mat-mdc-slider-ripple-color: #e53935;
  --mat-mdc-slider-hover-ripple-color: rgba(229, 57, 53, 0.05);
  --mat-mdc-slider-focus-ripple-color: rgba(229, 57, 53, 0.2);
}

html {
  --mat-menu-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-menu-item-icon-color: rgba(0, 0, 0, 0.87);
  --mat-menu-item-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-menu-item-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-menu-container-color: white;
}

.mat-mdc-list-base {
  --mdc-list-list-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-supporting-text-color: rgba(0, 0, 0, 0.54);
  --mdc-list-list-item-leading-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-trailing-supporting-text-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-selected-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-disabled-label-text-color: black;
  --mdc-list-list-item-disabled-leading-icon-color: black;
  --mdc-list-list-item-disabled-trailing-icon-color: black;
  --mdc-list-list-item-hover-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-hover-leading-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-hover-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-focus-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-hover-state-layer-color: black;
  --mdc-list-list-item-hover-state-layer-opacity: 0.04;
  --mdc-list-list-item-focus-state-layer-color: black;
  --mdc-list-list-item-focus-state-layer-opacity: 0.12;
}

.mdc-list-item__start,
.mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: #000;
  --mdc-radio-disabled-unselected-icon-color: #000;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #aed581;
  --mdc-radio-selected-hover-icon-color: #aed581;
  --mdc-radio-selected-icon-color: #aed581;
  --mdc-radio-selected-pressed-icon-color: #aed581;
}

.mat-accent .mdc-list-item__start,
.mat-accent .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: #000;
  --mdc-radio-disabled-unselected-icon-color: #000;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #039be5;
  --mdc-radio-selected-hover-icon-color: #039be5;
  --mdc-radio-selected-icon-color: #039be5;
  --mdc-radio-selected-pressed-icon-color: #039be5;
}

.mat-warn .mdc-list-item__start,
.mat-warn .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: #000;
  --mdc-radio-disabled-unselected-icon-color: #000;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #e53935;
  --mdc-radio-selected-hover-icon-color: #e53935;
  --mdc-radio-selected-icon-color: #e53935;
  --mdc-radio-selected-pressed-icon-color: #e53935;
}

.mat-mdc-list-option {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: #000;
  --mdc-checkbox-selected-focus-icon-color: #aed581;
  --mdc-checkbox-selected-hover-icon-color: #aed581;
  --mdc-checkbox-selected-icon-color: #aed581;
  --mdc-checkbox-selected-pressed-icon-color: #aed581;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #aed581;
  --mdc-checkbox-selected-hover-state-layer-color: #aed581;
  --mdc-checkbox-selected-pressed-state-layer-color: #aed581;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-list-option.mat-accent {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: #000;
  --mdc-checkbox-selected-focus-icon-color: #039be5;
  --mdc-checkbox-selected-hover-icon-color: #039be5;
  --mdc-checkbox-selected-icon-color: #039be5;
  --mdc-checkbox-selected-pressed-icon-color: #039be5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #039be5;
  --mdc-checkbox-selected-hover-state-layer-color: #039be5;
  --mdc-checkbox-selected-pressed-state-layer-color: #039be5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-list-option.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: #fff;
  --mdc-checkbox-selected-focus-icon-color: #e53935;
  --mdc-checkbox-selected-hover-icon-color: #e53935;
  --mdc-checkbox-selected-icon-color: #e53935;
  --mdc-checkbox-selected-pressed-icon-color: #e53935;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #e53935;
  --mdc-checkbox-selected-hover-state-layer-color: #e53935;
  --mdc-checkbox-selected-pressed-state-layer-color: #e53935;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__primary-text,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text {
  color: #aed581;
}
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected.mdc-list-item--with-leading-icon .mdc-list-item__start,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated.mdc-list-item--with-leading-icon .mdc-list-item__start {
  color: #aed581;
}

.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__start,
.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__content,
.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__end {
  opacity: 1;
}

.mat-mdc-list-base {
  --mdc-list-list-item-one-line-container-height: 48px;
  --mdc-list-list-item-two-line-container-height: 64px;
  --mdc-list-list-item-three-line-container-height: 88px;
}

.mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
  height: 56px;
}
.mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
  height: 72px;
}

html {
  --mat-paginator-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-paginator-container-background-color: white;
  --mat-paginator-enabled-icon-color: rgba(0, 0, 0, 0.54);
  --mat-paginator-disabled-icon-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-paginator-container-size: 56px;
}

.mat-mdc-paginator .mat-mdc-form-field-infix {
  min-height: 40px;
}
.mat-mdc-paginator .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
  top: 20px;
}
.mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
  --mat-mdc-form-field-label-transform: translateY(
          -26.75px)
          scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
  transform: var(--mat-mdc-form-field-label-transform);
}
.mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
  padding-top: 8px;
  padding-bottom: 8px;
}
.mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
  padding-top: 8px;
  padding-bottom: 8px;
}
.mat-mdc-paginator .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
  padding-top: 8px;
  padding-bottom: 8px;
}
.mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
  display: none;
}

.mat-mdc-tab-group, .mat-mdc-tab-nav-bar {
  --mdc-tab-indicator-active-indicator-color: #aed581;
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: #000;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #aed581;
  --mat-tab-header-active-ripple-color: #aed581;
  --mat-tab-header-inactive-ripple-color: #aed581;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #aed581;
  --mat-tab-header-active-hover-label-text-color: #aed581;
  --mat-tab-header-active-focus-indicator-color: #aed581;
  --mat-tab-header-active-hover-indicator-color: #aed581;
}
.mat-mdc-tab-group.mat-accent, .mat-mdc-tab-nav-bar.mat-accent {
  --mdc-tab-indicator-active-indicator-color: #039be5;
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: #000;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #039be5;
  --mat-tab-header-active-ripple-color: #039be5;
  --mat-tab-header-inactive-ripple-color: #039be5;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #039be5;
  --mat-tab-header-active-hover-label-text-color: #039be5;
  --mat-tab-header-active-focus-indicator-color: #039be5;
  --mat-tab-header-active-hover-indicator-color: #039be5;
}
.mat-mdc-tab-group.mat-warn, .mat-mdc-tab-nav-bar.mat-warn {
  --mdc-tab-indicator-active-indicator-color: #e53935;
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: #000;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #e53935;
  --mat-tab-header-active-ripple-color: #e53935;
  --mat-tab-header-inactive-ripple-color: #e53935;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #e53935;
  --mat-tab-header-active-hover-label-text-color: #e53935;
  --mat-tab-header-active-focus-indicator-color: #e53935;
  --mat-tab-header-active-hover-indicator-color: #e53935;
}
.mat-mdc-tab-group.mat-background-primary, .mat-mdc-tab-nav-bar.mat-background-primary {
  --mat-tab-header-with-background-background-color: #aed581;
  --mat-tab-header-with-background-foreground-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-tab-group.mat-background-accent, .mat-mdc-tab-nav-bar.mat-background-accent {
  --mat-tab-header-with-background-background-color: #039be5;
  --mat-tab-header-with-background-foreground-color: white;
}
.mat-mdc-tab-group.mat-background-warn, .mat-mdc-tab-nav-bar.mat-background-warn {
  --mat-tab-header-with-background-background-color: #e53935;
  --mat-tab-header-with-background-foreground-color: white;
}

.mat-mdc-tab-header {
  --mdc-secondary-navigation-tab-container-height: 48px;
}

html {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: #000;
  --mdc-checkbox-selected-focus-icon-color: #039be5;
  --mdc-checkbox-selected-hover-icon-color: #039be5;
  --mdc-checkbox-selected-icon-color: #039be5;
  --mdc-checkbox-selected-pressed-icon-color: #039be5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #039be5;
  --mdc-checkbox-selected-hover-state-layer-color: #039be5;
  --mdc-checkbox-selected-pressed-state-layer-color: #039be5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-checkbox.mat-primary {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: #000;
  --mdc-checkbox-selected-focus-icon-color: #aed581;
  --mdc-checkbox-selected-hover-icon-color: #aed581;
  --mdc-checkbox-selected-icon-color: #aed581;
  --mdc-checkbox-selected-pressed-icon-color: #aed581;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #aed581;
  --mdc-checkbox-selected-hover-state-layer-color: #aed581;
  --mdc-checkbox-selected-pressed-state-layer-color: #aed581;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.mat-mdc-checkbox.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: #fff;
  --mdc-checkbox-selected-focus-icon-color: #e53935;
  --mdc-checkbox-selected-hover-icon-color: #e53935;
  --mdc-checkbox-selected-icon-color: #e53935;
  --mdc-checkbox-selected-pressed-icon-color: #e53935;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #e53935;
  --mdc-checkbox-selected-hover-state-layer-color: #e53935;
  --mdc-checkbox-selected-pressed-state-layer-color: #e53935;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.mat-mdc-checkbox .mdc-form-field {
  color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));
}
.mat-mdc-checkbox.mat-mdc-checkbox-disabled label {
  color: rgba(0, 0, 0, 0.38);
}

html {
  --mdc-checkbox-state-layer-size: 40px;
}

.mat-mdc-button.mat-unthemed {
  --mdc-text-button-label-text-color: #000;
}
.mat-mdc-button.mat-primary {
  --mdc-text-button-label-text-color: #aed581;
}
.mat-mdc-button.mat-accent {
  --mdc-text-button-label-text-color: #039be5;
}
.mat-mdc-button.mat-warn {
  --mdc-text-button-label-text-color: #e53935;
}
.mat-mdc-button[disabled][disabled] {
  --mdc-text-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-text-button-label-text-color: rgba(0, 0, 0, 0.38);
}

.mat-mdc-unelevated-button.mat-unthemed {
  --mdc-filled-button-container-color: #fff;
  --mdc-filled-button-label-text-color: #000;
}
.mat-mdc-unelevated-button.mat-primary {
  --mdc-filled-button-container-color: #aed581;
  --mdc-filled-button-label-text-color: #000;
}
.mat-mdc-unelevated-button.mat-accent {
  --mdc-filled-button-container-color: #039be5;
  --mdc-filled-button-label-text-color: #000;
}
.mat-mdc-unelevated-button.mat-warn {
  --mdc-filled-button-container-color: #e53935;
  --mdc-filled-button-label-text-color: #fff;
}
.mat-mdc-unelevated-button[disabled][disabled] {
  --mdc-filled-button-disabled-container-color: rgba(0, 0, 0, 0.12);
  --mdc-filled-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-button-container-color: rgba(0, 0, 0, 0.12);
  --mdc-filled-button-label-text-color: rgba(0, 0, 0, 0.38);
}

.mat-mdc-raised-button.mat-unthemed {
  --mdc-protected-button-container-color: #fff;
  --mdc-protected-button-label-text-color: #000;
}
.mat-mdc-raised-button.mat-primary {
  --mdc-protected-button-container-color: #aed581;
  --mdc-protected-button-label-text-color: #000;
}
.mat-mdc-raised-button.mat-accent {
  --mdc-protected-button-container-color: #039be5;
  --mdc-protected-button-label-text-color: #000;
}
.mat-mdc-raised-button.mat-warn {
  --mdc-protected-button-container-color: #e53935;
  --mdc-protected-button-label-text-color: #fff;
}
.mat-mdc-raised-button[disabled][disabled] {
  --mdc-protected-button-disabled-container-color: rgba(0, 0, 0, 0.12);
  --mdc-protected-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-protected-button-container-color: rgba(0, 0, 0, 0.12);
  --mdc-protected-button-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-protected-button-container-elevation: 0;
}

.mat-mdc-outlined-button {
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.mat-mdc-outlined-button.mat-unthemed {
  --mdc-outlined-button-label-text-color: #000;
}
.mat-mdc-outlined-button.mat-primary {
  --mdc-outlined-button-label-text-color: #aed581;
}
.mat-mdc-outlined-button.mat-accent {
  --mdc-outlined-button-label-text-color: #039be5;
}
.mat-mdc-outlined-button.mat-warn {
  --mdc-outlined-button-label-text-color: #e53935;
}
.mat-mdc-outlined-button[disabled][disabled] {
  --mdc-outlined-button-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
  --mdc-outlined-button-disabled-outline-color: rgba(0, 0, 0, 0.12);
}

.mat-mdc-button, .mat-mdc-outlined-button {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-button:hover .mat-mdc-button-persistent-ripple::before, .mat-mdc-outlined-button:hover .mat-mdc-button-persistent-ripple::before {
  opacity: 0.04;
}
.mat-mdc-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-outlined-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-outlined-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-button:active .mat-mdc-button-persistent-ripple::before, .mat-mdc-outlined-button:active .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-button.mat-primary, .mat-mdc-outlined-button.mat-primary {
  --mat-mdc-button-persistent-ripple-color: #aed581;
  --mat-mdc-button-ripple-color: rgba(174, 213, 129, 0.1);
}
.mat-mdc-button.mat-accent, .mat-mdc-outlined-button.mat-accent {
  --mat-mdc-button-persistent-ripple-color: #039be5;
  --mat-mdc-button-ripple-color: rgba(3, 155, 229, 0.1);
}
.mat-mdc-button.mat-warn, .mat-mdc-outlined-button.mat-warn {
  --mat-mdc-button-persistent-ripple-color: #e53935;
  --mat-mdc-button-ripple-color: rgba(229, 57, 53, 0.1);
}

.mat-mdc-raised-button, .mat-mdc-unelevated-button {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-raised-button:hover .mat-mdc-button-persistent-ripple::before, .mat-mdc-unelevated-button:hover .mat-mdc-button-persistent-ripple::before {
  opacity: 0.04;
}
.mat-mdc-raised-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-raised-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-unelevated-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-unelevated-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-raised-button:active .mat-mdc-button-persistent-ripple::before, .mat-mdc-unelevated-button:active .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-raised-button.mat-primary, .mat-mdc-unelevated-button.mat-primary {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-raised-button.mat-accent, .mat-mdc-unelevated-button.mat-accent {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-raised-button.mat-warn, .mat-mdc-unelevated-button.mat-warn {
  --mat-mdc-button-persistent-ripple-color: #fff;
  --mat-mdc-button-ripple-color: rgba(255, 255, 255, 0.1);
}

.mat-mdc-button.mat-mdc-button-base,
.mat-mdc-raised-button.mat-mdc-button-base,
.mat-mdc-unelevated-button.mat-mdc-button-base,
.mat-mdc-outlined-button.mat-mdc-button-base {
  height: 36px;
}

.mat-mdc-icon-button {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mdc-icon-button-icon-color: inherit;
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-icon-button:hover .mat-mdc-button-persistent-ripple::before {
  opacity: 0.04;
}
.mat-mdc-icon-button.cdk-program-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-icon-button.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-icon-button:active .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-icon-button.mat-primary {
  --mat-mdc-button-persistent-ripple-color: #6200ee;
  --mat-mdc-button-ripple-color: rgba(98, 0, 238, 0.1);
}
.mat-mdc-icon-button.mat-accent {
  --mat-mdc-button-persistent-ripple-color: #018786;
  --mat-mdc-button-ripple-color: rgba(1, 135, 134, 0.1);
}
.mat-mdc-icon-button.mat-warn {
  --mat-mdc-button-persistent-ripple-color: #b00020;
  --mat-mdc-button-ripple-color: rgba(176, 0, 32, 0.1);
}
.mat-mdc-icon-button.mat-primary {
  --mdc-icon-button-icon-color: #aed581;
  --mat-mdc-button-persistent-ripple-color: #aed581;
  --mat-mdc-button-ripple-color: rgba(174, 213, 129, 0.1);
}
.mat-mdc-icon-button.mat-accent {
  --mdc-icon-button-icon-color: #039be5;
  --mat-mdc-button-persistent-ripple-color: #039be5;
  --mat-mdc-button-ripple-color: rgba(3, 155, 229, 0.1);
}
.mat-mdc-icon-button.mat-warn {
  --mdc-icon-button-icon-color: #e53935;
  --mat-mdc-button-persistent-ripple-color: #e53935;
  --mat-mdc-button-ripple-color: rgba(229, 57, 53, 0.1);
}
.mat-mdc-icon-button[disabled][disabled] {
  --mdc-icon-button-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-icon-button-disabled-icon-color: rgba(0, 0, 0, 0.38);
}

.mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 48px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 12px;
}

.mat-mdc-fab,
.mat-mdc-mini-fab {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-fab:hover .mat-mdc-button-persistent-ripple::before,
.mat-mdc-mini-fab:hover .mat-mdc-button-persistent-ripple::before {
  opacity: 0.04;
}
.mat-mdc-fab.cdk-program-focused .mat-mdc-button-persistent-ripple::before, .mat-mdc-fab.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before,
.mat-mdc-mini-fab.cdk-program-focused .mat-mdc-button-persistent-ripple::before,
.mat-mdc-mini-fab.cdk-keyboard-focused .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-fab:active .mat-mdc-button-persistent-ripple::before,
.mat-mdc-mini-fab:active .mat-mdc-button-persistent-ripple::before {
  opacity: 0.12;
}
.mat-mdc-fab.mat-primary,
.mat-mdc-mini-fab.mat-primary {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-fab.mat-accent,
.mat-mdc-mini-fab.mat-accent {
  --mat-mdc-button-persistent-ripple-color: #000;
  --mat-mdc-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-fab.mat-warn,
.mat-mdc-mini-fab.mat-warn {
  --mat-mdc-button-persistent-ripple-color: #fff;
  --mat-mdc-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.mat-mdc-fab[disabled][disabled],
.mat-mdc-mini-fab[disabled][disabled] {
  --mdc-fab-container-color: rgba(0, 0, 0, 0.12);
  --mdc-fab-icon-color: rgba(0, 0, 0, 0.38);
  --mat-mdc-fab-color: rgba(0, 0, 0, 0.38);
}
.mat-mdc-fab.mat-unthemed,
.mat-mdc-mini-fab.mat-unthemed {
  --mdc-fab-container-color: white;
  --mdc-fab-icon-color: black;
  --mat-mdc-fab-color: #000;
}
.mat-mdc-fab.mat-primary,
.mat-mdc-mini-fab.mat-primary {
  --mdc-fab-container-color: #aed581;
  --mdc-fab-icon-color: black;
  --mat-mdc-fab-color: #000;
}
.mat-mdc-fab.mat-accent,
.mat-mdc-mini-fab.mat-accent {
  --mdc-fab-container-color: #039be5;
  --mdc-fab-icon-color: black;
  --mat-mdc-fab-color: #000;
}
.mat-mdc-fab.mat-warn,
.mat-mdc-mini-fab.mat-warn {
  --mdc-fab-container-color: #e53935;
  --mdc-fab-icon-color: white;
  --mat-mdc-fab-color: #fff;
}

.mat-mdc-snack-bar-container {
  --mdc-snackbar-container-color: #333333;
  --mdc-snackbar-supporting-text-color: rgba(255, 255, 255, 0.87);
  --mat-snack-bar-button-color: #039be5;
}

html {
  --mat-table-background-color: white;
  --mat-table-header-headline-color: rgba(0, 0, 0, 0.87);
  --mat-table-row-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-table-row-item-outline-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-table-header-container-height: 56px;
  --mat-table-footer-container-height: 52px;
  --mat-table-row-item-container-height: 52px;
}

.mat-mdc-progress-spinner {
  --mdc-circular-progress-active-indicator-color: #aed581;
}
.mat-mdc-progress-spinner.mat-accent {
  --mdc-circular-progress-active-indicator-color: #039be5;
}
.mat-mdc-progress-spinner.mat-warn {
  --mdc-circular-progress-active-indicator-color: #e53935;
}

.mat-badge {
  position: relative;
}
.mat-badge.mat-badge {
  overflow: visible;
}

.mat-badge-content {
  position: absolute;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
  transition: transform 200ms ease-in-out;
  transform: scale(0.6);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  pointer-events: none;
  background-color: var(--mat-badge-background-color);
  color: var(--mat-badge-text-color);
  font-family: Roboto, sans-serif;
  /* @alternate */
  font-family: var(--mat-badge-text-font, Roboto, sans-serif);
  font-size: 12px;
  /* @alternate */
  font-size: var(--mat-badge-text-size, 12px);
  font-weight: 600;
  /* @alternate */
  font-weight: var(--mat-badge-text-weight, 600);
}
.cdk-high-contrast-active .mat-badge-content {
  outline: solid 1px;
  border-radius: 0;
}

.mat-badge-disabled .mat-badge-content {
  background-color: var(--mat-badge-disabled-state-background-color);
  color: var(--mat-badge-disabled-state-text-color);
}

.mat-badge-hidden .mat-badge-content {
  display: none;
}

.ng-animate-disabled .mat-badge-content,
.mat-badge-content._mat-animation-noopable {
  transition: none;
}

.mat-badge-content.mat-badge-active {
  transform: none;
}

.mat-badge-small .mat-badge-content {
  width: 16px;
  height: 16px;
  line-height: 16px;
  font-size: 9px;
  /* @alternate */
  font-size: var(--mat-badge-small-size-text-size, 9px);
}
.mat-badge-small.mat-badge-above .mat-badge-content {
  top: -8px;
}
.mat-badge-small.mat-badge-below .mat-badge-content {
  bottom: -8px;
}
.mat-badge-small.mat-badge-before .mat-badge-content {
  left: -16px;
}
[dir=rtl] .mat-badge-small.mat-badge-before .mat-badge-content {
  left: auto;
  right: -16px;
}
.mat-badge-small.mat-badge-after .mat-badge-content {
  right: -16px;
}
[dir=rtl] .mat-badge-small.mat-badge-after .mat-badge-content {
  right: auto;
  left: -16px;
}
.mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {
  left: -8px;
}
[dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-before .mat-badge-content {
  left: auto;
  right: -8px;
}
.mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
  right: -8px;
}
[dir=rtl] .mat-badge-small.mat-badge-overlap.mat-badge-after .mat-badge-content {
  right: auto;
  left: -8px;
}

.mat-badge-medium .mat-badge-content {
  width: 22px;
  height: 22px;
  line-height: 22px;
}
.mat-badge-medium.mat-badge-above .mat-badge-content {
  top: -11px;
}
.mat-badge-medium.mat-badge-below .mat-badge-content {
  bottom: -11px;
}
.mat-badge-medium.mat-badge-before .mat-badge-content {
  left: -22px;
}
[dir=rtl] .mat-badge-medium.mat-badge-before .mat-badge-content {
  left: auto;
  right: -22px;
}
.mat-badge-medium.mat-badge-after .mat-badge-content {
  right: -22px;
}
[dir=rtl] .mat-badge-medium.mat-badge-after .mat-badge-content {
  right: auto;
  left: -22px;
}
.mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {
  left: -11px;
}
[dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-before .mat-badge-content {
  left: auto;
  right: -11px;
}
.mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {
  right: -11px;
}
[dir=rtl] .mat-badge-medium.mat-badge-overlap.mat-badge-after .mat-badge-content {
  right: auto;
  left: -11px;
}

.mat-badge-large .mat-badge-content {
  width: 28px;
  height: 28px;
  line-height: 28px;
  font-size: 24px;
  /* @alternate */
  font-size: var(--mat-badge-large-size-text-size, 24px);
}
.mat-badge-large.mat-badge-above .mat-badge-content {
  top: -14px;
}
.mat-badge-large.mat-badge-below .mat-badge-content {
  bottom: -14px;
}
.mat-badge-large.mat-badge-before .mat-badge-content {
  left: -28px;
}
[dir=rtl] .mat-badge-large.mat-badge-before .mat-badge-content {
  left: auto;
  right: -28px;
}
.mat-badge-large.mat-badge-after .mat-badge-content {
  right: -28px;
}
[dir=rtl] .mat-badge-large.mat-badge-after .mat-badge-content {
  right: auto;
  left: -28px;
}
.mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {
  left: -14px;
}
[dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-before .mat-badge-content {
  left: auto;
  right: -14px;
}
.mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {
  right: -14px;
}
[dir=rtl] .mat-badge-large.mat-badge-overlap.mat-badge-after .mat-badge-content {
  right: auto;
  left: -14px;
}

html {
  --mat-badge-background-color: #aed581;
  --mat-badge-text-color: rgba(0, 0, 0, 0.87);
  --mat-badge-disabled-state-background-color: #b9b9b9;
  --mat-badge-disabled-state-text-color: rgba(0, 0, 0, 0.38);
}

.mat-badge-accent {
  --mat-badge-background-color: #039be5;
  --mat-badge-text-color: white;
}

.mat-badge-warn {
  --mat-badge-background-color: #e53935;
  --mat-badge-text-color: white;
}

html {
  --mat-bottom-sheet-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-bottom-sheet-container-background-color: white;
}

html {
  --mat-legacy-button-toggle-text-color: rgba(0, 0, 0, 0.38);
  --mat-legacy-button-toggle-state-layer-color: rgba(0, 0, 0, 0.12);
  --mat-legacy-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.54);
  --mat-legacy-button-toggle-selected-state-background-color: #e0e0e0;
  --mat-legacy-button-toggle-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-legacy-button-toggle-disabled-state-background-color: #eeeeee;
  --mat-legacy-button-toggle-disabled-selected-state-background-color: #bdbdbd;
  --mat-standard-button-toggle-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-background-color: white;
  --mat-standard-button-toggle-state-layer-color: black;
  --mat-standard-button-toggle-selected-state-background-color: #e0e0e0;
  --mat-standard-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-standard-button-toggle-disabled-state-background-color: white;
  --mat-standard-button-toggle-disabled-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-disabled-selected-state-background-color: #bdbdbd;
  --mat-standard-button-toggle-divider-color: #e0e0e0;
}

html {
  --mat-standard-button-toggle-height: 48px;
}

html {
  --mat-datepicker-calendar-date-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-selected-state-background-color: #aed581;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(174, 213, 129, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(174, 213, 129, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(174, 213, 129, 0.3);
  --mat-datepicker-toggle-active-state-icon-color: #aed581;
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(174, 213, 129, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: #46a35e;
  --mat-datepicker-toggle-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-body-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-period-button-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-navigation-button-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-header-divider-color: rgba(0, 0, 0, 0.12);
  --mat-datepicker-calendar-header-text-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-date-today-outline-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: rgba(0, 0, 0, 0.18);
  --mat-datepicker-calendar-date-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-outline-color: transparent;
  --mat-datepicker-calendar-date-disabled-state-text-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(0, 0, 0, 0.24);
  --mat-datepicker-range-input-separator-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-range-input-disabled-state-separator-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-range-input-disabled-state-text-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-container-background-color: white;
  --mat-datepicker-calendar-container-text-color: rgba(0, 0, 0, 0.87);
}

.mat-datepicker-content.mat-accent {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #039be5;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(3, 155, 229, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(3, 155, 229, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(3, 155, 229, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(3, 155, 229, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: #46a35e;
}
.mat-datepicker-content.mat-warn {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #e53935;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(229, 57, 53, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(229, 57, 53, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(229, 57, 53, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(229, 57, 53, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: #46a35e;
}

.mat-datepicker-toggle-active.mat-accent {
  --mat-datepicker-toggle-active-state-icon-color: #039be5;
}
.mat-datepicker-toggle-active.mat-warn {
  --mat-datepicker-toggle-active-state-icon-color: #e53935;
}

.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 40px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 8px;
}
.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
  display: none;
}

html {
  --mat-divider-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-expansion-container-background-color: white;
  --mat-expansion-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-expansion-actions-divider-color: rgba(0, 0, 0, 0.12);
  --mat-expansion-header-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-expansion-header-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-expansion-header-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-expansion-header-text-color: rgba(0, 0, 0, 0.87);
  --mat-expansion-header-description-color: rgba(0, 0, 0, 0.54);
  --mat-expansion-header-indicator-color: rgba(0, 0, 0, 0.54);
}

html {
  --mat-expansion-header-collapsed-state-height: 48px;
  --mat-expansion-header-expanded-state-height: 64px;
}

html {
  --mat-icon-color: inherit;
}

.mat-icon.mat-primary {
  --mat-icon-color: #aed581;
}
.mat-icon.mat-accent {
  --mat-icon-color: #039be5;
}
.mat-icon.mat-warn {
  --mat-icon-color: #e53935;
}

html {
  --mat-sidenav-container-divider-color: rgba(0, 0, 0, 0.12);
  --mat-sidenav-container-background-color: white;
  --mat-sidenav-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-sidenav-content-background-color: #fafafa;
  --mat-sidenav-content-text-color: rgba(0, 0, 0, 0.87);
  --mat-sidenav-scrim-color: rgba(0, 0, 0, 0.6);
}

html {
  --mat-stepper-header-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-selected-state-icon-background-color: #aed581;
  --mat-stepper-header-selected-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-done-state-icon-background-color: #aed581;
  --mat-stepper-header-done-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-edit-state-icon-background-color: #aed581;
  --mat-stepper-header-edit-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-container-color: white;
  --mat-stepper-line-color: rgba(0, 0, 0, 0.12);
  --mat-stepper-header-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-stepper-header-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-stepper-header-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-optional-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-selected-state-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-error-state-label-text-color: #e53935;
  --mat-stepper-header-icon-background-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-error-state-icon-foreground-color: #e53935;
  --mat-stepper-header-error-state-icon-background-color: transparent;
}
html .mat-step-header.mat-accent {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #039be5;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #039be5;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #039be5;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
html .mat-step-header.mat-warn {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #e53935;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #e53935;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #e53935;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}

html {
  --mat-stepper-header-height: 72px;
}

.mat-sort-header-arrow {
  color: #757575;
}

html {
  --mat-toolbar-container-background-color: whitesmoke;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}

.mat-toolbar.mat-primary {
  --mat-toolbar-container-background-color: #aed581;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}
.mat-toolbar.mat-accent {
  --mat-toolbar-container-background-color: #039be5;
  --mat-toolbar-container-text-color: white;
}
.mat-toolbar.mat-warn {
  --mat-toolbar-container-background-color: #e53935;
  --mat-toolbar-container-text-color: white;
}

html {
  --mat-toolbar-standard-height: 64px;
  --mat-toolbar-mobile-height: 56px;
}

.mat-tree {
  background: white;
}

.mat-tree-node,
.mat-nested-tree-node {
  color: rgba(0, 0, 0, 0.87);
}

.mat-tree-node {
  min-height: 48px;
}

.gray-header {
  background: var(--gray-color6);
  height: 60px;
  padding-left: 20px;
  border-bottom: var(--default-border);
  display: flex;
  align-items: center;
}

.card-container {
  clear: both;
  display: flex;
  flex-direction: column;
}
.card-container .card-header {
  height: 45px;
  border-bottom: var(--default-border);
  align-items: center;
}
.card-container .card-header .card-title {
  margin-left: 20px;
  width: 100%;
  margin-top: 10px;
}
.message-icon {
  top: 50px;
  position: fixed;
  margin-left: -66px;
  border-radius: 25px 0px 0px 25px;
  background: var(--ultra-light-blue1);
  width: 66px;
  height: 52px;
}
.message-icon .icon {
  --Iconsax-Color: var(--gray-color1);
  margin: 8px 14px 8px 16px;
  width: 36px;
  height: 36px;
  --Iconsax-Size: 36px;
}
.message-icon.active {
  background: var(--green-color1);
}
.message-icon.active .icon {
  --Iconsax-Color: var(--white-color);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-footer {
  height: 68px;
  padding: 0 28px;
  font-weight: 300;
  font-size: 14px;
  display: flex;
  align-items: center;
  color: var(--gray-color1);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-header {
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
app-header .sync {
  display: flex;
  align-content: center;
  padding: 5px;
  justify-content: center;
  background-color: var(--green-color1);
  border-radius: 50%;
  cursor: pointer;
}
app-header .sync:hover {
  background: var(--green-color2);
}
app-header .sync.disabled {
  background: var(--gray-color13);
  cursor: default;
}
app-header ui-button.info-button {
  margin: 0 5px;
}
app-header .company {
  display: flex;
  align-items: center;
}
app-header .company .drp-label {
  background: none;
  border: none;
  color: var(--gray-color5);
  font-size: 15px;
  padding-left: 0;
  font-weight: 500;
}
app-header .company .drp-label .button-chevron {
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-header .company .drp-label .text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-header .company ui-dropdown .chevronx {
  margin-left: 5px;
}
app-header .company ui-dropdown .drp-menu {
  min-width: 250px;
  max-height: 450px;
}
app-header .company ui-dropdown .drp-menu {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  app-header .company ui-dropdown .drp-menu { /* For Firefox */
    scrollbar-width: thin;
  }
}
app-header .company ui-dropdown .drp-menu::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
app-header .company ui-dropdown .drp-menu::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
app-header .company ui-dropdown .drp-menu::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
app-header .company ui-dropdown .drp-menu .multi-drp-menu:first-child {
  margin-top: 5px;
}
app-header .company ui-dropdown .drp-menu .multi-drp-menu:last-child {
  margin-bottom: 5px;
}
app-header ui-button.status button {
  min-width: 20px;
  min-height: 20px !important;
  width: 20px;
  height: 20px;
}
app-header ui-button.status button i {
  min-width: 20px;
  min-height: 20px;
  width: 20px;
  height: 20px;
  padding: 0px !important;
}
app-header .last-sync-data {
  display: flex;
  align-items: flex-end;
}
app-header .last-sync-icon {
  display: flex;
  align-items: flex-end;
}
app-header .last-sync-icon ui-button {
  margin-bottom: 2px;
  margin-left: 5px;
}
app-header .menu-toggle-wrapper:hover .tooltip {
  display: block;
  cursor: pointer;
}
app-header .menu-toggle-wrapper {
  height: 100%;
  display: flex;
  align-items: center;
  margin: 0 15px;
}
app-header .menu-toggle-wrapper .menu-toggle {
  align-items: center;
  display: flex;
  justify-content: center;
  --Iconsax-Size: 20px;
  --Iconsax-Color: var(--gray-color5);
}
app-header .menu-toggle-wrapper .menu-toggle:hover, app-header .menu-toggle-wrapper .menu-toggle:active {
  text-decoration: none;
}
app-header .menu-toggle-wrapper .row-action {
  width: 30px;
  height: 30px;
}
app-header.disabled {
  cursor: default;
  opacity: 0.5;
}
app-header .search-wrapper {
  height: 100%;
  display: flex;
  align-items: center;
  position: absolute;
  left: calc(50% - 120px);
  top: 0;
}
@media screen and (max-width: 1280px) {
  app-header .search-wrapper {
    margin: 0 auto;
    position: relative;
    left: unset;
  }
}
app-header .sync-button-wrapper {
  height: 32px;
  width: 32px;
  color: var(--white-color);
  font-size: 20px;
  background: var(--green-color1);
  border-radius: 20px;
  margin-right: 10px;
}
app-header .sync-button-wrapper:hover {
  background: var(--green-color2) !important;
}
app-header .sync-button-wrapper.disabled {
  border-radius: 20px !important;
}
app-header .sync-button-wrapper.disabled:hover {
  background: none !important;
}
app-header .sync-button-wrapper .tooltip {
  top: 43px !important;
  left: -45px;
}
app-header .sync-button-wrapper .tooltip:after {
  left: 60px !important;
}
app-header .sync-button {
  height: 100%;
  display: flex;
  align-items: center;
  position: relative;
  margin-right: 10px;
}
app-header .sync-button .tooltip {
  top: 100%;
}
app-header .sync-button .ui-tooltip > div {
  text-align: left;
  line-height: 1.2;
}
app-header .sync-button .ui-tooltip > div .second-row {
  font-weight: 600;
}
app-header .sync-button .ui-tooltip > div .red-text {
  color: var(--orange-color1);
}
app-header .loader {
  color: var(--green-color1);
  height: 30px;
  display: flex;
  align-items: center;
  position: relative;
}
app-header .loader .image-load {
  left: 20px;
}
app-header .header-item-wrapper {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 44px;
}
app-header .header-item-wrapper .add-container {
  position: relative;
}
app-header .header-item-wrapper .add-container .add:hover, app-header .header-item-wrapper .add-container .add:active {
  background: var(--white-color);
}
app-header .header-item-wrapper .add-container .add .icon {
  height: 32px;
  width: 32px;
  color: var(--white-color);
  background: var(--green-color1);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--green-color1);
  border-radius: 50%;
  transition: background linear 0.2s;
}
app-header .header-item-wrapper .add-container .add .icon:hover, app-header .header-item-wrapper .add-container .add .icon:active {
  background: var(--green-color2);
}
app-header .header-item-wrapper .header-item {
  position: relative;
}
app-header .header-item-wrapper .header-item:first-child {
  display: flex;
  width: 100%;
  padding-left: 25px;
}
app-header .header-item-wrapper .header-item:first-child .sync-item {
  display: flex;
}
app-header .header-item-wrapper .header-item:last-child {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  max-width: max-content;
}
app-header .loader-sync {
  width: auto;
  padding-left: 50px;
  height: 100%;
}
app-header .sync-default-status {
  margin-right: 25px;
  display: flex;
  align-items: center;
  color: var(--gray-color1);
  font-size: 12px;
}
app-header .sync-default-status span {
  line-height: 18px;
  white-space: nowrap;
}
app-header .sync-default-status .icon {
  font-size: 18px;
  margin: 0 5px 0 0;
}
app-header .sync-default-status .icon.warning {
  --Iconsax-Size: 20px;
  --Iconsax-Color: var(--orange-color1);
}
app-header .sync-default-status .icon-info {
  align-items: center;
  width: 20px;
  height: auto;
  position: relative;
  display: flex;
  text-align: center;
  margin: 0 10px 0;
  rotate: 180deg;
}
app-header .actions {
  height: 100%;
  display: flex;
  margin-left: auto;
  margin-right: 15px;
}
app-header .actions ui-button {
  margin: 0 5px;
}
app-header .actions .divider {
  background-color: var(--default-border-color);
  height: 100%;
  width: 1px;
}
app-header .actions .notifications-container {
  position: relative;
  display: flex;
  align-items: center;
}
app-header .actions .notifications-container .notification-count {
  position: absolute;
  bottom: 10px;
  right: 2px;
}
app-header .actions .help-center {
  position: relative;
  display: flex;
  align-items: center;
}
app-header .actions .help-center .tooltip {
  top: 43px;
  margin-left: -5px;
  padding: 1px 20px;
}
app-header .actions .help-center .tooltip:after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 15px;
}
app-header .actions .user {
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: background linear 0.2s;
  position: relative;
  z-index: 11;
}
app-header .actions .user ui-button {
  margin: 0;
}
app-header .actions .user .popover .inner::before {
  right: 8px;
  left: unset;
}
app-header .actions .user .popover .inner::after {
  right: 6px;
  left: unset;
}
app-header .actions .user .name-container .name {
  color: var(--black-color0);
  font-size: 12px;
  font-weight: 500;
}
app-header .actions .user .name-container .role {
  font-size: 11px;
  color: var(--gray-color1);
}
app-header .actions .user .popover-title {
  color: var(--gray-color1);
}
app-header .actions .user .popover-title .username, app-header .actions .user .popover-title .subtitle {
  font-weight: 500;
  width: 100%;
  color: var(--gray-color5);
}
app-header .actions .user .popover-title .role {
  color: var(--gray-color1);
  width: 100%;
  margin-bottom: 20px;
}
app-header .actions .user .arrow-down .header-button {
  font-size: 10px;
}
app-header .actions .user .arrow-down {
  margin-left: auto;
}
app-header .actions > div:first-child {
  margin-left: 0;
}
app-header .sync-error {
  color: var(--orange-color1);
}
app-header ui-modal .content {
  display: flex;
  align-items: center;
  justify-content: center;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-navigation {
  z-index: 5;
  position: fixed;
  top: 0;
  bottom: 0;
  width: 220px;
  background: var(--menu-bg-color);
  transition: width 200ms linear;
  overflow: unset !important;
  display: flex;
  flex-direction: column;
}
app-navigation.darkMode {
  color: var(--white-color);
  background: radial-gradient(circle, var(--blue-color9) 5%, var(--blue-color10) 100%);
}
app-navigation.darkMode .settings-navigation .link .text {
  color: var(--white-color4) !important;
}
app-navigation.darkMode .settings-navigation a:hover {
  background: var(--blue-color11) !important;
}
app-navigation.darkMode .settings-navigation a:hover .text {
  color: var(--menu-classic-link-color) !important;
}
app-navigation.darkMode .settings-navigation a:hover .icon {
  color: var(--menu-link-icon-active-color) !important;
}
app-navigation.darkMode .settings-navigation a:hover .iconsax {
  --Iconsax-Color: var(--menu-classic-link-color);
}
app-navigation.darkMode .settings-navigation .iconsax {
  --Iconsax-Color: var(--white-color4);
}
app-navigation.darkMode .nav-menu .account-menu .nav-title {
  color: var(--gray-color17);
}
app-navigation.darkMode .nav-menu .link .text, app-navigation.darkMode .nav-menu .link .iconsax {
  --Iconsax-Color: var(--white-color4);
  color: var(--white-color4) !important;
}
app-navigation.darkMode .nav-menu .link.active, app-navigation.darkMode .nav-menu .link:hover {
  background: var(--black-color2) !important;
}
app-navigation.darkMode .nav-menu .link.active .text, app-navigation.darkMode .nav-menu .link:hover .text {
  color: var(--menu-classic-link-color) !important;
}
app-navigation.darkMode .nav-menu .link.active .icon, app-navigation.darkMode .nav-menu .link:hover .icon {
  color: var(--menu-link-icon-active-color) !important;
}
app-navigation .nav-inner {
  margin-left: -220px;
}
app-navigation.account-settings-active .nav-inner {
  margin-left: 0px;
}
app-navigation > .logo {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: linear 0.2s;
  margin: 6px;
}
app-navigation > .logo .img {
  transition: linear 0.2s;
}
app-navigation > .logo .login-logo {
  background-image: var(--login-logo);
  background-size: 134px 35px;
  background-repeat: no-repeat;
  width: 134px;
  height: 35px;
  display: block;
}
app-navigation .main-navigation .link, app-navigation .settings-navigation .link {
  position: relative;
  line-height: 1;
  font-size: 14px;
  font-weight: 300;
  height: 53px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: background-color linear 0.2s;
}
app-navigation .main-navigation .link .icon, app-navigation .settings-navigation .link .icon {
  width: 65px;
  text-align: center;
  font-size: 22px;
  font-weight: 400;
  transition: color linear 0.2s;
  align-items: center;
}
app-navigation .main-navigation .link .text, app-navigation .settings-navigation .link .text {
  color: var(--gray-color1);
  transition: color linear 0.2s;
  min-width: 45px;
}
app-navigation .main-navigation .link .notifications, app-navigation .settings-navigation .link .notifications {
  color: var(--menu-link-color);
  margin-left: 10px;
}
app-navigation .main-navigation .link .iconsax, app-navigation .settings-navigation .link .iconsax {
  --Iconsax-Color: var(--gray-color1);
}
app-navigation .main-navigation .link:hover, app-navigation .main-navigation .link.active, app-navigation .settings-navigation .link:hover, app-navigation .settings-navigation .link.active {
  background: var(--ultra-light-blue1);
  text-decoration: none;
}
app-navigation .main-navigation .link:hover .iconsax, app-navigation .main-navigation .link.active .iconsax, app-navigation .settings-navigation .link:hover .iconsax, app-navigation .settings-navigation .link.active .iconsax {
  --Iconsax-Color: var(--green-color1);
}
app-navigation .main-navigation .link:hover .text, app-navigation .main-navigation .link.active .text, app-navigation .settings-navigation .link:hover .text, app-navigation .settings-navigation .link.active .text {
  color: var(--menu-link-color);
  font-weight: 400;
}
app-navigation .main-navigation .link.active, app-navigation .settings-navigation .link.active {
  font-weight: 400;
}
app-navigation .main-navigation .link.active:after, app-navigation .settings-navigation .link.active:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 0;
  border-left: 5px solid var(--menu-link-border-color);
}
app-navigation .main-navigation .link .icon, app-navigation .settings-navigation .link .icon {
  display: flex;
}
app-navigation .main-navigation .link .icon.pending, app-navigation .settings-navigation .link .icon.pending {
  position: relative;
}
app-navigation .main-navigation .link .icon.pending:after, app-navigation .settings-navigation .link .icon.pending:after {
  content: "";
  position: absolute;
  top: -1px;
  right: 13px;
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background: var(--blue-color6);
}
app-navigation .main-navigation .link .icon .iconsax, app-navigation .settings-navigation .link .icon .iconsax {
  margin: auto;
}
app-navigation .main-navigation .link .pending-indicator, app-navigation .settings-navigation .link .pending-indicator {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-left: 8px;
  padding: 3px 5px;
  color: var(--button-text-color);
  font-size: 13px;
  font-weight: 400;
  background: var(--blue-color6);
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
  border-radius: 8px;
}
app-navigation .main-navigation.myprofile .link:nth-child(2) {
  margin-bottom: 20px;
}
app-navigation.collapsed {
  width: 53px;
}
app-navigation.collapsed .myprofile > div:nth-child(2) {
  margin-bottom: 20px;
}
app-navigation.collapsed .account-menu .nav-title {
  opacity: 0;
}
app-navigation.collapsed > .logo {
  width: 30px;
  margin-left: 11px;
  justify-content: flex-start;
}
app-navigation.collapsed > .logo .img {
  height: 35px;
  width: 135px;
}
app-navigation.collapsed > .logo .text {
  display: none;
}
app-navigation.collapsed .main-navigation .link, app-navigation.collapsed .settings-navigation .link {
  width: 53px;
}
app-navigation.collapsed .main-navigation .link .text, app-navigation.collapsed .settings-navigation .link .text {
  display: none;
}
app-navigation.collapsed .main-navigation .link .notifications, app-navigation.collapsed .settings-navigation .link .notifications {
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -7px;
}
app-navigation.collapsed .main-navigation .link .icon, app-navigation.collapsed .settings-navigation .link .icon {
  width: 53px;
}
app-navigation.collapsed .popover {
  left: 53px !important;
  width: 220px;
}
app-navigation.collapsed .popover .text {
  display: block !important;
}
app-navigation.collapsed .popover .link {
  width: 100% !important;
}
app-navigation ui-text-button {
  margin: 10px 22px 20px;
}
app-navigation.collapsed + .main-wrapper setup-connected-accounts .default-table td {
  padding: 10px 15px;
}
app-navigation .navigation-loader {
  margin: 50px auto;
}
app-navigation .nav-title {
  padding: 5px 18px 17px;
  font-family: Rubik;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: var(--white-color);
}
app-navigation .popover {
  position: fixed;
  width: 200px;
  left: 220px;
  margin-top: -55px;
}
app-navigation .popover.loading {
  display: none;
}
app-navigation .popover.single {
  margin-top: -50px !important;
}
app-navigation .popover.button {
  margin-top: -65px !important;
}
app-navigation .popover .inner {
  border: unset !important;
  background: unset !important;
  box-shadow: unset !important;
}
app-navigation .popover .inner:before {
  display: none;
}
app-navigation .popover .inner:after {
  left: unset !important;
  border-width: 5px;
  border-style: solid;
  border-color: transparent var(--tooltip-background) transparent transparent !important;
  border: 9px solid transparent;
  top: 18px !important;
  margin-left: -18px !important;
}
app-navigation .popover .popover-item {
  padding-left: 20px;
}
app-navigation .submenu-title {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}
app-navigation .submenu-title span {
  font-weight: 550 !important;
}
app-navigation .submenu-title:after {
  border: 0.5px solid var(--gray-color18);
  width: 77px;
  content: "";
  position: absolute;
  margin-top: 50px;
}
app-navigation .submenu-drp {
  display: flex;
  flex-direction: column;
  border-top-left-radius: var(--border-radius) !important;
  border-top-right-radius: var(--border-radius) !important;
}
app-navigation .submenu-drp .submenu-title {
  margin-right: auto;
  width: 100%;
  background: unset !important;
  border-bottom-left-radius: unset !important;
  border-bottom-right-radius: unset !important;
}
app-navigation .submenu-drp .submenu-title:hover, app-navigation .submenu-drp .submenu-title.active {
  background: unset !important;
}
app-navigation .submenu-title {
  display: flex;
  align-items: center;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
app-navigation .submenu-title:hover, app-navigation .submenu-title.active {
  background: var(--tooltip-background-darken);
  text-decoration: none;
}
app-navigation .submenu-title:last-child {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
app-navigation .submenu-title:last-child:after {
  display: none;
}
app-navigation .submenu-item {
  position: relative;
  cursor: pointer;
  transition: all linear 0.2s;
  display: flex;
  align-items: center;
}
app-navigation .submenu-item:before {
  content: "";
  position: absolute;
  background: transparent;
  width: 5px;
  height: 100%;
  left: 0;
  top: 0;
  transition: linear 0.2s;
}
app-navigation .submenu-item:last-child {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  padding-bottom: 25px !important;
}
app-navigation .submenu-item:hover, app-navigation .submenu-item.active {
  background: var(--tooltip-background-darken);
  text-decoration: none;
}
app-navigation .submenu-item:hover:before, app-navigation .submenu-item.active:before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  height: 100%;
}
app-navigation .nav-menu {
  width: 100%;
  overflow: hidden;
}
app-navigation .nav-menu > .nav-inner {
  width: 440px;
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  position: relative;
  transition: all ease-in-out 0.2s;
}
app-navigation .nav-menu .default-menu, app-navigation .nav-menu .account-menu {
  width: 220px;
  min-height: 370px;
}
app-navigation .nav-menu .account-menu .nav-title {
  padding: 0 30px;
  color: var(--menu-link-color);
  line-height: 70px;
}
app-navigation .change-menustate-button .button {
  display: flex;
  justify-content: flex-end;
  margin-right: -12px;
  height: 40px;
  align-items: center;
  position: relative;
}
app-navigation .change-menustate-button .button i {
  background: var(--white-color);
  border: 1px solid var(--menu-state-button-border);
  border-radius: 12px;
  cursor: pointer;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  --Iconsax-Color: var(--menu-state-button-border);
}
app-navigation .change-menustate-button .button i:hover {
  border-color: var(--green-color1);
  --Iconsax-Color: var(--green-color1);
}
app-navigation .change-menustate-button .button i:hover + .ui-tooltip {
  display: block;
}
app-navigation .change-menustate-button .ui-tooltip {
  background: var(--tooltip-background);
  color: var(--tooltip-color);
  line-height: 1;
  font-size: 12px;
  font-weight: normal;
  font-family: "Rubik", sans-serif;
  white-space: nowrap;
  padding: 12px !important;
  display: none;
  position: absolute;
  z-index: 10;
  border-radius: 5px;
  text-align: center;
  left: calc(100% - 40px);
  top: calc(100% + 5px);
}
app-navigation .change-menustate-button .ui-tooltip:after {
  content: "";
  position: absolute;
  border-width: 5px;
  border-style: solid;
  pointer-events: none;
  border-color: transparent transparent var(--tooltip-background) transparent;
  top: -9px;
  left: 23px;
}

.scroll {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  .scroll { /* For Firefox */
    scrollbar-width: thin;
  }
}
.scroll::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.scroll::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
.scroll::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
ui-search-panel.active {
  z-index: 10;
  position: relative;
  display: block;
}
ui-search-panel.active:before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--black-overlay-color);
  opacity: 0.7;
}
ui-search-panel .keywords {
  z-index: 5;
  position: relative;
  display: block;
}
ui-search-panel .keywords .combobox-wrapper {
  background-color: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  height: auto;
  position: absolute;
  width: 100% !important;
  left: unset !important;
  margin-top: 10px;
}
ui-search-panel .keywords .combobox-wrapper .drp-menu {
  height: 100%;
  max-width: 100% !important;
  overflow-x: hidden !important;
}
ui-search-panel .keywords .combobox-wrapper .drp-menu {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  ui-search-panel .keywords .combobox-wrapper .drp-menu { /* For Firefox */
    scrollbar-width: thin;
  }
}
ui-search-panel .keywords .combobox-wrapper .drp-menu::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
ui-search-panel .keywords .combobox-wrapper .drp-menu::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
ui-search-panel .keywords .combobox-wrapper .drp-menu::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
ui-search-panel .keywords .combobox-wrapper .close {
  font-size: 24px;
  line-height: 1;
  margin-top: 10px;
  position: absolute;
  margin-left: calc(100% + 10px);
  transition: all linear 0.2s;
  color: var(--white-color);
  z-index: 1;
}
ui-search-panel .keywords .combobox-wrapper .close:hover, ui-search-panel .keywords .combobox-wrapper .close:active {
  text-decoration: none;
  color: var(--default-font-color);
}
ui-search-panel .keywords .keywords-title {
  padding: 10px;
  display: flex;
  align-items: center;
  color: var(--black-color0);
  position: relative;
}
ui-search-panel .keywords .keywords-title::after {
  border-bottom: 1px solid var(--gray-color14);
  width: 77px;
  content: "";
  position: absolute;
  bottom: 0;
  left: 10px;
  background-color: var(--gray-color14);
}
ui-search-panel .keywords .drp-single > div {
  padding: 10px;
  display: flex;
  align-items: center;
}
ui-search-panel .keywords .drp-single > div span.marginLeft {
  margin-left: 10px;
}
ui-search-panel .keywords .drp-single > div .text {
  margin-left: 10px;
}
ui-search-panel .keywords .drp-single > div.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.5;
}
ui-search-panel .keywords .drp-single > div:hover {
  cursor: pointer !important;
  color: var(--default-input-color);
  background-color: var(--dropdown-hower-background);
}
ui-search-panel .keywords .drp-item.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.5;
}
ui-search-panel .keywords .drp-item.drp-selected {
  background-color: var(--gray-color7);
}
ui-search-panel .filter-input-wrapper {
  position: relative;
  width: 320px;
}
ui-search-panel .filter-input-wrapper .search-text {
  width: 100%;
}
ui-search-panel .filter-input-wrapper .search-text input {
  width: 100%;
  background: var(--gray-input-search);
  border: 1px solid var(--gray-input-search);
  border-radius: 20px;
  height: 35px;
  color: var(--gray-color5);
}
ui-search-panel .filter-input-wrapper .search-button {
  position: absolute;
  right: 5px;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
  left: unset;
  font-size: 18px;
}
ui-search-panel .card-title-border {
  padding-top: 0;
}
ui-search-panel .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
  font-size: 18px;
  cursor: pointer;
}
ui-search-panel .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 18px;
  height: 14px;
  cursor: pointer;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_blue.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}
ui-search-panel .nav-item.active .icon-rule:before {
  background-image: url(/assets/images/icons_new_design/ico_add_rule_black.svg);
}
ui-search-panel .header-link-wrapper {
  flex-direction: column;
  display: flex;
  padding: 20px 20px 20px 20px;
  background: var(--ultra-light-blue1);
  border-radius: 5px;
  width: 230px !important;
}
ui-search-panel .header-link-wrapper div {
  width: 190px;
  display: flex;
  align-items: center;
}
ui-search-panel .header-link-wrapper div .iconsax {
  margin-right: 10px;
}
ui-search-panel .content-wrapper {
  display: flex;
  border-radius: 5px;
  padding: 0 !important;
}
ui-search-panel .tables-wrapper {
  max-height: calc(100vh - 90px);
  width: calc(100% - 220px);
  padding: 20px 20px 20px 0px;
  max-width: 100% !important;
  overflow-x: hidden !important;
  min-height: 350px;
}
ui-search-panel .tables-wrapper {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  ui-search-panel .tables-wrapper { /* For Firefox */
    scrollbar-width: thin;
  }
}
ui-search-panel .tables-wrapper::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
ui-search-panel .tables-wrapper::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
ui-search-panel .tables-wrapper::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
ui-search-panel .table-wrapper {
  height: calc(100% - 70px);
}
ui-search-panel .table-wrapper .table-header .cell {
  white-space: nowrap;
}
ui-search-panel .table-wrapper .view {
  text-align: right;
  width: 100%;
  margin-bottom: auto;
  margin-top: 3px;
}
ui-search-panel .table-wrapper .cell {
  padding: 15px 10px;
}
ui-search-panel .table-wrapper .cell.date {
  width: 10%;
  min-width: 80px;
  padding: 0 0 0 5px;
}
ui-search-panel .table-wrapper .cell.name {
  width: 30% !important;
}
ui-search-panel .table-wrapper .cell.category {
  flex-grow: 1;
  padding-right: 10px;
  width: 30%;
}
ui-search-panel .table-wrapper .cell.amount {
  width: 20%;
  text-align: right !important;
}
ui-search-panel .table-wrapper .cell.amount .amount {
  font-weight: 500;
}
ui-search-panel .table-wrapper .cell.amount .currency {
  font-size: 11px;
  font-weight: 500;
  margin-right: 5px;
}
ui-search-panel .table-wrapper .cell.condition {
  width: 40%;
}
ui-search-panel .table-wrapper .cell.period {
  display: flex;
  align-items: center;
  width: 30%;
}
ui-search-panel .table-wrapper .table-row {
  min-height: 56px;
  display: flex;
}
ui-search-panel .table-wrapper .table-row:last-child {
  border-bottom: none !important;
}
ui-search-panel .table-wrapper .table-row .cell {
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
}
ui-search-panel .table-wrapper .table-row .cell.date {
  color: var(--gray-color1);
}
ui-search-panel .table-wrapper .table-row .cell.amount {
  color: var(--gray-color1);
}
ui-search-panel .table-wrapper .table-row .cell.amount div {
  width: 100%;
}
ui-search-panel .table-wrapper .table-row .cell.amount div .amount {
  font-weight: 500;
}
ui-search-panel .table-wrapper .table-row .cell .overflow {
  width: 95%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
ui-search-panel .table-wrapper .table-row .cell .counterpart-name, ui-search-panel .table-wrapper .table-row .cell .name {
  font-weight: 500;
}
ui-search-panel .table-wrapper .table-row .cell.info {
  flex-grow: 1;
  width: 240px;
  padding: 0 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
ui-search-panel .table-wrapper .table-row .cell.info .tags {
  margin: 5px 0;
}
ui-search-panel .table-wrapper .table-row .cell.info .description, ui-search-panel .table-wrapper .table-row .cell.info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
ui-search-panel .table-wrapper .table-row .cell.category {
  flex-grow: 1;
  padding-right: 10px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.warn {
  color: var(--orange-color1);
}

.category-switcher {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 55px;
  padding: 0 20px;
  border-bottom: var(--default-border);
}
.category-switcher .category-title {
  margin: 20px;
  max-width: 200px;
  overflow: hidden;
}
.category-switcher .next-category, .category-switcher .prev-category {
  display: flex;
  flex-direction: column;
  max-width: 100px;
  overflow: hidden;
}
.category-switcher .disabled {
  opacity: 0.5;
}

.budget-progress .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.budget-progress .top .percentage {
  color: var(--green-color2);
}
.budget-progress .progress-bar {
  height: 10px;
  width: 100%;
  border-radius: var(--border-radius);
  margin-top: 2px;
  background-color: var(--gray-color1);
}
.budget-progress .progress-bar .inner {
  height: 100%;
  background-image: linear-gradient(to right, var(--green-color2) 0%, var(--green-color1) 100%);
  border-radius: var(--border-radius);
}

.sales-tabs {
  margin-top: 25px;
}
.sales-tabs [nav] {
  border-bottom: var(--default-border);
  padding: 0 20px;
  height: 60px;
  display: flex;
}
.sales-tabs [nav] .nav-item {
  padding: 0 20px;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid transparent;
  text-transform: capitalize;
  color: var(--gray-color1);
  width: 120px;
  margin-bottom: -1px;
}
.sales-tabs [nav] .nav-item .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: linear 0.2s;
}
.sales-tabs [nav] .nav-item .container .currency {
  font-size: 12px;
  font-weight: 400;
}
.sales-tabs [nav] .nav-item .container .amount {
  font-size: 20px;
  font-weight: 400;
}
.sales-tabs [nav] .nav-item.active {
  border-bottom: 3px solid var(--green-color1);
  color: var(--gray-color5);
}
.sales-tabs [nav] .nav-item:not(.active):hover {
  color: var(--link-color-hover);
}
.sales-tabs [nav] .nav-item.deviation-item {
  display: none;
}
.sales-tabs [nav] .nav-item.negative {
  display: flex;
  color: var(--orange-color1);
}
.sales-tabs [nav] .nav-item.negative:not(.active):hover {
  color: var(--orange-color1);
}
.sales-tabs [nav] .nav-item.positive {
  display: flex;
  color: var(--green-color1);
}
.sales-tabs [nav] .nav-item.positive:not(.active):hover {
  color: var(--green-color1);
}
.sales-tabs [nav] .nav-item.disabled {
  opacity: 0.5;
}
.sales-tabs [nav] .nav-item.disabled.positive {
  color: var(--green-color1);
}
.sales-tabs [nav] .nav-item.disabled.negative {
  color: var(--orange-color1);
}
.sales-tabs [content] {
  height: 100%;
  background-color: var(--white-color) !important;
}
.sales-tabs .content-planned {
  display: flex;
  flex-direction: column;
}
.sales-tabs .content-planned > :last-child {
  border-bottom: none;
}

.deviation {
  padding: 38px;
  border-bottom: var(--default-border);
}
.deviation .form .form-line {
  display: flex;
  align-items: center;
  height: 40px;
}
.deviation .form .form-line .form-label {
  width: 90px;
  font-size: 13px;
  flex-shrink: 0;
}
.deviation .form .form-line .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
.deviation .form .form-line .form-control {
  flex-grow: 1;
  flex-basis: 100px;
}
.deviation .form .form-line .form-control.occurs-trend, .deviation .form .form-line .form-control.change-amount {
  margin-right: 5px;
}
.deviation .form .form-line .error-summary {
  background: var(--orange-color2);
  padding: 5px;
  border-radius: 5px;
}
.deviation .form .form-line .error-message {
  color: var(--orange-color1);
}
.deviation .form .form-line .success-message {
  color: var(--green-color1);
}
.deviation .form .form-line.space-between {
  justify-content: space-between;
}
.deviation .form .form-line.space-between .item {
  flex-grow: 1;
  flex-basis: 100px;
  margin: 15px 15px 15px 0;
}
.deviation .form .form-line.space-between .item:first-child + .item {
  margin: 15px 0 15px 0;
}
.deviation .form .form-line.space-between .item ui-dropdown {
  position: relative;
  display: block;
}
.deviation .buttons {
  margin-top: 15px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.deviation .buttons .delete {
  margin-right: auto;
}
.deviation .buttons .cancel {
  width: 85px;
  margin-right: 10px;
}
.deviation .buttons .save {
  width: 105px;
}

.deviation .buttons {
  margin-top: 15px;
  justify-content: space-between;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-plans-dialog ui-confirm-dialog .dialog-inner {
  width: 500px !important;
}
planning-plans-dialog ui-confirm-dialog .dialog-inner .buttons .button {
  width: unset !important;
  min-width: 100px !important;
}
planning-plans-dialog .dialog-inner {
  width: auto !important;
}
planning-plans-dialog .close {
  z-index: 2;
}
@supports (display: grid) {
  planning-plans-dialog .inner-content {
    display: grid;
    grid-template-columns: 450px 650px;
  }
  planning-plans-dialog .hide-left .inner-content {
    grid-template-columns: 650px;
  }
  planning-plans-dialog .hide-left .inner-content .left-panel {
    display: none;
  }
}
@supports not (display: grid) {
  planning-plans-dialog .inner-content {
    display: flex;
  }
  planning-plans-dialog .inner-content .left-panel {
    width: 450px;
  }
  planning-plans-dialog .inner-content .right-panel {
    width: 600px;
  }
  planning-plans-dialog .hide-left .left-panel {
    display: none;
  }
}
planning-plans-dialog .inner-content .left-panel {
  background: var(--ultra-light-blue1);
  overflow: auto;
}
planning-plans-dialog .inner-content .left-panel {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-plans-dialog .inner-content .left-panel { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-plans-dialog .inner-content .left-panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-plans-dialog .inner-content .left-panel::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-plans-dialog .inner-content .left-panel::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-plans-dialog .inner-content .right-panel {
  height: 100%;
  background: var(--white-color);
}
planning-plans-dialog .inner-content h1 {
  line-height: 55px;
}
planning-plans-dialog .comments {
  padding: 15px 20px;
}
planning-plans-dialog .comments .widget {
  width: 100%;
}
planning-plans-dialog .comments .section-title {
  line-height: 15px;
  color: var(--black-color0);
  font-size: 15px;
  font-weight: 500;
  padding-top: 10px;
  padding-bottom: 20px;
}
planning-plans-dialog .gray-header {
  border-bottom: none;
  background-color: var(--white-color);
}
planning-plans-dialog .tabs-container [nav] .nav-item.add-plan {
  padding: 0;
  border: none;
  margin-right: 30px;
}
planning-plans-dialog .tabs-container [nav] .sub-categories {
  align-self: center;
  margin-left: auto;
}
planning-plans-dialog .tabs-container [nav] .sub-categories .icon-arrows-plus {
  padding: 5px 5px 3px 5px;
  color: var(--white-color);
  background: var(--green-color1);
  border-radius: 50%;
  transition: background linear 0.2s;
  font-size: 18px;
  position: relative;
}
planning-plans-dialog .tabs-container [nav] .sub-categories .icon-arrows-plus:hover, planning-plans-dialog .tabs-container [nav] .sub-categories .icon-arrows-plus.active {
  background: var(--green-color2);
}
planning-plans-dialog .tabs-container [nav] .sub-categories .tooltip {
  right: 0;
  top: 35px;
}
planning-plans-dialog .tabs-container [nav] .sub-categories .tooltip::after {
  left: 74%;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-manage-budget .dialog-inner {
  width: auto !important;
}
@supports (display: grid) {
  planning-manage-budget .manage-budget .inner-content {
    display: grid;
    grid-template-columns: 450px 850px;
  }
  planning-manage-budget .manage-budget.hide-left .inner-content {
    grid-template-columns: 850px;
  }
  planning-manage-budget .manage-budget.hide-left .inner-content .left-panel {
    display: none;
  }
}
@supports not (display: grid) {
  planning-manage-budget .manage-budget .inner-content {
    display: flex;
  }
  planning-manage-budget .manage-budget .inner-content .left-panel {
    width: 400px;
  }
  planning-manage-budget .manage-budget .inner-content .right-panel {
    width: 850px;
  }
  planning-manage-budget .manage-budget.hide-left .left-panel {
    display: none;
  }
}
planning-manage-budget .manage-budget .inner-content {
  overflow-y: hidden !important;
}
planning-manage-budget .manage-budget .inner-content .left-panel {
  background: var(--ultra-light-blue1);
  overflow: auto;
  min-height: 100vh !important;
}
planning-manage-budget .manage-budget .inner-content .left-panel {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-manage-budget .manage-budget .inner-content .left-panel { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-manage-budget .manage-budget .inner-content .left-panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-manage-budget .manage-budget .inner-content .left-panel::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-manage-budget .manage-budget .inner-content .left-panel::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-manage-budget .manage-budget .inner-content .right-panel {
  height: 100%;
  background: var(--white-color);
  overflow: auto;
}
planning-manage-budget .manage-budget .inner-content .right-panel {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-manage-budget .manage-budget .inner-content .right-panel { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-manage-budget .manage-budget .inner-content .right-panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-manage-budget .manage-budget .inner-content .right-panel::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-manage-budget .manage-budget .inner-content .right-panel::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-manage-budget .hidden {
  display: none;
}
planning-manage-budget .category-switcher {
  border-bottom: none;
  padding: 0 38px;
  min-height: 75px;
}
planning-manage-budget .category-switcher h1 {
  font-size: 22px;
}
planning-manage-budget .category-switcher .link-dropdown .drp-menu {
  width: 380px;
}
planning-manage-budget .category-switcher .link-dropdown .drp-label {
  font: bold 18px/21px "Rubik" !important;
}
planning-manage-budget .category-switcher .link-dropdown .drp-label .btn-down {
  font-size: 15px;
  font-weight: 900;
}
planning-manage-budget .category-switcher .date-switcher {
  display: flex;
  align-items: center;
  margin: auto 10px auto auto;
  white-space: nowrap;
}
planning-manage-budget .category-switcher .date-switcher span {
  font-size: 14px;
}
planning-manage-budget .category-switcher .date-switcher ui-button {
  margin: 0 10px;
}
planning-manage-budget .category-switcher .date-switcher .date {
  font-size: 16px;
  line-height: 19px;
  color: var(--black-color0);
  font-weight: normal;
}
planning-manage-budget .category-switcher .date-switcher .chevron {
  transition: linear 0.2s;
  background: var(--ultra-light-blue2);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blue-color6);
  cursor: pointer;
  padding: 0;
}
planning-manage-budget .link {
  color: var(--blue-color3);
  cursor: pointer;
  margin-left: 20px;
  text-transform: capitalize;
  text-decoration: none;
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
}
planning-manage-budget .link:hover {
  color: var(--blue-color21);
}
planning-manage-budget .budget-status {
  display: flex;
  align-items: center;
  height: 62px;
  margin-left: 38px;
  padding-left: 24px;
}
planning-manage-budget .budget-status.active {
  border-left: 5px solid var(--green-color1);
}
planning-manage-budget .budget-status.empty {
  border-left: 5px solid var(--blue-color6);
}
planning-manage-budget .budget-status.invalid {
  border-left: 5px solid var(--orange-color3);
}
planning-manage-budget .budget-status ui-button {
  margin-left: 10px;
}
planning-manage-budget .budget-status .text {
  color: var(--gray-color11);
  padding-bottom: 5px;
}
planning-manage-budget .budget-status .wrapper {
  min-width: 150px;
  margin: auto 0;
}
planning-manage-budget .budget-status .amount {
  font-size: 24px;
  line-height: 28px;
  color: var(--black-color0);
  font-weight: 500;
}
planning-manage-budget .budget-status .save {
  margin: auto 30px;
}
planning-manage-budget .budget-status__buttons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 0 38px;
  height: 60px;
  margin-top: 25px;
  margin-bottom: -85px;
}
planning-manage-budget .sales-tabs [nav] {
  padding: 0 38px;
}
planning-manage-budget .sales-tabs hr {
  border: 0;
  height: 1px;
  background: var(--gray-color18);
  margin: 25px -20px 20px;
}
planning-manage-budget .sales-tabs .nav-item {
  margin-bottom: -2px !important;
  width: 165px !important;
}
planning-manage-budget .tag-wrapper {
  margin-top: 5px;
  display: flex;
  width: 100%;
}
planning-manage-budget .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  margin-right: 5px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
planning-manage-budget .tag:not(:first-child) {
  margin-left: 5px;
}
planning-manage-budget .tag.more-tag {
  min-width: unset;
  border: unset;
}
planning-manage-budget .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
planning-manage-budget .tag-wrapper .tag-1 {
  max-width: 100%;
}
planning-manage-budget .tag-wrapper .tag-2 {
  max-width: 50%;
}
planning-manage-budget .tag-wrapper .tag-3 {
  max-width: 30%;
}
planning-manage-budget .tag-wrapper .tag-4 {
  max-width: 25%;
}
planning-manage-budget planning-manage-dialog-header.disabled .link {
  pointer-events: none;
  cursor: default;
  color: var(--default-font-color);
  opacity: 0.5;
}
planning-manage-budget transaction-expected-dialog .dialog__content {
  max-width: 850px;
}
planning-manage-budget .left-panel .comments {
  padding: 0px 20px;
}
planning-manage-budget .hidden {
  display: none;
}
planning-manage-budget .refresh {
  margin-left: auto;
}
planning-manage-budget .pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px 0;
}
planning-manage-budget .title-wrapper {
  height: 35px;
}
planning-manage-budget .transactions-table {
  padding: 38px !important;
}
planning-manage-budget .transactions-table .title-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin: 0 0px 10px 0px;
}
planning-manage-budget .transactions-table .title-wrapper.nodata {
  border-bottom: 1px solid var(--gray-color14);
  height: 46px;
  padding-bottom: 10px;
}
planning-manage-budget .transactions-table .title {
  height: 35px;
  display: flex;
  align-items: center;
}
planning-manage-budget .transactions-table .title span {
  line-height: 35px;
}
planning-manage-budget .transactions-table .title .add {
  margin-left: 20px;
}
planning-manage-budget .transactions-table .title .positive {
  color: var(--green-color1);
}
planning-manage-budget .transactions-table .title .negative {
  color: var(--orange-color1);
}
planning-manage-budget .transactions-table .buttons {
  display: flex;
  justify-content: space-between;
}
planning-manage-budget .transactions-table .buttons .delete {
  color: var(--orange-color6);
  background-color: var(--gray-color7);
}
planning-manage-budget .transactions-table .actions__link {
  cursor: pointer;
}
planning-manage-budget .budget-progress {
  margin-top: 25px;
  padding: 0 20px;
}
planning-manage-budget .view-section .transactions-table {
  background-color: var(--ultra-light-blue1);
  border-radius: var(--border-radius);
}
planning-manage-budget .main-section .section-subtotal, planning-manage-budget .view-section .section-subtotal {
  color: var(--gray-color11);
  font-size: 13px;
  font-weight: 500;
}
planning-manage-budget .main-section .section-subtotal .amount, planning-manage-budget .view-section .section-subtotal .amount {
  margin-left: 15px;
}
planning-manage-budget .view-section {
  padding-top: 20px;
}
planning-manage-budget .comments-view {
  padding: 0 38px;
}
planning-manage-budget .amount-align-right {
  text-align: right !important;
}
planning-manage-budget .explanation {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  padding: 10px 35px 10px 60px;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  background: url(/assets/images/icons/plug_info_ico.svg) 20px 50% no-repeat var(--button-blue-background);
}
planning-manage-budget .explanation .text {
  font-weight: 500;
  color: var(--gray-color5);
}
planning-manage-budget .explanation .amounts {
  font-weight: 400;
  color: var(--gray-color1);
}
planning-manage-budget .explanation .info {
  margin: auto;
}
planning-manage-budget .panel-body {
  border: var(--default-border);
  border-right: none;
  border-left: none;
}
planning-manage-budget .main-section .body {
  border-right: none;
  border-left: none;
}
planning-manage-budget .transaction {
  display: flex;
  align-items: flex-start;
  border-bottom: var(--default-border);
  padding: 10px 10px;
  width: 100%;
}
planning-manage-budget .transaction.disabled {
  background-color: var(--ultra-light-blue1);
}
planning-manage-budget .transaction:last-child {
  border-bottom: none;
}
planning-manage-budget .transaction .cell {
  color: var(--gray-color0);
}
planning-manage-budget .transaction .cell.date {
  width: 100px;
  max-width: 80px;
  min-width: 80px;
  padding: 9px 0;
}
planning-manage-budget .transaction .cell.date .bdgDate {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  margin: auto 15px auto 0;
  white-space: nowrap;
}
planning-manage-budget .transaction .cell.account {
  padding-right: 10px;
  width: 75px;
  flex-wrap: wrap;
  font-weight: normal;
}
planning-manage-budget .transaction .cell.info {
  flex: 1 1 auto;
  min-width: 0;
  padding: 9px 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
planning-manage-budget .transaction .cell.info .tags {
  margin: 5px 0;
}
planning-manage-budget .transaction .cell.info div {
  white-space: normal;
  word-break: normal;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  display: -webkit-box;
}
planning-manage-budget .transaction .cell.status {
  width: 80px;
  padding: 5px 1px;
  text-align: center;
  margin-right: 15px;
  border-radius: var(--border-radius);
  cursor: pointer;
}
planning-manage-budget .transaction .cell.amount {
  color: var(--black-color0);
  flex-grow: 1;
  min-width: 80px;
  max-width: 80px;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  padding: 9px 15px 9px 0;
}
planning-manage-budget .transaction .cell.disabled {
  color: var(--gray-color3) !important;
}
planning-manage-budget .transaction .cell.category {
  flex-grow: 1;
  width: 30%;
  max-width: 200px;
  min-width: 200px;
  margin-left: 10px;
  margin-right: 10px;
  text-align: right;
  line-height: 20px;
}
planning-manage-budget .transaction .cell.category ui-dropdown {
  width: 100%;
}
planning-manage-budget .transaction .cell.category .drp-label {
  max-width: 255px;
  min-width: 200px;
  text-align: left;
}
planning-manage-budget .transaction .cell.category .drp-menu {
  text-align: left;
}
planning-manage-budget .transaction .cell.period {
  flex-grow: 1;
  display: flex;
  max-width: 115px;
  min-width: 115px;
  color: var(--blue-color3);
  font-weight: 500;
}
planning-manage-budget .transaction .cell.period div, planning-manage-budget .transaction .cell.period ui-button {
  cursor: pointer;
  align-items: center;
}
planning-manage-budget .transaction .cell.period div:hover, planning-manage-budget .transaction .cell.period ui-button:hover {
  color: var(--blue-color21);
}
planning-manage-budget .transaction .cell.period .lnr {
  font-size: 16px;
  line-height: 35px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}
planning-manage-budget .transaction .cell.period .text {
  white-space: nowrap;
}
planning-manage-budget .transaction .cell.period .text.text-uppercase {
  text-transform: uppercase !important;
}
planning-manage-budget .transaction .cell.period .disabled {
  cursor: default !important;
}
planning-manage-budget .transaction .cell.period .disabled .text {
  pointer-events: none;
  cursor: default !important;
  color: var(--default-font-color);
  opacity: 0.5;
}
planning-manage-budget .transaction .cell.period .period-link {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 7px 0;
}
planning-manage-budget .transaction .cell.actions {
  display: flex;
  justify-content: flex-end;
  min-width: 70px;
  max-width: 70px;
}
planning-manage-budget .transaction.opened {
  justify-content: flex-start;
  flex-wrap: wrap;
  padding-left: 20px;
  background-color: var(--background-budget-suggestion);
  min-height: 50px;
  font-size: 12px;
}
planning-manage-budget .transaction.opened .link {
  font-size: 12px;
}
planning-manage-budget .transaction.opened .block {
  justify-content: space-between;
  display: flex;
}
planning-manage-budget .transaction.opened .block span {
  line-height: 35px;
}
planning-manage-budget .transaction.opened .block .link {
  padding-left: 0px;
  margin-right: 15px;
  margin-left: 0px;
}
planning-manage-budget .transaction.opened .label {
  line-height: 14px;
  color: var(--gray-color11);
  font-weight: 500;
  margin: auto 7px auto 0;
}
planning-manage-budget .transaction.opened .bdgDate {
  line-height: 14px;
  color: var(--black-color0);
  font-weight: 500;
  padding-left: 0px;
  margin: auto 15px auto 0;
  white-space: nowrap;
  /* Align readonly dates with link-style controls in header */
  display: inline-flex;
  align-items: center;
  height: 35px;
}
planning-manage-budget .transaction.opened .change-amount {
  width: 55px;
}
planning-manage-budget .transaction.opened .loader {
  position: absolute !important;
  width: calc(100% - 120px);
}
planning-manage-budget .transaction.budgets {
  padding-left: 20px;
  background-color: var(--background-budget-suggestion);
  overflow-x: scroll;
  height: 100px;
  font-size: 12px;
}
planning-manage-budget .transaction.budgets .block {
  padding-right: 20px;
}
planning-manage-budget .transaction.budgets .date {
  color: var(--gray-color11);
  font-weight: 500;
  margin: auto 10px auto 0;
  line-height: 14px;
}
planning-manage-budget .transaction.budgets .row-action.amount {
  height: unset;
  color: var(--blue-color6);
}
planning-manage-budget .transaction.budgets .amount {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  color: var(--gray-color5);
  margin: auto 0;
}
planning-manage-budget .transaction.budgets .amount-box {
  width: 100px;
  margin: auto 0;
}
planning-manage-budget .transaction.budgets .amount-content {
  display: flex;
  width: 180px;
  height: 35px;
}
planning-manage-budget .transaction.budgets .amount-content .icon-wrapper, planning-manage-budget .transaction.budgets .amount-content ui-button {
  display: flex;
}
planning-manage-budget app-datepicker .calendar-wrapper {
  top: unset;
}
planning-manage-budget app-datepicker .link {
  margin: 0;
}
planning-manage-budget .transaction.budgets {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-manage-budget .transaction.budgets { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-manage-budget .transaction.budgets::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-manage-budget .transaction.budgets::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-manage-budget .transaction.budgets::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-manage-budget .invoices {
  display: flex;
  align-items: flex-start;
  padding: 10px 5px 10px 10px;
  border-bottom: var(--default-border);
}
planning-manage-budget .invoices:last-child {
  border-bottom: none;
}
planning-manage-budget .invoices.disabled {
  background-color: var(--ultra-light-blue1);
}
planning-manage-budget .invoices .status-color-wrapper {
  padding: 0;
  width: 20px;
  height: 100%;
}
planning-manage-budget .invoices .status {
  padding: 9px 0;
}
planning-manage-budget .invoices .status .dropdown {
  width: 104px !important;
}
planning-manage-budget .invoices__title {
  border-bottom: 2px solid var(--default-border-color) !important;
  padding: 12px 5px 12px 10px;
}
planning-manage-budget .invoices__title div {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
planning-manage-budget .invoices__title .cell__title {
  color: var(--black-color0) !important;
  font-weight: 500 !important;
  height: 20px;
}
planning-manage-budget .invoices__title .info-expected {
  max-width: 135px;
  min-width: 135px;
}
planning-manage-budget .invoices__title .date-expected {
  margin-left: 10px;
  max-width: 115px;
  min-width: 115px;
}
planning-manage-budget .invoices__title .status-expected {
  flex: 1;
}
planning-manage-budget .invoices__title .amount-expected {
  max-width: 95px;
  min-width: 95px;
  padding-right: 15px;
  text-align: right;
}
planning-manage-budget .invoices__title .category-expected {
  max-width: 200px;
  min-width: 200px;
}
planning-manage-budget .invoices__title .invoices-actions-expected {
  max-width: 60px;
  min-width: 60px;
  text-align: right;
  padding-right: 5px;
}
planning-manage-budget .invoices__title .date-planned {
  max-width: 80px;
  min-width: 80px;
}
planning-manage-budget .invoices__title .info-planned {
  flex: 1;
  padding: 0 10px;
}
planning-manage-budget .invoices__title .amount-planned {
  min-width: 80px;
  max-width: 80px;
  padding-right: 15px;
  text-align: right;
}
planning-manage-budget .invoices__title .category-planned {
  max-width: 220px;
  min-width: 220px;
  padding: 0 10px;
}
planning-manage-budget .invoices__title .period-planned {
  min-width: 115px;
  max-width: 115px;
}
planning-manage-budget .invoices__title .invoices-actions-planned {
  padding-right: 10px;
  text-align: right !important;
  flex: 1;
  max-width: 75px;
  min-width: 75px;
}
planning-manage-budget .invoices.header {
  height: 45px !important;
}
planning-manage-budget .invoices.header .cell {
  color: var(--gray-color5) !important;
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
}
planning-manage-budget .invoices.header .cell.name, planning-manage-budget .invoices.header .cell.date {
  max-width: 18%;
  min-width: 18%;
}
planning-manage-budget .invoices.header .cell.status {
  margin-left: 2px;
}
planning-manage-budget .invoices.header .status-color-wrapper {
  border: 5px solid var(--white-color);
}
planning-manage-budget .invoices .cell {
  text-align: left;
  color: var(--gray-color0);
}
planning-manage-budget .invoices .cell.name {
  max-width: 135px;
  min-width: 135px;
  padding: 9px 0;
}
planning-manage-budget .invoices .cell.date {
  max-width: 115px;
  min-width: 115px;
  padding: 9px 0;
}
planning-manage-budget .invoices .cell.date {
  margin-left: 10px;
}
planning-manage-budget .invoices .cell .counterpart-name {
  font-weight: 500;
  color: var(--black-color0);
}
planning-manage-budget .invoices .cell.account {
  padding-right: 10px;
  width: 75px;
  flex-wrap: wrap;
  font-weight: normal;
}
planning-manage-budget .invoices .cell.amount {
  max-width: 95px;
  min-width: 95px;
  text-align: right;
  padding-right: 15px !important;
}
planning-manage-budget .invoices .cell.amount div {
  width: 100%;
}
planning-manage-budget .invoices .cell.category {
  max-width: 200px;
  min-width: 200px;
}
planning-manage-budget .invoices .cell .overflow {
  width: 95%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
planning-manage-budget .invoices .cell .info {
  flex-grow: 1;
  width: 240px;
  padding: 0 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
planning-manage-budget .invoices .cell .info .tags {
  margin: 5px 0;
}
planning-manage-budget .invoices .cell .info .description, planning-manage-budget .invoices .cell .info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
planning-manage-budget .invoices .cell.status {
  flex: 1;
  border-radius: var(--border-radius);
  cursor: pointer;
}
planning-manage-budget .invoices .cell.status .dropdown {
  width: 104px !important;
}
planning-manage-budget .invoices .cell.amount {
  flex-grow: 1;
  color: var(--black-color0);
  font-weight: 500;
  padding: 9px 0;
}
planning-manage-budget .invoices .cell .category {
  flex-grow: 1;
  max-width: 200px;
  min-width: 200px;
  padding-right: 10px;
}
planning-manage-budget .invoices .cell .category .dropdown {
  width: 100%;
}
planning-manage-budget .invoices .actions {
  max-width: 60px;
  min-width: 60px;
}
planning-manage-budget .actions {
  padding: 2px 0;
  display: flex;
}
planning-manage-budget span.action {
  color: var(--gray-color3);
  font-weight: 400;
  cursor: auto;
  margin: auto;
}
planning-manage-budget span.action.edited {
  padding: 5px 10px;
  border: 1px solid var(--orange-color);
  border-radius: 15px;
  color: var(--orange-color);
}
planning-manage-budget .transactions-table .loader, planning-manage-budget .invoices .loader {
  margin: 20px auto;
  position: relative !important;
  height: 100px !important;
}
planning-manage-budget .transactions-table .loader .image-load, planning-manage-budget .invoices .loader .image-load {
  margin: -30px 0 0 -30px;
  width: 60px;
}
planning-manage-budget .deviation .adapt-budget {
  color: var(--black-color0);
  margin-bottom: 10px;
}
planning-manage-budget .deviation .notifications-title {
  margin-top: 20px;
}
planning-manage-budget .deviation .adapt-link {
  display: block;
  margin-bottom: 30px;
}
planning-manage-budget .deviation .adapt-forecast {
  color: var(--gray-color5);
  margin-bottom: 30px;
  padding-left: 30px;
  font-weight: 500;
}
planning-manage-budget .deviation ui-radio-button {
  color: var(--gray-color11);
}
planning-manage-budget .deviation ui-radio-button.first-adapt-type .label {
  color: var(--gray-color5);
  font-weight: 500;
}
planning-manage-budget .deviation .form-line {
  height: unset !important;
}
planning-manage-budget .deviation .form-line-container {
  background: var(--gray-color7);
  border-radius: 5px;
  padding: 10px 20px;
  margin-bottom: 20px;
}
planning-manage-budget .deviation .form-line-container .form-line:last-child {
  margin-top: 20px;
}
planning-manage-budget .deviation .amount {
  margin: 0 15px;
}
planning-manage-budget .deviation .loader {
  height: 200px;
}
planning-manage-budget .deviation .loader .image-load {
  margin: -35px 0 0 -35px;
  width: 70px !important;
}
planning-manage-budget .deviation-preview {
  text-align: center;
  padding: 20px 0;
  margin-bottom: 20px;
}
planning-manage-budget .deviation-preview.negative {
  background: var(--orange-color5);
  border-radius: 5px;
}
planning-manage-budget .deviation-preview.positive {
  background: var(--green-color6);
  border-radius: 5px;
}
planning-manage-budget .deviation-preview .count {
  white-space: nowrap;
  display: inline-block;
  vertical-align: middle;
  font-size: 26px;
  line-height: 1;
  color: var(--gray-color36);
}
planning-manage-budget .deviation-preview .text {
  font-size: 10px;
  margin-top: 4px;
  font-weight: 500;
  color: var(--gray-color36);
}
planning-manage-budget .text-title {
  display: flex;
  margin-bottom: 10px;
}
planning-manage-budget .text-title .title {
  margin-top: auto;
  margin-bottom: auto;
}
planning-manage-budget .paid-low-opacity {
  opacity: 0.5;
}
planning-manage-budget .no-new-transactions {
  margin: 0 !important;
}
planning-manage-budget .clarification-message {
  display: flex;
  font-size: 12px;
  justify-content: space-between;
  padding: 30px 20px;
  font-weight: 500;
  color: var(--black-color0);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin-bottom: 15px;
}
planning-manage-budget .clarification-message .monster {
  z-index: 1;
  height: 100%;
  margin-right: 20px;
}
planning-manage-budget .clarification-message .monster .monster-img {
  background: url(/assets/images/monsters/smart2.png);
  background-repeat: no-repeat;
  width: 115px;
  height: 115px;
}
planning-manage-budget .clarification-message .monster .text {
  font-size: 12px;
  line-height: 1.1;
  font-weight: 400;
  margin: 0;
}
planning-manage-budget .clarification-message .content .amounts {
  margin-top: 20px;
}
planning-manage-budget .clarification-message .title {
  font-size: 12px;
  color: var(--black-color0);
  font-weight: 500;
  margin-top: 5px;
}
planning-manage-budget .clarification-message .title span {
  padding-left: 5px;
  display: inline-block;
}
planning-manage-budget .clarification-message .clarification-message-text {
  display: inline-block;
  padding-top: 10px;
  font-weight: 500;
  color: var(--gray-color2);
}
planning-manage-budget .invoices-tab .amount-align-right {
  padding-right: 25px !important;
}
planning-manage-budget .notifications .notification-item {
  min-height: 50px;
  padding: 10px 0;
  display: flex;
  border-top: 0;
}
planning-manage-budget .notifications .notification-item .icon {
  flex-shrink: 0;
  width: 25px;
  text-align: center;
  font-size: 24px;
  margin-right: 10px;
}
planning-manage-budget .notifications .notification-item .text {
  flex-grow: 1;
  font-weight: 400;
}
planning-manage-budget .notifications .notification-item .time {
  flex-shrink: 0;
  width: 48px;
  text-align: center;
  text-transform: lowercase;
}
planning-manage-budget .sales-tabs .budget .budget-buttons {
  justify-content: space-between;
}
planning-manage-budget .sales-tabs .budget .budget-buttons .delete {
  margin-right: 0;
}
planning-manage-budget .wrapper.forecast {
  display: flex;
}
planning-manage-budget .wrapper.forecast .forecastTotal {
  margin-right: 40px;
}
planning-manage-budget .wrapper.forecast .forecastTotal .invalid {
  color: var(--orange-color3);
  text-decoration: line-through;
}
planning-manage-budget .wrapper.forecast .explanation .amounts {
  color: var(--gray-color1);
  font-family: Rubik;
  font-style: normal;
  line-height: 15px;
  overflow-wrap: anywhere;
}
planning-manage-budget .wrapper.forecast .explanation .amounts span {
  margin-right: 10px;
  white-space: nowrap;
}
planning-manage-budget .wrapper.forecast .explanation .amounts span.total {
  color: var(--gray-color1);
}
planning-manage-budget .wrapper.forecast .explanation .amounts span span {
  margin-right: 5px;
  white-space: nowrap;
}
planning-manage-budget .tag-wrapper {
  margin-top: 5px;
  width: 200px;
  display: flex;
}
planning-manage-budget .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  margin-right: 5px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
planning-manage-budget .tag:not(:first-child) {
  margin-left: 5px;
}
planning-manage-budget .tag.more-tag {
  min-width: unset;
  border: unset;
}
planning-manage-budget .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.hidden {
  display: none;
}

.tabs-container {
  margin-top: 20px;
}

.manage-budget__subtitle__container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.manage-budget__subtitle__title {
  font-size: 16px;
  font-weight: bold;
  padding-bottom: 20px;
  color: var(--gray-color5);
}
.manage-budget__subtitle__number {
  font-size: 24px;
  line-height: 28px;
  color: var(--black-color0);
  font-weight: 500;
  height: 28px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}
.manage-budget__subtitle__number span {
  display: block;
  margin-right: 5px;
}
.manage-budget__subtitle__number span:first-child {
  font-size: 16px;
  line-height: 22px;
}
.manage-budget__subtitle__number__box {
  border-left: 5px solid var(--green-color1);
  padding-left: 25px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  height: 62px;
  justify-content: center;
}
.manage-budget__subtitle__number__title {
  font-weight: 400;
  font-size: 13px;
  color: var(--gray-color1);
  padding-bottom: 5px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-actual-budget-content {
  display: flex;
  flex-direction: column;
}
planning-actual-budget-content .transactions-table {
  padding: 38px !important;
}
planning-actual-budget-content .transactions-table .title-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin: 0 0px 10px 0px;
}
planning-actual-budget-content .transactions-table .pagination {
  display: flex;
  justify-content: center;
  margin: 10px 0;
}
planning-actual-budget-content .transactions-table .body {
  display: flex;
  flex-direction: column;
  border-right: none;
  border-left: none;
}
planning-actual-budget-content .transactions-table .body .transaction {
  display: flex;
  align-items: flex-start;
  border-bottom: var(--default-border);
  padding: 12px 10px;
}
planning-actual-budget-content .transactions-table .body .transaction__title {
  border-bottom: 2px solid var(--default-border-color) !important;
}
planning-actual-budget-content .transactions-table .body .transaction__title div {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
planning-actual-budget-content .transactions-table .body .transaction__title .cell {
  color: var(--black-color0) !important;
  font-weight: 500 !important;
}
planning-actual-budget-content .transactions-table .body .transaction__title .category {
  text-align: left !important;
}
planning-actual-budget-content .transactions-table .body .transaction__title .trx-actions {
  text-align: right !important;
  flex: 1;
}
planning-actual-budget-content .transactions-table .body .transaction .cell {
  color: var(--gray-color0);
}
planning-actual-budget-content .transactions-table .body .transaction .cell.date {
  min-width: 90px;
  max-width: 90px;
  padding: 7px 0 7px 0;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.date .month-year {
  font-size: 13px;
  line-height: 20px;
  white-space: nowrap;
  font-weight: 500;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.account {
  line-height: 20px;
  padding: 7px 10px 7px 10px;
  flex-wrap: wrap;
  word-break: break-word;
  min-width: 75px;
  max-width: 75px;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.info {
  flex-grow: 1;
  min-width: 190px !important;
  max-width: 190px !important;
  line-height: 20px;
  padding: 7px 10px 7px 0;
  text-align: left;
  display: flex;
  flex-direction: column;
  word-break: break-word;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.info .tags {
  margin: 5px 0;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.info .name {
  font-weight: 500;
  color: var(--black-color0);
}
planning-actual-budget-content .transactions-table .body .transaction .cell.amount {
  flex-grow: 1;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  padding: 7px 15px 7px 0;
  color: var(--black-color0);
  min-width: 80px;
  max-width: 80px;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.category {
  flex-grow: 1;
  max-width: 200px;
  min-width: 200px;
  margin-left: 10px;
  margin-right: 10px;
  text-align: right;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.category ui-dropdown {
  width: 100%;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.category .drp-label {
  max-width: 200px;
  min-width: 200px;
  text-align: left;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.category .drp-menu {
  text-align: left;
}
planning-actual-budget-content .transactions-table .body .transaction .cell.trx-actions {
  min-width: 90px;
  max-width: 90px;
}
planning-actual-budget-content .transactions-table .body .transaction .cell .setting-container {
  width: 115px;
  margin: auto;
}
planning-actual-budget-content .transactions-table .body .transaction .cell .setting-container .create {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  color: var(--blue-color6);
  display: flex;
  align-items: center;
}
planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.category {
  width: 20%;
}
planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.category .drp-label {
  width: 100%;
}
planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.account, planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.info {
  width: 15% !important;
}
planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.amount, planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.date {
  width: 10% !important;
}
planning-actual-budget-content .transactions-table .body .transaction.withActions .cell.trx-actions .setting-container .create .text {
  white-space: nowrap;
  text-overflow: ellipsis;
}
planning-actual-budget-content .transactions-table .add-trans {
  margin-top: 10px;
  width: 100%;
}
planning-actual-budget-content > :last-child {
  border-bottom: none;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-manage-plan .default-plans {
  padding: 30px;
}
planning-manage-plan .default-plans .default-plan {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  padding: 30px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
planning-manage-plan .default-plans .default-plan .image {
  width: 115px;
}
planning-manage-plan .default-plans .default-plan .image img {
  width: 115px;
}
planning-manage-plan .default-plans .default-plan .text {
  padding: 0 20px;
  flex-shrink: 2;
}
planning-manage-plan .default-plans .default-plan .text .title {
  font-weight: 500;
  font-size: 16px;
  color: var(--gray-color5);
  margin-bottom: 10px;
}
planning-manage-plan .default-plans .default-plan .text .description {
  font-size: 12px;
  color: var(--gray-color1);
}
planning-manage-plan .form {
  padding: 10px 18px;
}
planning-manage-plan .form .hide {
  display: none;
}
planning-manage-plan .form .form-row {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}
planning-manage-plan .form .form-row .form-label {
  margin-bottom: 5px;
}
planning-manage-plan .form .form-row .form-label.disabled-label {
  opacity: 0.5;
}
planning-manage-plan .form .form-row .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
planning-manage-plan .form .form-row .form-control {
  flex-grow: 1;
}
planning-manage-plan .form .actions {
  height: 55px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 16px;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
}
planning-manage-plan .form .actions .btn-cancel {
  width: 85px;
}
planning-manage-plan .form .actions .btn-save {
  width: 105px;
}
planning-manage-plan .form .error-message {
  background: var(--orange-color2);
  padding: 5px;
  color: var(--orange-color1);
  width: 100%;
  border-radius: var(--border-radius);
}
planning-manage-plan .comments {
  padding: 18px;
  height: 100%;
}
planning-manage-plan .comments-count {
  font-size: 12px;
  margin-top: 4px;
  cursor: pointer !important;
  display: inline-block;
}
planning-manage-plan .editing {
  line-height: 35px;
  font-size: 12px;
  width: 74px;
  display: inline-block;
  text-align: center;
}
planning-manage-plan .hide {
  display: none;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-manage-plans {
  display: flex;
  flex-direction: column;
}
planning-manage-plans .plans {
  display: flex;
  flex-direction: column;
}
planning-manage-plans .plans .active-state-container:hover .tooltip, planning-manage-plans .plans .comment-button:hover .tooltip {
  display: block;
}
planning-manage-plans .plans .button .tooltip {
  right: 80px;
  top: 48px;
}
planning-manage-plans .plans .button .tooltip:after {
  content: "";
  position: absolute;
  bottom: 95%;
}
planning-manage-plans .plans .uploader-wrapper .tooltip {
  top: 38px;
}
planning-manage-plans .plans .comment-button .tooltip {
  top: 18px;
  right: 0;
}
planning-manage-plans .plans .comment-button .tooltip:after {
  content: "";
  position: absolute;
  bottom: 95%;
}
planning-manage-plans .plans .comments-count {
  font-size: 12px;
  margin-top: 4px;
  cursor: pointer;
  display: inline-block;
}
planning-manage-plans .plans .plan {
  padding: 0 18px 0 18px;
  position: relative;
  display: flex;
  flex-direction: column;
  border-bottom: var(--default-border);
  transition: linear 0.2s;
}
planning-manage-plans .plans .plan .basic-info {
  padding: 25px 0 15px 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
}
planning-manage-plans .plans .plan .basic-info .collapse-container {
  width: 12px;
}
planning-manage-plans .plans .plan .basic-info .collapse-container .chevron {
  display: inline-block;
  cursor: pointer;
  transition: linear 0.2s;
}
planning-manage-plans .plans .plan .basic-info .collapse-container .chevron.disabled {
  cursor: default !important;
}
planning-manage-plans .plans .plan .basic-info .info-container {
  margin-left: 15px;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-grow: 1;
}
planning-manage-plans .plans .plan .basic-info .info-container .title-container {
  width: 200px;
}
planning-manage-plans .plans .plan .basic-info .info-container .date {
  font-size: 12px;
  font-weight: 500;
}
planning-manage-plans .plans .plan .basic-info .info-container .footer-container {
  margin-top: 3px;
  display: flex;
}
planning-manage-plans .plans .plan .basic-info .info-container .footer-container > :not(:first-child) {
  margin-left: 20px;
}
planning-manage-plans .plans .plan .basic-info .uploader-wrapper {
  display: flex;
  align-items: center;
  margin-right: 10px;
}
planning-manage-plans .plans .plan .basic-info .uploader-wrapper .input-file {
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  opacity: 0;
  cursor: pointer;
}
planning-manage-plans .plans .plan .basic-info .comment-button {
  text-align: left;
  display: inline-block;
  position: relative;
  margin-right: 10px;
}
planning-manage-plans .plans .plan .basic-info .comment-button:after {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 17px;
  cursor: pointer;
  background: url(/assets/images/icons/comment-ico.svg) 0 0 no-repeat;
}
planning-manage-plans .plans .plan .basic-info .comment-button .isComment {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green-color1);
  top: -3px;
  right: -4px;
}
planning-manage-plans .plans .plan .basic-info .date-container {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 30px;
}
planning-manage-plans .plans .plan .basic-info .date-container app-input-year-select {
  width: 45px !important;
  max-width: unset !important;
}
planning-manage-plans .plans .plan .basic-info .date-container label, planning-manage-plans .plans .plan .basic-info .date-container span {
  font-size: 12px;
  font-weight: 500;
}
planning-manage-plans .plans .plan .basic-info .date-container span {
  margin-top: auto;
}
planning-manage-plans .plans .plan .basic-info .date-container label {
  margin-top: 2px;
}
planning-manage-plans .plans .plan .basic-info .date-container .link {
  font-weight: 500;
  color: var(--blue-color3);
  font-size: 12px;
  cursor: pointer;
}
planning-manage-plans .plans .plan .basic-info .date-container .calendar-wrapper {
  right: 0;
  left: unset;
}
planning-manage-plans .plans .plan .basic-info .date-container app-datepicker {
  border: none;
  background: transparent;
}
planning-manage-plans .plans .plan .basic-info .active-state-container {
  margin-right: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: auto;
}
planning-manage-plans .plans .plan .basic-info .active-state-container ui-text-button {
  width: 100%;
}
planning-manage-plans .plans .plan .basic-info .active-state-container .text {
  margin-top: 5px;
}
planning-manage-plans .plans .plan .basic-info .setting-container {
  position: relative;
}
planning-manage-plans .plans .plan .basic-info .setting-container .btn-edit-plan {
  width: 27px;
  height: 27px;
  border: none;
  background: url(/assets/images/icons/setting-ico.svg) 50% 50%/cover no-repeat transparent;
}
planning-manage-plans .plans .plan .basic-info .bottom-line {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 10px 0 0 15px;
}
planning-manage-plans .plans .plan .additional-info {
  display: flex;
  flex-direction: column;
  border-top: var(--default-border);
  overflow: hidden;
}
planning-manage-plans .plans .plan .additional-info .title-container {
  padding: 15px 0 15px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
planning-manage-plans .plans .plan .additional-info .title-container .lower {
  text-transform: lowercase;
}
planning-manage-plans .plans .plan .additional-info .title-container .type {
  font-weight: 700;
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container {
  display: flex;
  align-items: center;
  padding-bottom: 10px;
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container .button {
  width: 155px;
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container .budget-progress {
  flex-grow: 1;
  margin-left: 15px;
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container .budget-progress .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container .budget-progress .top .percentage {
  color: var(--green-color2);
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container .budget-progress .progress-bar {
  height: 10px;
  width: 100%;
  border-radius: var(--border-radius);
  margin-top: 2px;
  background-color: var(--gray-color1);
}
planning-manage-plans .plans .plan .additional-info .plan-budget-container .budget-progress .progress-bar .inner {
  height: 100%;
  background-image: linear-gradient(to right, var(--green-color2) 0%, var(--green-color1) 100%);
  border-radius: var(--border-radius);
}
planning-manage-plans .plans .plan .additional-info .commit-container {
  display: flex;
  flex-direction: row;
  padding-bottom: 10px;
}
planning-manage-plans .plans .plan .additional-info .commit-container .button {
  width: 155px;
  flex-shrink: 0;
}
planning-manage-plans .plans .plan .additional-info .commit-container .text {
  margin-left: 15px;
}
planning-manage-plans .plans .plan.collapsed {
  background: var(--white-color);
}
planning-manage-plans .plans .plan.collapsed .chevron {
  transform: rotate(-90deg);
}
planning-manage-plans .plans .plan.collapsed .additional-info {
  border-top-color: transparent;
}
planning-manage-plans .scenarios {
  padding: 18px;
  border-bottom: var(--default-border);
}
planning-manage-plans .scenarios .button {
  margin-top: 10px;
  width: 100%;
}
planning-manage-plans ui-plug {
  padding: 0px 20px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-manage-budget planning-edit-budget-dialog ui-icon-hint .tooltip {
  right: 0;
}
planning-manage-budget planning-edit-budget-dialog ui-icon-hint .tooltip:after {
  left: unset !important;
}
planning-manage-budget planning-edit-budget-dialog ui-plug .plugInfo {
  padding: 20px !important;
  margin: 0 !important;
}

planning-edit-budget-dialog ui-side-dialog .dialog-inner {
  width: auto !important;
}
planning-edit-budget-dialog ui-side-dialog .close {
  z-index: 2;
}
planning-edit-budget-dialog .mat-chip {
  background-color: var(--gray-color13) !important;
  color: var(--gray-color1) !important;
  border-radius: 20px;
  min-height: 21px;
  max-width: inherit;
}
planning-edit-budget-dialog .form-line.form-line-chips .mat-form-field-flex {
  padding: 5px !important;
  border-radius: 5px !important;
  height: auto;
}
planning-edit-budget-dialog .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix {
  padding: 0 !important;
  height: auto;
}
@supports (display: grid) {
  planning-edit-budget-dialog .inner-content {
    display: grid;
    width: auto;
    grid-template-columns: 650px 650px;
  }
  planning-edit-budget-dialog .hide-left .inner-content {
    grid-template-columns: unset;
    width: 650px;
  }
  planning-edit-budget-dialog .hide-left .inner-content .left-panel {
    display: none;
  }
}
@supports not (display: grid) {
  planning-edit-budget-dialog .inner-content {
    display: flex;
  }
  planning-edit-budget-dialog .inner-content .inner-left-panel {
    width: 375px;
  }
  planning-edit-budget-dialog .inner-content .inner-right-panel {
    width: 475px;
  }
  planning-edit-budget-dialog .hide-left .left-panel {
    display: none;
  }
}
planning-edit-budget-dialog .inner-content .inner-left-panel {
  background: var(--budget-left-panel-background);
  overflow: auto;
}
planning-edit-budget-dialog .inner-content .inner-left-panel {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-edit-budget-dialog .inner-content .inner-left-panel { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-edit-budget-dialog .inner-content .inner-left-panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-edit-budget-dialog .inner-content .inner-left-panel::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-edit-budget-dialog .inner-content .inner-left-panel::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-edit-budget-dialog .inner-content .inner-right-panel {
  height: 100%;
  background: var(--white-color);
}
planning-edit-budget-dialog .inner-content .inner-right-panel {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-edit-budget-dialog .inner-content .inner-right-panel { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-edit-budget-dialog .inner-content .inner-right-panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-edit-budget-dialog .inner-content .inner-right-panel::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-edit-budget-dialog .inner-content .inner-right-panel::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-edit-budget-dialog .panel-title {
  border-bottom: none;
  padding: 0 20px;
  min-height: 75px;
  display: flex;
}
planning-edit-budget-dialog .panel-title h1 {
  font-size: 20px;
  margin: auto 0px;
  margin-top: 20px;
}
planning-edit-budget-dialog .comments {
  padding: 0 20px;
}
planning-edit-budget-dialog .comments ui-plug {
  margin: 20px 0;
}
planning-edit-budget-dialog .modal-gray-title {
  font-weight: 500;
}
planning-edit-budget-dialog .tooltip {
  top: -30px;
  right: 110px;
  width: 250px;
}
planning-edit-budget-dialog .budget {
  padding: 32px 22px;
}
planning-edit-budget-dialog .budget .drp-menu {
  min-width: 180px;
  max-height: 200px;
}
planning-edit-budget-dialog .budget .form .form-line {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
planning-edit-budget-dialog .budget .form .form-line .hide {
  display: none !important;
}
planning-edit-budget-dialog .budget .form .form-line .label {
  font-size: 13px;
  color: var(--gray-color5);
}
planning-edit-budget-dialog .budget .form .form-line .form-label {
  font-size: 13px;
  flex-shrink: 0;
  color: var(--gray-color11);
  margin-bottom: 5px;
}
planning-edit-budget-dialog .budget .form .form-line .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
planning-edit-budget-dialog .budget .form .form-line .form-control {
  flex-grow: 1;
}
planning-edit-budget-dialog .budget .form .form-line .form-control.occurs-trend, planning-edit-budget-dialog .budget .form .form-line .form-control.change-amount {
  margin-right: 5px;
}
planning-edit-budget-dialog .budget .form .form-line.category ui-dropdown {
  width: 350px;
}
planning-edit-budget-dialog .budget .form .form-line.interCompany {
  justify-content: space-between;
  flex-direction: row;
}
planning-edit-budget-dialog .budget .form .form-line.interCompany > div {
  width: calc(50% - 5px);
  display: flex;
  justify-content: center;
}
planning-edit-budget-dialog .budget .form .form-line.interCompany > div ui-dropdown {
  width: 100%;
}
planning-edit-budget-dialog .budget .form .form-line.interCompany > div .loader {
  margin: 0 auto;
}
planning-edit-budget-dialog .budget .form .form-line.dynamic-form-line {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
planning-edit-budget-dialog .budget .form .form-line.dynamic-form-line .dynamic-amount {
  width: 200px;
  display: flex;
  align-items: center;
}
planning-edit-budget-dialog .budget .form .form-line.dynamic-form-line .dynamic-amount .dynamic-percentage {
  width: 40px;
  margin-left: 10px;
}
planning-edit-budget-dialog .budget .form .form-line.dynamic-form-line .tooltip {
  left: -200px;
}
planning-edit-budget-dialog .budget .form .form-line.dynamic-form-line .tooltip:after {
  left: calc(100% - 15px) !important;
}
planning-edit-budget-dialog .budget .form .form-line .calculation-control {
  height: 32px;
  border-radius: var(--border-radius);
  border: 1px solid var(--gray-color16);
  padding: 0 10px;
  font-size: 13px;
  font-weight: 400;
  max-width: 100px;
  margin-left: 15px;
}
planning-edit-budget-dialog .budget .form .form-line .calculation-description {
  font-size: 11px;
}
planning-edit-budget-dialog .budget .form .form-line .apply-to .label {
  line-height: 15px;
  color: var(--gray-color5);
  white-space: nowrap;
}
planning-edit-budget-dialog .budget .form .form-line.payment .form-label {
  margin-right: 15px;
}
planning-edit-budget-dialog .budget .form .form-line.payment .rule-3 {
  margin-left: auto;
  padding-left: 10px;
}
planning-edit-budget-dialog .budget .form .form-line .rule {
  display: flex;
  width: 100%;
  height: 32px;
}
planning-edit-budget-dialog .budget .form .form-line .rule.contractRules {
  height: auto;
  flex-wrap: wrap;
}
planning-edit-budget-dialog .budget .form .form-line .rule.contractRules .rule-1 ui-radio-button .label,
planning-edit-budget-dialog .budget .form .form-line .rule.contractRules .rule-1 .rule-label {
  margin-left: 0;
}
planning-edit-budget-dialog .budget .form .form-line .rule.contractRules .rule-3 {
  width: 100%;
}
planning-edit-budget-dialog .budget .form .form-line .rule.contractRules .rule-3 .rule-label:first-child {
  margin-left: 0;
}
planning-edit-budget-dialog .budget .form .form-line .rule .drp-menu {
  max-height: 200px;
  min-width: max-content;
}
planning-edit-budget-dialog .budget .form .form-line .rule .link {
  line-height: 32px;
}
planning-edit-budget-dialog .budget .form .form-line .rule .link.disabled {
  opacity: 0.5;
  cursor: default;
}
planning-edit-budget-dialog .budget .form .form-line .rule-1, planning-edit-budget-dialog .budget .form .form-line .rule-2, planning-edit-budget-dialog .budget .form .form-line .rule-3 {
  display: flex;
}
planning-edit-budget-dialog .budget .form .form-line .rule-2 {
  width: 24%;
}
planning-edit-budget-dialog .budget .form .form-line .rule-2 ui-dropdown, planning-edit-budget-dialog .budget .form .form-line .rule-2 app-datepicker {
  margin-left: auto;
}
planning-edit-budget-dialog .budget .form .form-line .rule-2 .rule-label {
  margin: 0 20px;
}
planning-edit-budget-dialog .budget .form .form-line .rule-1 {
  width: 37%;
  min-width: 155px;
}
planning-edit-budget-dialog .budget .form .form-line .rule-1 ui-radio-button.hideRadio span.button {
  display: none;
}
planning-edit-budget-dialog .budget .form .form-line .rule-3 {
  width: 37%;
  min-width: 145px;
}
planning-edit-budget-dialog .budget .form .form-line .rule-3 .rule-label {
  margin: 0 20px;
}
planning-edit-budget-dialog .budget .form .form-line .rule-label {
  margin-left: 30px;
  line-height: 32px;
  color: var(--gray-color5);
}
planning-edit-budget-dialog .budget .form .form-line .rule-label.input-line {
  line-height: 30px;
}
planning-edit-budget-dialog .budget .form .form-line .link-dropdown {
  margin-left: auto;
}
planning-edit-budget-dialog .budget .form .form-line .link-dropdown .drp-label {
  padding: 0 5px;
  font-size: 13px;
}
planning-edit-budget-dialog .budget .form .form-line .link-dropdown .drp-label .btn-down {
  font-weight: bold;
}
planning-edit-budget-dialog .budget .form .form-line .link-dropdown.input-line .drp-label {
  line-height: 30px;
}
planning-edit-budget-dialog .budget .form .form-line .change-amount {
  margin-left: 20px;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns {
  flex-direction: row;
  align-items: center;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 {
  width: 48%;
  display: flex;
  align-items: center;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 .form-label {
  margin-bottom: 0;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 ui-dropdown, planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 app-datepicker {
  margin-left: 0;
  border: none;
  background: none;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 ui-dropdown .link, planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 app-datepicker .link {
  padding-left: 5px;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 ui-dropdown .drp-label .text, planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 app-datepicker .drp-label .text {
  max-width: 140px;
}
planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 ui-dropdown.time-lag .drp-menu, planning-edit-budget-dialog .budget .form .form-line.form-line-columns .column-2 app-datepicker.time-lag .drp-menu {
  max-height: 290px;
  min-width: 175px;
}
planning-edit-budget-dialog .budget .form .form-line .error-summary {
  background: var(--orange-color2);
  padding: 5px;
  border-radius: 5px;
}
planning-edit-budget-dialog .budget .form .form-line .error-message {
  color: var(--orange-color1);
}
planning-edit-budget-dialog .budget .form .form-line .success-message {
  color: var(--green-color1);
}
planning-edit-budget-dialog .budget .form .form-line.space-between {
  justify-content: space-between;
}
planning-edit-budget-dialog .budget .form .form-line.space-between .item {
  flex-grow: 1;
  flex-basis: 100px;
  margin: 15px 15px 15px 0;
}
planning-edit-budget-dialog .budget .form .form-line.space-between .item:first-child + .item {
  margin: 15px 0 15px 0;
}
planning-edit-budget-dialog .budget .form .form-line.space-between .item ui-dropdown {
  position: relative;
  display: block;
}
planning-edit-budget-dialog .budget .form .contract-period {
  display: flex;
  margin: 20px 0;
  align-items: center;
}
planning-edit-budget-dialog .budget .form .contract-period > * {
  margin-right: 40px;
}
planning-edit-budget-dialog .budget .form .switch-method {
  display: flex;
  flex-direction: row;
  margin-top: 15px;
  margin-bottom: 7px;
}
planning-edit-budget-dialog .budget .form .switch-method .method-box {
  display: flex;
  width: 140px;
  height: 35px;
  color: var(--blue-color6);
  cursor: pointer;
  text-transform: none;
  border: none;
  border-radius: 20px;
  margin: 0 5px;
  padding: 10px;
  min-width: 70px;
  font: 400 11px/13px "Rubik";
  background-color: none;
  align-items: center;
}
planning-edit-budget-dialog .budget .form .switch-method .method-box.disabled {
  opacity: 0.5;
  pointer-events: none;
  cursor: default;
  background: var(--gray-color13) !important;
  color: var(--gray-color19);
}
planning-edit-budget-dialog .budget .form .switch-method .method-box div {
  text-align: center;
  width: 100%;
  font-size: 13px;
  line-height: 15px;
}
planning-edit-budget-dialog .budget .form .switch-method .method-box.inactive {
  color: var(--blue-color6);
}
planning-edit-budget-dialog .budget .form .switch-method .method-box.active {
  background-color: var(--button-blue-background);
  color: var(--blue-color6);
}
planning-edit-budget-dialog .budget .form .switch-method .method-box.active.disabled {
  background: var(--default-font-color) !important;
  opacity: 0.5;
  pointer-events: none;
  cursor: default;
  color: var(--white-color);
}
planning-edit-budget-dialog .budget .form .switch-method .method-box.active.disabled:after {
  border-color: var(--default-font-color) transparent transparent transparent !important;
}
planning-edit-budget-dialog .budget .form app-datepicker .calendar-wrapper {
  top: unset;
  bottom: 30px;
}
planning-edit-budget-dialog .budget .form .form-block .form-label {
  padding-right: 10px;
  width: 110px;
}
planning-edit-budget-dialog .budget .form .suggestion-block {
  display: flex;
  margin-top: 10px;
  margin-bottom: 10px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .loader {
  display: flex;
}
planning-edit-budget-dialog .budget .form .suggestion-block .loader.manual {
  height: 165px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .loader.dynamic {
  height: 230px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .loader .image-load {
  width: 70px;
  margin: auto;
  position: relative;
  top: unset;
  left: unset;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion {
  background-color: var(--background-budget-suggestion);
  border-radius: var(--border-radius);
  flex-grow: 1;
  padding: 22px 25px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-title {
  font-size: 14px;
  line-height: 17px;
  color: var(--black-color0);
  margin-bottom: 25px;
  font-weight: 500;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .row {
  margin-top: 15px;
  width: 100%;
  color: var(--gray-color11);
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-table {
  width: 100%;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-table tr td {
  padding-bottom: 10px;
  padding-right: 5px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-table tr td:nth-child(2) {
  text-align: right;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-table tr td:last-child {
  padding-right: 0;
  text-align: -webkit-right;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-table .link {
  padding-left: unset;
}
planning-edit-budget-dialog .budget .form .suggestion-block .suggestion .suggestion-table .link.disabled {
  opacity: 0.5;
  cursor: default;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-form-label {
  width: 20%;
  max-width: 110px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion {
  background-color: var(--background-budget-suggestion);
  border-radius: var(--border-radius);
  width: 100%;
  flex-grow: 1;
  flex-basis: 100px;
  padding: 22px 25px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .suggestion-title {
  font-size: 14px;
  line-height: 17px;
  color: var(--black-color0);
  margin-bottom: 25px;
  font-weight: 500;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row {
  margin-top: 15px;
  width: 100%;
  display: flex;
  color: var(--gray-color11);
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row.header {
  font-weight: 500;
  color: var(--black-color0);
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row.total {
  color: var(--black-color0);
  font-weight: 500;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row.total span {
  width: unset;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row.total span.title {
  width: unset;
  margin-right: 10px;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row span {
  width: 17.5%;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row span.title {
  width: 30%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row span.total {
  color: var(--black-color0);
  font-weight: 500;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row span.link {
  width: 37%;
  text-transform: none !important;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row span.link.disabled {
  opacity: 0.5;
  cursor: default;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row .tooltip-title {
  position: relative;
  display: inline-block;
  width: 30%;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row .tooltip-title .title {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row .tooltip-title .tooltip {
  top: 50%;
  z-index: 1;
  width: auto;
  color: var(--white-color);
  line-height: 1.3;
  visibility: hidden;
  text-align: center;
  padding: 5px 10px;
  transform: translateY(-50%);
}
planning-edit-budget-dialog .budget .form .suggestion-block .dynamic-suggestion .row .tooltip-title:hover .tooltip {
  visibility: visible;
}
planning-edit-budget-dialog .budget .buttons {
  margin-top: 15px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 16px;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
}
planning-edit-budget-dialog .budget .buttons .cancel {
  width: 85px;
}
planning-edit-budget-dialog .budget .buttons .save {
  width: 105px;
}
planning-edit-budget-dialog .transactions-table {
  padding: 20px !important;
  width: 100%;
  overflow: hidden;
  border-radius: var(--border-radius);
}
planning-edit-budget-dialog .transactions-table.chart-part {
  padding: 20px;
}
planning-edit-budget-dialog .transactions-table .filter-input-wrapper {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
planning-edit-budget-dialog .transactions-table .filter-input-wrapper .transactions-title {
  margin: 0;
}
planning-edit-budget-dialog .transactions-table .filter-input-wrapper .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
planning-edit-budget-dialog .transactions-table .no-new-transactions {
  margin: 0;
}
planning-edit-budget-dialog .transactions-table .transactions-title {
  margin: 0 0 10px 0;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: var(--black-color0);
}
planning-edit-budget-dialog .transactions-table .pagination {
  display: flex;
  justify-content: center;
  margin: 10px 0;
}
planning-edit-budget-dialog .transactions-table .body {
  border: var(--default-border);
  overflow-y: auto;
  max-height: 350px;
}
planning-edit-budget-dialog .transactions-table .body {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-edit-budget-dialog .transactions-table .body { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-edit-budget-dialog .transactions-table .body::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-edit-budget-dialog .transactions-table .body::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-edit-budget-dialog .transactions-table .body::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
planning-edit-budget-dialog .transactions-table .body .transaction {
  display: flex;
  align-items: center;
  height: 70px !important;
  border-bottom: var(--default-border);
  background: var(--white-color);
  padding: 0 10px;
}
planning-edit-budget-dialog .transactions-table .body .transaction:last-child {
  border-bottom: none;
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell {
  color: var(--gray-color3);
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.date {
  width: 20%;
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.date .month-year {
  font-size: 13px;
  line-height: 15px;
  white-space: nowrap;
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.info {
  width: 40% !important;
  text-align: left;
  display: flex;
  flex-direction: column;
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.info .tags {
  margin: 5px 0;
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.info .name {
  font-weight: 500;
  color: var(--black-color0);
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.info .description, planning-edit-budget-dialog .transactions-table .body .transaction .cell.info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.amount {
  flex: 0 1 10px;
  width: 30%;
  padding: 0 20px;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  color: var(--black-color0);
}
planning-edit-budget-dialog .transactions-table .body .transaction .cell.action {
  font-size: 15px;
  color: var(--blue-color6);
  width: 10%;
  margin-right: 20px;
  flex: 0 0 30px;
}
@media screen and (max-width: 1050px) {
  planning-edit-budget-dialog .transactions-table {
    max-width: unset;
    width: 100%;
  }
}

planning-edit-budget-dialog highcharts-chart {
  display: block !important;
  width: 100% !important;
}
planning-edit-budget-dialog highcharts-chart > div {
  width: 100% !important;
}
planning-edit-budget-dialog highcharts-chart > div > svg {
  width: 100% !important;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
planning-cash-flow-chart {
  display: block;
  position: relative;
}
planning-cash-flow-chart .content {
  display: block;
  padding-bottom: 53px;
}
planning-cash-flow-chart .content .highcharts-tooltip {
  display: none !important;
  visibility: hidden !important;
}
planning-cash-flow-chart .content .series-point {
  display: flex;
}
planning-cash-flow-chart .content .series-point span, planning-cash-flow-chart .content .series-point div {
  margin-top: auto;
}
planning-cash-flow-chart .content .series-point .name {
  margin-right: auto;
  display: flex;
}
planning-cash-flow-chart .content .series-point .symbol {
  width: 15px;
}
planning-cash-flow-chart .content .series-point .accountCurrency {
  margin-right: 5px;
  margin-left: 5px;
}
planning-cash-flow-chart .content .series-point .tooltip-amount, planning-cash-flow-chart .content .series-point .tooltip-amount-positive, planning-cash-flow-chart .content .series-point .tooltip-amount-negative {
  line-height: 13px;
  font-size: 13px;
}
planning-cash-flow-chart .legend-bg {
  margin: 10px 0 10px 220px;
  min-height: 110px;
  border-radius: 5px;
}
planning-cash-flow-chart .legend-bg.grayBg {
  background: var(--white-color8);
}
planning-cash-flow-chart .legend-bg .chart-point-info {
  display: flex;
  padding: 20px;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col {
  font-size: 13px;
  color: var(--black-color3);
  margin-right: 20px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.col-empty {
  padding-left: 50px;
  border-left: 1px solid var(--gray-color5);
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .title {
  font-size: 13px;
  padding-right: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 100px;
  white-space: nowrap;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .title.bold {
  font-weight: bold;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .button {
  text-transform: uppercase;
  color: var(--blue-color3);
  cursor: pointer;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .button:hover {
  text-decoration: underline;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row .square, planning-cash-flow-chart .legend-bg .chart-point-info .col .row .circle {
  width: 8px;
  height: 8px;
  margin-right: 8px;
  flex: 0 0 8px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row .sum {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-grow: 1;
  text-align: right;
  width: 110px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row .circle {
  border-radius: 50%;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row.green {
  color: var(--green-color1);
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row.green .square {
  background-color: var(--green-color1);
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row.red {
  color: var(--orange-color1);
}
planning-cash-flow-chart .legend-bg .chart-point-info .col .row.red .square {
  background-color: var(--orange-color1);
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.first-col {
  width: 150px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.second-col {
  width: 320px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.end-balance {
  max-height: 51px;
  overflow-y: scroll;
  padding-right: 20px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.end-balance {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  planning-cash-flow-chart .legend-bg .chart-point-info .col.end-balance { /* For Firefox */
    scrollbar-width: thin;
  }
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.end-balance::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.end-balance::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
planning-cash-flow-chart .legend-bg .chart-point-info .col.end-balance::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}

cash-flow-bar-chart {
  display: block;
  position: relative;
}
cash-flow-bar-chart .content {
  display: block;
  padding-bottom: 20px;
}
cash-flow-bar-chart .content .highcharts-tooltip {
  display: none !important;
  visibility: hidden !important;
}
cash-flow-bar-chart .content .series-point {
  display: flex;
}
cash-flow-bar-chart .content .series-point span, cash-flow-bar-chart .content .series-point div {
  margin-top: auto;
}
cash-flow-bar-chart .content .series-point .name {
  margin-right: auto;
  display: flex;
}
cash-flow-bar-chart .content .series-point .symbol {
  width: 15px;
}
cash-flow-bar-chart .content .series-point .accountCurrency {
  margin-right: 5px;
  margin-left: 5px;
}
cash-flow-bar-chart .content .series-point .tooltip-amount, cash-flow-bar-chart .content .series-point .tooltip-amount-positive, cash-flow-bar-chart .content .series-point .tooltip-amount-negative {
  line-height: 13px;
  font-size: 13px;
}
cash-flow-bar-chart .legend-bg {
  margin: 10px 0 10px 220px;
  min-height: 110px;
  border-radius: 5px;
}
cash-flow-bar-chart .legend-bg.grayBg {
  background: var(--white-color8);
}
cash-flow-bar-chart .legend-bg .chart-point-info {
  padding: 20px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col {
  font-size: 13px;
  color: var(--black-color3);
  margin-right: 20px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .title {
  font-size: 13px;
  padding-right: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 100px;
  white-space: nowrap;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .title.bold {
  font-weight: bold;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .button {
  text-transform: uppercase;
  color: var(--blue-color3);
  cursor: pointer;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .button:hover {
  text-decoration: underline;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row .square, cash-flow-bar-chart .legend-bg .chart-point-info .col .row .circle {
  width: 8px;
  height: 8px;
  margin-right: 8px;
  flex: 0 0 8px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row .sum {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-grow: 1;
  text-align: right;
  width: 110px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row .circle {
  border-radius: 50%;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row.green {
  color: var(--green-color1);
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row.green .square {
  background-color: var(--green-color1);
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row.red {
  color: var(--orange-color1);
}
cash-flow-bar-chart .legend-bg .chart-point-info .col .row.red .square {
  background-color: var(--orange-color1);
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.first-col {
  width: 150px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.second-col {
  width: 320px;
  border-right: 1px solid var(--gray-color5);
  padding-right: 50px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.end-balance {
  max-height: 51px;
  overflow-y: scroll;
  padding-right: 20px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.end-balance {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  cash-flow-bar-chart .legend-bg .chart-point-info .col.end-balance { /* For Firefox */
    scrollbar-width: thin;
  }
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.end-balance::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.end-balance::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
cash-flow-bar-chart .legend-bg .chart-point-info .col.end-balance::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.popover-title {
  height: 40px;
  display: flex;
  justify-content: left;
  align-items: center;
}
.popover-item {
  position: relative;
  cursor: pointer;
  background: var(--white-color);
  transition: all linear 0.2s;
  display: flex;
  align-items: center;
}
.popover-item:before {
  content: "";
  position: absolute;
  background: transparent;
  width: 5px;
  height: 100%;
  left: 0;
  top: 0;
  transition: linear 0.2s;
}
.popover-item:hover {
  background: var(--gray-color4);
}
.popover-item:hover:before {
  background: var(--green-color1);
}

.popover-bottom {
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: var(--default-border);
}
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
popover-user-profile {
  display: block;
}
popover-user-profile .popover {
  top: 45px;
  right: 0;
}
popover-user-profile .popover .popover-title {
  color: var(--gray-color1);
  flex-wrap: wrap;
  height: auto;
  padding: 10px 0 10px 25px !important;
}
popover-user-profile .popover .popover-title .subtitle {
  position: relative;
}
popover-user-profile .popover .popover-title .subtitle:after {
  border: 0.5px solid var(--gray-color18);
  width: 77px;
  content: "";
  position: absolute;
  margin-top: 20px;
  left: 0;
}
popover-user-profile .popover .popover-title .username {
  max-width: 200px;
  text-overflow: ellipsis;
  overflow: hidden;
}
popover-user-profile .popover a.link {
  width: 200px;
  display: flex;
  transition: color linear 0.2s;
  align-items: center;
  line-height: 1;
  font-size: 14px;
  font-weight: 300;
  height: 53px;
}
popover-user-profile .popover a.link .icon {
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  --Iconsax-Color: var(--gray-color1);
}
popover-user-profile .popover a.link .text {
  color: var(--gray-color1);
  transition: color linear 0.2s;
}
popover-user-profile .popover a.link:hover, popover-user-profile .popover a.link.active {
  background: var(--gray-color13);
  text-decoration: none;
}
popover-user-profile .popover a.link:hover .icon, popover-user-profile .popover a.link.active .icon {
  --Iconsax-Color: var(--green-color1);
}
popover-user-profile .popover a.link:hover .text, popover-user-profile .popover a.link.active .text {
  color: var(--menu-link-color);
}
popover-user-profile .popover a.link:nth-last-child, popover-user-profile .popover a.link:nth-child(3) {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--gray-color18);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-datepicker {
  position: relative;
  display: block;
  justify-content: space-between;
  color: var(--gray-color5);
}
app-datepicker.full {
  width: 100%;
}
app-datepicker.full .input-text {
  margin: 0;
  width: 100%;
}
app-datepicker.error .input-text {
  border-color: var(--orange-color1);
}
app-datepicker.opened {
  z-index: 11;
}
app-datepicker.opened .calendar-wrapper {
  display: block;
}
app-datepicker.to-top .calendar-wrapper {
  top: auto !important;
  bottom: 29px;
  border-radius: var(--border-radius) var(--border-radius) 0 0;
}
app-datepicker.to-right .calendar-wrapper {
  left: auto;
  right: 0;
}
app-datepicker.to-left .calendar-wrapper {
  left: 0;
  right: auto;
}
app-datepicker.to-left-top .calendar-wrapper {
  top: auto;
  bottom: 30px;
  right: 0;
  left: unset;
}
app-datepicker .link {
  color: var(--link-color);
  font-weight: 500;
  cursor: pointer;
  text-transform: unset !important;
  display: flex;
  align-items: center;
}
app-datepicker .link.disabled {
  opacity: 0.5;
  cursor: default;
}
app-datepicker .input-text {
  border-radius: var(--border-radius);
  border: var(--default-border);
  color: var(--black-color1);
  padding: 0 10px;
  font-size: 13px;
  font-weight: 400;
  height: 32px;
  width: 160px;
  margin: 0 5px;
  transition: border-color linear 0.2s;
}
app-datepicker .calendar-wrapper {
  position: absolute;
  top: 31px;
  left: 0;
  display: none;
  padding: 8px;
  background: var(--white-color);
  border: var(--default-border);
  box-shadow: 0 0 10px var(--shadow-color1);
  border-radius: 4px;
}
app-datepicker .calendar-wrapper.useLink {
  top: 20px;
}
app-datepicker .calendar-wrapper .header {
  margin: 5% calc(4.7142857143% - 16px);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
app-datepicker .calendar-wrapper .header .title {
  font-size: 14px;
  cursor: pointer;
  color: var(--gray-color5);
  padding: 0 16px;
  font-weight: 500;
  line-height: 36px;
  transition: opacity 200ms cubic-bezier(0.35, 0, 0.25, 1), background-color 200ms cubic-bezier(0.35, 0, 0.25, 1);
  border-radius: 4px;
  text-transform: uppercase;
}
app-datepicker .calendar-wrapper .header .title:hover {
  background: var(--white-color3);
}
app-datepicker .calendar-wrapper .row {
  padding: 0 0 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 280px;
  flex-wrap: wrap;
}
app-datepicker .calendar-wrapper .row .item {
  width: 34px;
  height: 34px;
  line-height: 34px;
  font-size: 14px;
  text-align: center;
  cursor: default;
  border-radius: 50%;
}
app-datepicker .calendar-wrapper .row .item:not(.disabled) {
  cursor: pointer;
}
app-datepicker .calendar-wrapper .row .item:hover {
  background-color: var(--green-color7);
}
app-datepicker .calendar-wrapper .row .item.active {
  color: var(--white-color) !important;
  background: var(--green-color1) !important;
  border-radius: 100% !important;
}
app-datepicker .calendar-wrapper .row .item.next, app-datepicker .calendar-wrapper .row .item.last, app-datepicker .calendar-wrapper .row .item.disabled {
  color: var(--gray-color13);
}
app-datepicker .calendar-wrapper .row .item.current {
  border: var(--green-color1);
}
app-datepicker .calendar-wrapper .row .item.month {
  width: 50px;
  cursor: pointer;
  border-radius: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  height: 50px;
  margin: 5px 5%;
}
app-datepicker .calendar-wrapper .row .item.month:hover:not(.disabled):not(.active) {
  color: var(--menu-link-color);
  background-color: var(--green-color7);
}
app-datepicker .presets {
  display: flex;
  justify-content: center;
  align-items: center;
}
app-datepicker .presets span {
  padding: 8px 12px;
  background: none;
  background-color: var(--black-color-transparent);
  border: none;
  cursor: pointer;
  color: var(--blue-color3);
}
app-datepicker .presets span .active, app-datepicker .presets span:hover {
  background-color: var(--button-blue-background);
  border-radius: 20px;
}
app-datepicker .calendar-helper {
  margin: 10px 20px 30px;
  background: var(--gray-color5);
  border: var(--gray-color5);
  border-radius: var(--border-radius);
  padding: 15px 20px;
}
app-datepicker .calendar-helper .item {
  position: relative;
  padding-left: 25px;
}
app-datepicker .calendar-helper .item:before {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  left: 0;
  width: 8px;
  height: 0;
  border-radius: 1px;
}
app-datepicker .calendar-helper .amr {
  margin-bottom: 10px;
}
app-datepicker .calendar-helper .amr:before {
  border-top: 2px solid var(--orange-color6);
  border-bottom: 1px solid var(--orange-color6);
}
app-datepicker .calendar-helper .determination:before {
  border-top: 2px solid var(--green-color1);
  border-bottom: 1px solid var(--green-color1);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
reporting-report-dialog .dialog .title {
  margin-top: 18px;
}
reporting-report-dialog .dialog .properties {
  border-bottom: var(--default-border);
  padding: 10px 18px 10px 18px;
  display: flex;
  flex-direction: column;
}
reporting-report-dialog .dialog .properties .form-row {
  display: flex;
  height: 40px;
  justify-content: flex-start;
  align-items: center;
}
reporting-report-dialog .dialog .properties .form-row.name {
  height: 50px;
}
reporting-report-dialog .dialog .properties .form-row .form-label {
  width: 80px;
}
reporting-report-dialog .dialog .properties .form-row .form-control {
  flex-grow: 1;
}
reporting-report-dialog .dialog .properties .form-row .form-control .notification-feature {
  margin-left: 4px;
}
reporting-report-dialog .dialog .layout {
  border-bottom: var(--default-border);
  padding: 0 18px 10px 18px;
}
reporting-report-dialog .dialog .layout .select {
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
reporting-report-dialog .dialog .layout .select .horizontal {
  width: 118px;
  height: 76px;
  background: url(/assets/images/icons/layout-horizontal.png);
}
reporting-report-dialog .dialog .layout .select .vertical {
  width: 82px;
  height: 112px;
  background: url(/assets/images/icons/layout-vertical.png);
}
reporting-report-dialog .dialog .layout .select .horizontal, reporting-report-dialog .dialog .layout .select .vertical {
  box-sizing: content-box;
  border: var(--default-input-border);
  margin: 2px;
}
reporting-report-dialog .dialog .layout .select .horizontal.active, reporting-report-dialog .dialog .layout .select .horizontal:active, reporting-report-dialog .dialog .layout .select .horizontal:hover, reporting-report-dialog .dialog .layout .select .vertical.active, reporting-report-dialog .dialog .layout .select .vertical:active, reporting-report-dialog .dialog .layout .select .vertical:hover {
  border: 3px solid var(--green-color1);
  margin: 0;
}
reporting-report-dialog .dialog .tags {
  border-bottom: var(--default-border);
  padding: 0 18px 20px 18px;
  display: flex;
  flex-direction: column;
}
reporting-report-dialog .dialog .tags .tags-list {
  padding: 8px 0;
  display: flex;
}
reporting-report-dialog .dialog .tags .tags-list .tag {
  margin: 3px 3px 3px 0;
}
reporting-report-dialog .dialog .tags .input-tag {
  flex-grow: 1;
  height: 40px;
}
reporting-report-dialog .dialog .tags .btn-add-tag {
  position: absolute;
  right: 4px;
  top: 4px;
  width: 65px;
}
reporting-report-dialog .dialog .tags .check-auto-tag {
  margin-top: 15px;
}
reporting-report-dialog .dialog .actions {
  border-bottom: var(--default-border);
  padding: 0 18px 0 18px;
  height: 75px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
reporting-report-dialog .dialog .actions .btn-cancel {
  margin-right: 10px;
  width: 85px;
}
reporting-report-dialog .dialog .actions .btn-save {
  width: 105px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-report-tab {
  position: relative;
}
app-report-tab app-input-month-select {
  width: 200px !important;
}
app-report-tab .mat-date-range-input-container {
  align-items: unset;
}
app-report-tab ui-plug {
  padding: 0 20px;
}
app-report-tab .picker {
  background: var(--white-color);
}
app-report-tab app-input-date-range {
  width: 200px !important;
}
app-report-tab .datepicker {
  position: relative;
  margin-right: 8px;
}
app-report-tab .datepicker > ui-button {
  position: absolute;
  right: 0;
  top: 0;
}
app-report-tab .datepicker app-datepicker {
  background: var(--white-color);
  width: 200px;
  border: var(--default-border);
  border-radius: var(--border-radius);
  font-size: 13px;
  height: 32px;
  padding-left: 10px;
  cursor: pointer;
  align-items: center;
  transition: border-color linear 0.2s;
  display: flex;
  justify-content: space-between;
}
app-report-tab .datepicker app-datepicker .link {
  width: 100%;
  color: var(--black-color1);
  cursor: pointer;
  font-weight: 400;
  text-decoration: none;
  font-weight: 400;
}
app-report-tab .datepicker app-datepicker .calendar-wrapper {
  top: 31px !important;
}
app-report-tab .datepicker app-datepicker .calendar-wrapper .row .item.disabled:hover {
  background: transparent;
}
app-report-tab .datepicker .btn-down {
  position: absolute;
  right: 10px;
  top: 12px;
  font-size: 10px;
  color: var(--black-color1);
  pointer-events: none;
  cursor: pointer;
}
app-report-tab .header-container .download {
  margin-left: auto;
}
app-report-tab .plan-select, app-report-tab .range-picker {
  width: 200px;
}
app-report-tab .mat-form-field-wrapper {
  padding: 0;
}
app-report-tab .mat-form-field-appearance-fill .mat-form-field-flex {
  border-radius: var(--border-radius);
}
app-report-tab .upload {
  background: var(--gray-color13);
  border: none;
  border-radius: 50%;
  width: 32px;
  position: relative;
  margin-left: 5px;
}
app-report-tab .upload:hover .tooltip {
  display: block;
  top: calc(100% + 5px);
  right: 0;
}
app-report-tab .upload:hover .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 20px);
}
app-report-tab .filters ui-check-box {
  margin-right: 10px;
}
app-report-tab .filters ui-check-box ::ng-deep .label {
  margin-left: 5px;
}
app-report-tab .dropdown {
  min-width: 200px;
}
app-report-tab .actions-panel {
  padding: 0 25px 0 25px;
  min-height: 45px;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
app-report-tab .actions-panel .button-back {
  padding: 0;
  margin-right: 20px;
}
app-report-tab .actions-panel .filters {
  display: flex;
  align-items: center;
  margin-right: auto;
  flex-wrap: wrap;
  gap: 4px;
}
app-report-tab .actions-panel .filters > * {
  margin-right: 10px;
}
app-report-tab .actions-panel .filters .filter {
  margin-right: 8px;
  width: 200px;
}
app-report-tab .actions-panel .filters .toggle {
  display: flex;
  align-items: center;
  width: auto;
}
app-report-tab .actions-panel .filters .wrapper-tooltip:hover .tooltip {
  display: inline-flex;
}
app-report-tab .actions-panel .filters .wrapper-tooltip {
  display: inline-flex;
  position: relative;
  margin-right: 5px;
}
app-report-tab .actions-panel .filters .wrapper-tooltip .tooltip {
  top: 28px;
  margin-left: 5px;
}
app-report-tab .actions-panel .filters .wrapper-tooltip .tooltip:after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 15px;
}
app-report-tab .actions-panel .item .success-summary {
  margin: 0;
}
app-report-tab .actions-panel .action-buttons {
  display: flex;
}
app-report-tab .actions-panel .action-buttons .reset {
  display: flex;
}
app-report-tab .actions-panel .action-buttons ui-button {
  margin-left: 5px;
}
app-report-tab .actions-panel .action-buttons .btn-run-report {
  width: 65px;
  margin-right: 5px;
}
app-report-tab .actions-panel .action-buttons .btn-save-report {
  min-width: 65px;
}
app-report-tab .report {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin: 15px 20px 15px;
  min-height: 100px;
  display: flex;
  flex-direction: column;
}
app-report-tab .report .header-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 15px;
  height: 65px;
}
app-report-tab .report .header-info .left-part {
  display: flex;
  align-items: center;
}
app-report-tab .report .header-info .left-part .img {
  height: 37px;
}
app-report-tab .report .header-info .left-part .title {
  margin-left: 15px;
}
app-report-tab .report .header-info .right-part {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
app-report-tab .report .header {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100px;
  margin-top: -20px;
  border-bottom: var(--default-border);
}
app-report-tab .report .header .period {
  margin-top: 10px;
}
app-report-tab .report .cash-flow-table {
  margin: 20px 0 0 0;
  display: flex;
  flex-direction: column;
}
app-report-tab .report .cash-flow-table .periods-header {
  display: flex;
  justify-content: flex-start;
  padding-left: 300px;
}
app-report-tab .report .cash-flow-table .periods-header .cell {
  flex-shrink: 0;
  flex-grow: 1;
  flex-basis: 170px;
  height: 55px;
  padding-left: 15px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
app-report-tab .report .cash-flow-table .body {
  display: flex;
  flex-direction: column;
}
app-report-tab .report .cash-flow-table .body .block {
  display: block;
}
app-report-tab .report .cash-flow-table .body .pdf-container {
  width: 100%;
  height: 1000px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
app-report-tab .report .cash-flow-table .body .loader {
  height: 400px;
  width: 100%;
}
app-report-tab .report .cash-flow-table .body .aggregator {
  display: flex;
  flex-direction: column;
  margin-bottom: 5px;
}
app-report-tab .report .cash-flow-table .body .aggregator:last-child {
  margin-bottom: 0;
}
app-report-tab .report .cash-flow-table .body .aggregator .aggregator-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 50px;
  background-color: var(--gray-color8);
}
app-report-tab .report .cash-flow-table .body .aggregator .aggregator-header .title {
  flex-shrink: 0;
  width: 300px;
  padding-left: 35px;
}
app-report-tab .report .cash-flow-table .body .aggregator .aggregator-header .cell {
  flex-basis: 170px;
  flex-shrink: 0;
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
  padding-left: 15px;
}
app-report-tab .report .cash-flow-table .body .aggregator .categories {
  display: flex;
  flex-direction: column;
}
app-report-tab .report .cash-flow-table .body .aggregator .categories .category {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 45px;
  border-bottom: var(--default-border);
  background-color: var(--white-color);
}
app-report-tab .report .cash-flow-table .body .aggregator .categories .category .title {
  flex-shrink: 0;
  width: 300px;
  padding-left: 45px;
}
app-report-tab .report .cash-flow-table .body .aggregator .categories .category .cell {
  flex-basis: 170px;
  flex-shrink: 0;
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
  padding-left: 15px;
}
app-report-tab .report .cash-flow-table .body .aggregator.hasChildren .aggregator-header {
  height: 40px;
  border-bottom: var(--default-border);
  background-color: var(--white-color);
  margin-top: 15px;
}
app-report-tab .report .cash-flow-table .body .aggregator.hasChildren.last {
  margin-bottom: 30px;
}
app-report-tab .report .footer-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 15px;
  height: 100px;
}
app-report-tab .report .footer-info .left-part {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
app-report-tab .report .footer-info .right-part {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
app-report-tab .pagination {
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}
app-report-tab .pagination .item {
  display: flex;
  justify-content: center;
  align-items: center;
  border: var(--default-border);
  border-radius: var(--border-radius);
  background: var(--white-color);
  width: 32px;
  height: 32px;
  margin-right: 1px;
  cursor: pointer;
  color: var(--blue-color3);
  transition: linear 0.2s;
}
app-report-tab .pagination .item:hover, app-report-tab .pagination .item:active, app-report-tab .pagination .item.active {
  background: var(--gray-color6);
  color: var(--black-color0);
}
app-report-tab .pagination .item.active {
  cursor: default;
}
app-report-tab .pagination .item.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.5;
  color: var(--gray-color2);
}
app-report-tab .pagination .item span {
  line-height: 1;
  font-size: 14px;
}
app-report-tab .pagination .item.prev {
  margin-right: 2px;
}
app-report-tab .pagination .item.next {
  margin-left: 1px;
}
app-report-tab .pagination .item.prev span, app-report-tab .pagination .item.next span {
  font-size: 12px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
profile-info .loader {
  text-align: center;
  height: 160px;
  width: 100%;
}
profile-info .loader .image-load {
  width: 80px;
  margin: -40px 0 0 -40px;
}
profile-info .form-label {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 3px;
}
profile-info .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
profile-info .content-container {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin: 15px 0;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
  background: var(--white-color);
}
profile-info .content-container .uploader {
  padding: 20px 20px 20px 20px;
  width: 230px;
}
profile-info .content-container .fields {
  flex-grow: 1;
  padding: 0 15px 0 13px;
  padding-bottom: 25px;
}
profile-info .content-container .fields .row {
  display: flex;
  margin-top: 20px;
}
profile-info .content-container .fields .row.change-password {
  border-bottom: var(--default-border);
  padding: 10px 0;
}
profile-info .content-container .fields .row.email-reset {
  display: flex;
  flex-wrap: wrap;
}
profile-info .content-container .fields .row.email-reset .label {
  width: 100%;
  margin-bottom: 10px;
}
profile-info .content-container .fields .row.email-reset ui-text-box {
  width: 300px;
}
profile-info .content-container .fields .row .item {
  flex-grow: 1;
  flex-basis: 100px;
  margin: 0 32px 0 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
profile-info .content-container .fields .row .item:last-child {
  margin-right: 0;
}
profile-info .content-container .fields .row .item.change {
  flex-basis: 150px;
  flex-grow: 0;
}
profile-info .content-container .fields .row .item.item-row {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
profile-info .actions-container {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 95px;
  padding: 0 15px;
}
profile-info .actions-container .buttons {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}
profile-info .actions-container .buttons .change-password {
  margin-right: auto;
}
profile-info .actions-container .become-tenant {
  padding-left: 15px;
  color: var(--black-color0);
}
profile-info .actions-container .become-tenant .link {
  font-weight: bold;
}
profile-info .actions-container .btn-cancel {
  width: 85px;
}
profile-info .actions-container .btn-save {
  width: 150px;
  margin-left: 10px;
}
profile-info .terms-agree {
  padding: 0 20px 20px;
  margin-top: -20px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
profile-info .terms-agree .label {
  margin-left: 10px;
}
profile-info ui-modal b {
  color: var(--black-color0);
}
profile-info .themes {
  display: flex;
  justify-content: flex-start;
}
profile-info .themes .theme {
  width: 25%;
  padding: 0 20px;
  text-align: center;
}
profile-info .themes .theme .radio {
  padding: 20px 0;
}
profile-info .themes .theme .picture img {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  width: 100%;
}
profile-info .terms-error {
  margin-top: 10px;
  padding: 5px;
  background: var(--orange-color2);
  color: var(--orange-color1);
}
profile-info ui-check-box + .form-label {
  margin: 0 0 0 10px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.main-container {
  padding: 0 25px;
}
.main-container .content-panel {
  flex-grow: 1;
  margin: 15px 0;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
  background: var(--white-color);
}

.content-wrapper {
  padding: 20px 30px;
}

.card-container .card-header .card-title {
  margin-top: 13px;
}

.card-title-note {
  margin-top: 5px !important;
}
.card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}

app-settings-account .card-container {
  width: 100%;
  padding: 0 20px 20px;
  min-height: 200px;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  display: flex;
  flex-direction: column;
}
app-settings-account .card-container .card-header {
  color: var(--gray-color5);
  font-weight: 500;
  font-size: 16px;
  margin: 0 0 20px 0;
  border: none;
}
app-settings-account .version {
  margin-bottom: 32px;
  display: inline-flex;
  align-items: center;
  line-height: 16px;
}
app-settings-account .version__text {
  color: var(--gray-color5);
}
app-settings-account .version__release-notes-link {
  margin-left: 16px;
  color: var(--blue-color6);
  text-decoration: none;
  display: inline-flex;
}
app-settings-account .version__release-notes-link .iconsax {
  --Iconsax-Size: 16px;
  --Iconsax-Color: var(--blue-color6);
  margin-left: 4px;
}
app-settings-account .billing-button {
  width: 180px;
  margin-left: 20px;
}
app-settings-account .subscription-ends {
  margin-top: 5px;
}
app-settings-account .subscription {
  margin-top: 6px;
  height: 32px;
}
app-settings-account .subscription span {
  border: var(--default-border);
  display: inline-block;
  border-radius: var(--border-radius);
  padding: 5px;
  min-width: 350px;
}
app-settings-account div.global-page-loader {
  margin: 30px 0;
  position: relative;
}
app-settings-account div.global-page-loader .image-load {
  width: 70px;
}
app-settings-account .legal-documents {
  margin-top: 50px;
}
app-settings-account .legal-documents .title {
  position: relative;
  font-weight: 500;
  font-size: 16px;
  color: var(--gray-color5);
  margin-bottom: 30px;
}
app-settings-account .legal-documents .title:after {
  border-bottom: 1px solid var(--gray-color14);
  width: 77px;
  content: "";
  position: absolute;
  top: 30px;
  left: 0;
  background-color: var(--gray-color14);
}
app-settings-account .legal-documents .documents .document {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
app-settings-account .legal-documents .documents .document > i {
  margin-right: 5px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.main-container {
  padding: 0 25px;
}
.main-container .content-panel {
  flex-grow: 1;
  margin: 15px 0;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
  background: var(--white-color);
}

.content-wrapper {
  padding: 20px 30px;
}

.card-container .card-header .card-title {
  margin-top: 13px;
}

.card-title-note {
  margin-top: 5px !important;
}
.card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}

app-settings-companies .global-page-loader .loader .image-load {
  width: 70px;
}
app-settings-companies .main-container {
  padding-top: 0;
}
app-settings-companies .card-container {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  display: flex;
  flex-direction: column;
}
app-settings-companies .card-container .card-header {
  height: 45px;
  border-bottom: var(--default-border);
  align-items: center;
}
app-settings-companies .card-container .card-header .card-title {
  margin-left: 20px;
  width: 100%;
  margin-top: 10px;
}
app-settings-companies .companies-table-header {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
app-settings-companies .companies-table-header .btn-setup-new-company {
  width: 150px;
  margin-right: 20px;
}
app-settings-companies .sortable-container {
  min-height: 5px;
}
app-settings-companies .sortable-chosen {
  cursor: move;
}
app-settings-companies .sortable-chosen:not(.sortable-drag) {
  opacity: 0.8;
  background: var(--green-color18) !important;
}
app-settings-companies .sortable-chosen:not(.sortable-drag) .company-level1, app-settings-companies .sortable-chosen:not(.sortable-drag) .company-level2, app-settings-companies .sortable-chosen:not(.sortable-drag) .company-level3, app-settings-companies .sortable-chosen:not(.sortable-drag) .company-level4, app-settings-companies .sortable-chosen:not(.sortable-drag) .company-level5 {
  opacity: 0.8;
  background: var(--green-color18) !important;
}
app-settings-companies .sortable-chosen .text {
  color: var(--gray-color2) !important;
}
app-settings-companies .sortable-drag {
  background: var(--green-color19) !important;
  opacity: 1 !important;
  box-sizing: border-box;
  box-shadow: 2px 2px 2px var(--green-color23);
}
app-settings-companies .sortable-drag .text {
  color: var(--black-color0) !important;
}
app-settings-companies .sortable-drag .company-level1, app-settings-companies .sortable-drag .company-level2, app-settings-companies .sortable-drag .company-level3, app-settings-companies .sortable-drag .company-level4, app-settings-companies .sortable-drag .company-level5 {
  background: var(--green-color19) !important;
}
app-settings-companies .companies-table {
  min-width: 800px;
  margin: 0 !important;
}
app-settings-companies .companies-table .separator {
  height: 40px;
}
app-settings-companies .companies-table div.selected {
  background: var(--green-color3) !important;
}
app-settings-companies .companies-table .header {
  display: flex;
  background: var(--white-color);
  font-weight: 500;
  font-size: 13px;
  color: var(--gray-color5);
  height: 40px;
  border-bottom: var(--default-border-header);
}
app-settings-companies .companies-table .header .long {
  display: flex;
  margin: 0 15px;
  width: 430px;
  align-items: center;
}
app-settings-companies .companies-table .header .middle, app-settings-companies .companies-table .header .short {
  display: flex;
  margin: 0 auto 0 15px;
  color: var(--black-color0);
}
app-settings-companies .companies-table .header .middle div, app-settings-companies .companies-table .header .short div {
  margin: auto;
}
app-settings-companies .companies-table .header .middle {
  width: 10%;
}
app-settings-companies .companies-table .header .short {
  width: 7%;
}
app-settings-companies .companies-table .header .icons {
  display: flex;
  width: 10%;
  margin: auto;
  min-width: 105px;
}
app-settings-companies .companies-table .header .icons .actions {
  min-width: 105px;
  display: flex;
  align-items: flex-start;
}
app-settings-companies .companies-table .header .icons .actions ui-button {
  margin-left: 5px;
}
app-settings-companies .companies-table .drag-and-drop-icon {
  font-size: 20px;
  align-items: center;
  display: flex;
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
  cursor: move;
  z-index: 1;
}
app-settings-companies .companies-table .drag-and-drop-icon:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 8px;
  height: 12px;
  cursor: move;
  background-image: url(/assets/images/icons/drag-and-drop-double.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
  margin: auto 10px;
}
app-settings-companies .companies-table .drag-and-drop-icon:hover, app-settings-companies .companies-table .drag-and-drop-icon:active {
  text-decoration: none;
}
app-settings-companies .companies-table .btn-hint-group {
  margin-left: 15px;
}
app-settings-companies .companies-table .btn-hint-company {
  margin-right: 5px;
}
app-settings-companies .companies-table .icon-wrapper .tooltip {
  top: 100%;
  right: 0;
}
app-settings-companies .companies-table .icon-wrapper .tooltip:after {
  left: calc(100% - 20px);
}
app-settings-companies .companies-table .icon-wrapper.wrapper {
  transition: none !important;
  border: unset !important;
  background-color: unset !important;
  position: relative;
}
app-settings-companies .companies-table .icon-wrapper.wrapper:hover, app-settings-companies .companies-table .icon-wrapper.wrapper.disabled {
  border: unset !important;
  background-color: unset !important;
  text-decoration: unset;
}
app-settings-companies .companies-table .icon-arrows-plus {
  padding: 5px 5px 3px 5px;
  color: var(--white-color);
  background: var(--green-color1);
  border-radius: 50%;
  transition: background linear 0.2s;
  font-size: 18px;
}
app-settings-companies .companies-table .icon-add-parent {
  font-size: 18px;
  align-items: center;
  display: flex;
  text-align: center;
}
app-settings-companies .companies-table .icon-add-parent:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 30px;
  height: 30px;
  cursor: pointer;
  background-image: url(/assets/images/icons/add-folder.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
  margin: auto;
}
app-settings-companies .companies-table .icon-add-parent:hover, app-settings-companies .companies-table .icon-add-parent:active {
  text-decoration: none;
}
app-settings-companies .companies-table .group-level1 .long {
  width: 430px !important;
}
app-settings-companies .companies-table .company-level1 {
  margin-left: 20px;
}
app-settings-companies .companies-table .company-level1 .long {
  width: 410px !important;
}
app-settings-companies .companies-table .group-level2 {
  margin-left: 30px;
}
app-settings-companies .companies-table .group-level2 .long {
  width: calc(460px - 30px*2) !important;
}
app-settings-companies .companies-table .company-level2 .long {
  width: calc(440px - 30px*2) !important;
}
app-settings-companies .companies-table .group-level3 {
  margin-left: 30px;
}
app-settings-companies .companies-table .group-level3 .long {
  width: calc(460px - 30px*3) !important;
}
app-settings-companies .companies-table .company-level3 .long {
  width: calc(440px - 30px*3) !important;
}
app-settings-companies .companies-table .group-level4 {
  margin-left: 30px;
}
app-settings-companies .companies-table .group-level4 .long {
  width: calc(460px - 30px*4) !important;
}
app-settings-companies .companies-table .company-level4 .long {
  width: calc(440px - 30px*4) !important;
}
app-settings-companies .companies-table .group-level5 {
  margin-left: 30px;
}
app-settings-companies .companies-table .group-level5 .long {
  width: calc(460px - 30px*5) !important;
}
app-settings-companies .companies-table .company-level5 .long {
  width: calc(440px - 30px*5) !important;
}
app-settings-companies .companies-table .company-level2, app-settings-companies .companies-table .company-level3, app-settings-companies .companies-table .company-level4, app-settings-companies .companies-table .company-level5 {
  margin-left: 50px;
}
app-settings-companies .companies-table .collapsed {
  display: none;
}
app-settings-companies .companies-table .company-level1, app-settings-companies .companies-table .company-level2, app-settings-companies .companies-table .company-level3, app-settings-companies .companies-table .company-level4, app-settings-companies .companies-table .company-level5 {
  background: var(--ultra-light-blue1);
}
app-settings-companies .companies-table .company {
  border-bottom: var(--default-border);
}
app-settings-companies .companies-table app-company-row-companies .company.level0 .group-title .drag-and-drop-icon {
  display: none;
}
app-settings-companies .companies-table .company {
  display: flex;
  padding: 10px 0;
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
 supported by Chrome, Edge, Opera and Firefox */
}
app-settings-companies .companies-table .company.level0 .group-title .drag-and-drop-icon, app-settings-companies .companies-table .company.level0 .group-title .chevron {
  display: none !important;
}
app-settings-companies .companies-table .company .long {
  display: flex;
  margin: 0 15px;
  width: 430px;
  align-items: center;
}
app-settings-companies .companies-table .company .long .group-title {
  display: contents;
  cursor: pointer;
  margin-left: 25px;
  float: left;
  width: calc(100% - 450px);
}
app-settings-companies .companies-table .company .long .group-title ui-button {
  margin-left: 10px;
}
app-settings-companies .companies-table .company .long .group-title span {
  margin: auto;
}
app-settings-companies .companies-table .company .long .group-title .btn-add {
  margin-left: 10px;
  height: 25px;
}
app-settings-companies .companies-table .company .long .group-title .chevron {
  font-size: 12px;
  font-weight: bold;
  margin-right: 8px;
  display: inline-block;
  transition: linear 0.2s;
  transform: rotate(0);
}
app-settings-companies .companies-table .company .long .group-title.collapsed .chevron {
  transform: rotate(-90deg);
}
app-settings-companies .companies-table .company .long .group-title .now-running {
  margin-left: 15px;
  width: 65px;
}
app-settings-companies .companies-table .company .long .group-title .link-default {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-settings-companies .companies-table .company .long .group-title .name-row {
  max-width: 300px;
}
app-settings-companies .companies-table .company .long .notification-feature {
  height: 20px !important;
  line-height: 22px;
}
app-settings-companies .companies-table .company .middle, app-settings-companies .companies-table .company .short {
  display: flex;
  margin: 0 auto 0 15px;
  color: var(--black-color0);
}
app-settings-companies .companies-table .company .middle div, app-settings-companies .companies-table .company .short div {
  margin: auto;
}
app-settings-companies .companies-table .company .middle {
  width: 10%;
}
app-settings-companies .companies-table .company .short {
  width: 7%;
}
app-settings-companies .companies-table .company .icons {
  display: flex;
  width: 10%;
  margin: 0 auto;
  min-width: 105px;
}
app-settings-companies .companies-table .company .icons .actions {
  min-width: 105px;
  display: flex;
  align-items: center;
}
app-settings-companies .companies-table .company .icons .actions ui-button {
  margin-left: 5px;
}
app-settings-companies .companies-table .company .logo {
  width: 34px;
  height: 34px;
  margin-right: 17px;
  border-radius: 50%;
  border: 1px solid var(--blue-color20);
  box-sizing: border-box;
}
app-settings-companies .companies-table .company .now-running, app-settings-companies .companies-table .company .archived {
  margin-left: 15px;
  cursor: default;
}
app-settings-companies .companies-table .company .archived {
  background: var(--gray-color3);
}
app-settings-companies .companies-table .name {
  display: flex;
  white-space: nowrap;
  text-overflow: ellipsis;
}
app-settings-companies .companies-table .name div:not(.ui-tooltip) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-settings-companies .companies-table .name .name-row {
  display: flex;
  margin-bottom: 5px;
  max-width: 350px;
}
app-settings-companies .companies-table .name .name-row .link-default {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-settings-companies .companies-table .name .text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-settings-companies .companies-table .edit-wrapper {
  position: relative;
}
app-settings-companies .companies-table .edit-wrapper .edit-area {
  display: flex;
  padding: 10px 15px;
  border-top: var(--default-border);
  color: var(--gray-color3);
}
app-settings-companies .global-page-loader {
  display: flex;
  margin: 30px 0 !important;
  justify-content: center;
}
app-settings-companies .global-page-loader .loader {
  height: 100px;
}
app-settings-companies .company-archived {
  background-color: var(--green-color3);
  color: var(--green-color2);
  padding: 7px 20px;
}
app-settings-companies .error {
  background-color: var(--orange-color2);
  color: var(--orange-color1);
  padding: 7px 20px;
}
app-settings-companies .modal .message b {
  color: var(--black-color0);
}
app-settings-companies .counts {
  font-size: 13px;
  font-weight: 500;
}
app-settings-companies .company .name .img:hover, app-settings-companies .company .name .logo:hover {
  cursor: pointer;
}
app-settings-companies .company.archived div.middle, app-settings-companies .company.archived div.long, app-settings-companies .company.archived div.short, app-settings-companies .disabled div.middle, app-settings-companies .disabled div.long, app-settings-companies .disabled div.short {
  opacity: 0.5;
}
app-settings-companies .company.archived div.middle.icons, app-settings-companies .company.archived div.long.icons, app-settings-companies .company.archived div.short.icons, app-settings-companies .disabled div.middle.icons, app-settings-companies .disabled div.long.icons, app-settings-companies .disabled div.short.icons {
  opacity: 1;
}
app-settings-companies .content-container {
  display: flex;
  margin-top: 15px;
}
app-settings-companies .uploader {
  padding-left: 20px;
  width: 210px;
}
app-settings-companies .fields-wrapper {
  flex-grow: 1;
}
app-settings-companies .fields-wrapper ui-text-box, app-settings-companies .fields-wrapper ui-dropdown {
  display: block;
}
app-settings-companies .setup-wrapper {
  padding: 0 7px 0 17px;
  display: flex;
}
app-settings-companies .setup-wrapper .item {
  display: inline-block;
  vertical-align: top;
  width: calc(40% - 28px);
  margin: 0 13px 17px;
}
app-settings-companies .setup-wrapper .item.long {
  width: calc(100% - 28px);
}
app-settings-companies .setup-wrapper .item ui-dropdown {
  background: var(--white-color);
}
app-settings-companies .setup-wrapper .item ui-dropdown .drp-menu {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  app-settings-companies .setup-wrapper .item ui-dropdown .drp-menu { /* For Firefox */
    scrollbar-width: thin;
  }
}
app-settings-companies .setup-wrapper .item ui-dropdown .drp-menu::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
app-settings-companies .setup-wrapper .item ui-dropdown .drp-menu::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
app-settings-companies .setup-wrapper .item ui-dropdown .drp-menu::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
app-settings-companies .setup-wrapper .line-in-setup {
  flex: 1;
}
app-settings-companies .setup-wrapper .hide-in-setup {
  width: 40%;
}
app-settings-companies .setup-wrapper .currency {
  width: 73% !important;
}
app-settings-companies .setup-wrapper .fiscal-ending .drp-single {
  height: 200px;
}
app-settings-companies .buttons-wrapper {
  padding-top: 10px;
}
app-settings-companies .buttons-wrapper .item {
  display: flex;
}
app-settings-companies .buttons-wrapper .btn-save button span {
  min-width: 100px;
}
app-settings-companies .buttons-wrapper .btn-cancel {
  margin-right: 10px;
  min-width: 120px;
}
app-settings-companies .form-label {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 3px;
}
app-settings-companies .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
app-settings-companies .error-summary {
  background: var(--orange-color2);
  padding: 5px;
}
app-settings-companies .error-message {
  color: var(--orange-color1);
}
app-settings-companies .wrapper-tooltip {
  position: relative;
}
app-settings-companies .wrapper-tooltip .tooltip {
  top: 100%;
  right: 0;
}
app-settings-companies .wrapper-tooltip .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 20px);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.main-container {
  padding: 0 25px;
}
.main-container .content-panel {
  flex-grow: 1;
  margin: 15px 0;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
  background: var(--white-color);
}

.content-wrapper {
  padding: 20px 30px;
}

.card-container .card-header .card-title {
  margin-top: 13px;
}

.card-title-note {
  margin-top: 5px !important;
}
.card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.popover-datepicker {
  position: absolute;
  top: 10px;
  left: 0;
  width: 270px;
  background-color: var(--white-color);
  z-index: 5;
  padding: 0 20px 20px;
  border: var(--default-border);
}
.popover-datepicker .datepicker__wrapper {
  display: flex;
  justify-content: space-between;
}
.popover-datepicker .mat-calendar-body-label {
  display: none !important;
}

app-settings-bank-accounts {
  display: block;
  /*Common*********************/
  /*Setup-steps*****************************/
  /*Choose bank***************/
  /*Connect to bank***************/
  /*Choose accounts***************/
  /*Sync transactions***************/
  /*Bottom buttons*******************************************/
}
app-settings-bank-accounts ui-plug > div {
  margin: 25px 0 !important;
}
app-settings-bank-accounts app-datepicker {
  margin-left: 0 !important;
}
app-settings-bank-accounts app-datepicker .input-text {
  margin-left: 0 !important;
}
app-settings-bank-accounts app-datepicker .link {
  font-weight: 500;
  color: var(--blue-color3);
  white-space: nowrap;
  cursor: pointer;
}
app-settings-bank-accounts ui-plug.bank-accounts-limit .plugInfo {
  margin-bottom: 0px !important;
}
app-settings-bank-accounts .main-container {
  display: flex;
}
app-settings-bank-accounts .main-container .content-panel {
  flex-grow: 1;
  margin: 15px 15px 15px 0;
}
app-settings-bank-accounts .card-container {
  max-width: calc(100% - 250px);
}
app-settings-bank-accounts .card-container .card-header .card-title {
  margin-top: 13px;
}
app-settings-bank-accounts .card-title-note {
  margin-top: 5px !important;
}
app-settings-bank-accounts .card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
app-settings-bank-accounts .card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  /* Gray 3 */
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}
app-settings-bank-accounts .buttons-wrapper {
  border-radius: 0 0 6px 6px;
  overflow: hidden;
  display: flex;
  align-items: center;
  margin-top: 20px;
}
app-settings-bank-accounts .content-wrapper {
  padding: 20px 20px;
}
app-settings-bank-accounts .sub-block-title, app-settings-bank-accounts .accounts-sub-tile {
  margin-bottom: 5px;
}
app-settings-bank-accounts .accounts-sub-tile {
  padding: 10px 20px;
}
app-settings-bank-accounts .sub-block-text {
  font-size: 12px;
}
app-settings-bank-accounts .loader, app-settings-bank-accounts .step-loader {
  color: var(--green-color1);
  height: 80px;
  width: 80px;
  margin: auto;
  position: relative;
}
app-settings-bank-accounts .loader.connect-to-bank, app-settings-bank-accounts .step-loader.connect-to-bank {
  margin: 90px auto;
  width: 80px;
}
app-settings-bank-accounts .step-loader {
  width: 30px;
  height: 20px;
  display: inline-flex;
  top: 5px;
  margin-right: 20px;
}
app-settings-bank-accounts .card {
  padding: 15px;
  background: var(--white-color);
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
}
app-settings-bank-accounts .card .sub-block-title {
  font-size: 12px;
  font-weight: 400;
  color: var(--gray-color1);
}
app-settings-bank-accounts .bank-search {
  text-align: center;
}
app-settings-bank-accounts .bank-search .txt-search {
  margin-bottom: 10px;
}
app-settings-bank-accounts .bank-search input.text-boxes {
  background: var(--gray-color13);
  border-radius: 20px;
  border: none;
  height: 35px;
  color: var(--gray-color5);
  position: relative;
  width: 360px;
  padding-right: 40px;
  padding-left: 30px;
}
app-settings-bank-accounts .bank-search .icon {
  right: 15px;
  top: 9px;
  width: 20px;
  height: 20px;
}
app-settings-bank-accounts .bank-steps {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding: 0 9px;
}
app-settings-bank-accounts .bank-steps .item {
  text-align: center;
  font-size: 13px;
  color: var(--gray-color2);
  position: relative;
  white-space: nowrap;
  width: 234px;
  margin-left: -9px;
  font-weight: 400;
}
app-settings-bank-accounts .bank-steps .item .title {
  margin: 0 auto;
  padding: 5px 20px;
  display: inline-block;
}
app-settings-bank-accounts .bank-steps .item.active {
  color: var(--white-color);
}
app-settings-bank-accounts .bank-steps .item.active .title {
  background: var(--green-color1);
  position: relative;
  border-radius: var(--border-radius20);
}
app-settings-bank-accounts .bank-steps .item.active .title:after {
  content: "";
  position: absolute;
  bottom: -16px;
  left: calc(50% - 4px);
  border-width: 8px;
  border-style: solid;
  border-color: transparent transparent #84C612 transparent;
  transform: rotate(180deg);
}
app-settings-bank-accounts .bank-steps .item.active + .splitter {
  color: var(--white-color);
}
app-settings-bank-accounts .bank-steps .item.done {
  color: var(--white-color);
}
app-settings-bank-accounts .bank-steps .item.done:after {
  content: "";
  position: absolute;
  bottom: -20px;
  left: 50%;
  background: url(/assets/images/icons/completed.png) no-repeat 0 0/cover;
  width: 23px;
  height: 23px;
  border-radius: 23px;
}
app-settings-bank-accounts .bank-steps .item.done + .splitter {
  color: var(--green-color1);
}
app-settings-bank-accounts .bank-steps .item .iconsax {
  margin-right: 10px;
}
app-settings-bank-accounts .bank-steps .item .text {
  display: inline-block;
  vertical-align: middle;
  white-space: normal;
  text-align: left;
}
app-settings-bank-accounts .bank-steps .splitter {
  width: 26px;
  height: 8px;
  overflow: hidden;
  font-size: 26px;
  color: var(--gray-color2);
}
app-settings-bank-accounts .offline-link {
  padding: 0 20px 20px 20px;
  display: inline-block;
}
app-settings-bank-accounts .progress-bar {
  height: 5px;
  width: 100%;
  background-color: var(--green-color4);
}
app-settings-bank-accounts .progress-bar .inner {
  height: 100%;
  background-image: linear-gradient(to right, var(--green-color2) 0%, var(--green-color1) 100%);
  border-radius: 0 5px 5px 0;
}
app-settings-bank-accounts .stepper {
  display: flex;
  justify-content: space-between;
  margin: 0 115px 30px;
  height: 4px;
  background: var(--gray-color13);
}
app-settings-bank-accounts .stepper.step2 {
  background: linear-gradient(90deg, var(--green-color1) 0%, var(--green-color1) 33%, var(--gray-color13) 34%, var(--gray-color13) 100%);
}
app-settings-bank-accounts .stepper.step3 {
  background: linear-gradient(90deg, var(--green-color1) 0%, var(--green-color1) 66%, var(--gray-color13) 67%, var(--gray-color13) 100%);
}
app-settings-bank-accounts .stepper.step4 {
  background: var(--green-color1);
}
app-settings-bank-accounts .stepper .step {
  font-size: 13px;
  color: var(--white-color);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -12px;
  background: var(--gray-color13);
}
app-settings-bank-accounts .stepper .step.stepActive {
  background: var(--green-color1);
}
app-settings-bank-accounts .stepper .step:first-child {
  margin-left: -9px;
}
app-settings-bank-accounts .stepper .step:last-child {
  margin-right: -8px;
}
app-settings-bank-accounts .choose-bank .card {
  padding: 0;
}
app-settings-bank-accounts .choose-bank .content-wrapper {
  padding-bottom: 0;
}
app-settings-bank-accounts .choose-bank .date {
  margin-bottom: 0;
}
app-settings-bank-accounts .choose-bank .bank-search .note {
  margin: 5px 0 10px;
}
app-settings-bank-accounts .choose-bank .banks-list {
  overflow-y: scroll;
  max-height: calc(100vh - 350px);
  margin: 5px 0 20px 0;
  justify-content: space-between;
  border-radius: inherit;
  padding: 15px;
}
app-settings-bank-accounts .choose-bank .banks-list {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  app-settings-bank-accounts .choose-bank .banks-list { /* For Firefox */
    scrollbar-width: thin;
  }
}
app-settings-bank-accounts .choose-bank .banks-list::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
app-settings-bank-accounts .choose-bank .banks-list::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
app-settings-bank-accounts .choose-bank .banks-list::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
app-settings-bank-accounts .choose-bank .banks-list .bank-blz {
  padding-left: 15px;
}
app-settings-bank-accounts .choose-bank .banks-list .loader {
  margin: auto;
  width: 80px;
}
app-settings-bank-accounts .choose-bank .banks-list .item {
  cursor: pointer;
  display: flex;
  width: 100%;
  flex-shrink: 0;
  overflow: hidden;
  transition: linear 0.2s;
  border-bottom: var(--default-border);
  align-items: center;
  padding: 15px 20px;
  font-size: 13px;
  font-weight: 500;
  line-height: 15px;
  color: var(--black-color0);
}
app-settings-bank-accounts .choose-bank .banks-list .item img {
  margin: auto;
}
app-settings-bank-accounts .choose-bank .banks-list .item.active {
  background: var(--ultra-light-blue1);
}
app-settings-bank-accounts .choose-bank .banks-list .item:last-child {
  border-bottom: none;
}
app-settings-bank-accounts .connect-to-bank .form-error {
  color: var(--orange-color1);
  background: var(--orange-color2);
  display: inline-block;
  padding: 5px;
  margin-top: 15px;
}
app-settings-bank-accounts .connect-to-bank .form-row .form-label {
  display: block;
  margin-top: 15px;
}
app-settings-bank-accounts .connect-to-bank .form-row .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
app-settings-bank-accounts .connect-to-bank .form-row .form-control {
  width: 320px;
  margin-top: 5px;
}
app-settings-bank-accounts .connect-to-bank .login-without-pin {
  display: block;
  margin-top: 10px;
}
app-settings-bank-accounts .choose-accounts .card {
  padding: 0;
}
app-settings-bank-accounts .choose-accounts .table-wrapper {
  min-height: 100px;
  width: 100%;
  display: flex;
  flex-direction: column;
}
app-settings-bank-accounts .choose-accounts .table-wrapper .header-row {
  border-bottom: var(--default-border-header);
  font-weight: 500;
  font-size: 13px;
  color: var(--black-color0);
  height: auto;
}
app-settings-bank-accounts .choose-accounts .table-wrapper td {
  padding: 15px 20px;
}
app-settings-bank-accounts .choose-accounts .table-wrapper td .iban {
  white-space: nowrap;
}
app-settings-bank-accounts .choose-accounts .table-wrapper .default-table td:first-child {
  line-height: 1;
}
app-settings-bank-accounts .choose-accounts .table-wrapper .connection-warning-text {
  text-align: center;
}
app-settings-bank-accounts .choose-accounts .table-wrapper .loader {
  margin: auto;
  width: 80px;
}
app-settings-bank-accounts .sync-transactions {
  height: 200px;
  display: flex;
  flex-direction: column;
}
app-settings-bank-accounts .sync-transactions .synchronizing {
  margin: auto;
  text-align: center;
}
app-settings-bank-accounts .sync-transactions .synchronizing .loader {
  margin: auto;
  width: 80px;
}
app-settings-bank-accounts .sync-transactions .synchronized {
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
app-settings-bank-accounts .sync-transactions .synchronized .icon {
  font-size: 40px;
  margin-right: 10px;
  color: var(--green-color1);
}
app-settings-bank-accounts .sync-transactions .synchronized .btn-map-transactions {
  width: 150px;
  margin-left: 10px;
}
app-settings-bank-accounts .buttons-wrapper > div {
  display: flex;
}
app-settings-bank-accounts .buttons-wrapper > div ui-button:first-child {
  margin-right: 10px;
}
app-settings-bank-accounts .buttons-wrapper .next-note {
  margin-left: 20px;
}
app-settings-bank-accounts .newone {
  border: 1px solid var(--orange-color6);
}
app-settings-bank-accounts .calendar-wrapper .row .item {
  width: 34px !important;
}
app-settings-bank-accounts .date {
  display: flex;
  margin: 15px 0;
  align-items: center;
}
app-settings-bank-accounts .date .title {
  margin-left: 20px;
}
app-settings-bank-accounts .web-form-error {
  background: var(--orange-color2);
  color: var(--orange-color1);
  margin: 50px 162px;
  padding: 10px 30px;
  text-align: center;
}
app-settings-bank-accounts .connections {
  grid-auto-rows: 285px;
  padding: 25px 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 15px;
}
app-settings-bank-accounts .connections__card {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  padding: 10px;
  background: var(--white-color);
  border: 1px solid var(--white-color);
}
app-settings-bank-accounts .connections__card:hover {
  border: 1px solid var(--green-color1);
}
app-settings-bank-accounts .connections__card-img {
  height: auto;
  min-height: 100px;
  width: 100%;
  display: flex;
  align-items: center;
}
app-settings-bank-accounts .connections__card-description {
  font-size: 12px;
  line-height: 1.5;
  color: var(--gray-color1);
  text-align: left;
  height: 70px;
  margin: 10px;
}
app-settings-bank-accounts .connections__card-buttons {
  display: flex;
  margin-top: 10px;
  align-items: center;
}
app-settings-bank-accounts .connections__card .finapi-logo, app-settings-bank-accounts .connections__card .banksapi-logo, app-settings-bank-accounts .connections__card .ebics-logo {
  width: 70%;
  height: 70%;
  margin: auto;
}
app-settings-bank-accounts .connections__card .finapi-logo {
  background: url(/assets/images/banks/finapi-logo.png) no-repeat center center/contain;
}
app-settings-bank-accounts .connections__card .banksapi-logo {
  background: url(/assets/images/banks/banksapi-logo.png) no-repeat center center/contain;
}
app-settings-bank-accounts .connections__card .ebics-logo {
  background: url(/assets/images/banks/ebics_logo.svg) no-repeat center center/contain;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-settings-connected-accounts .main-container {
  display: flex;
}
app-settings-connected-accounts .main-container .content-panel {
  flex-grow: 1;
  margin: 15px 15px 15px 0;
}
app-settings-connected-accounts .card-container {
  max-width: calc(100% - 250px);
}
app-settings-connected-accounts .card-container .card-header .card-title {
  margin-top: 13px;
}
app-settings-connected-accounts .card-title-note {
  margin-top: 5px !important;
}
app-settings-connected-accounts .card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
app-settings-connected-accounts .card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  /* Gray 3 */
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}
app-settings-connected-accounts .buttons-wrapper {
  background: var(--gray-color7);
  border-top: var(--default-border);
  padding: 0 20px;
  border-radius: 0 0 6px 6px;
  overflow: hidden;
  display: flex;
  align-items: center;
  height: 55px;
}
app-settings-connected-accounts .connected-accounts-table-wrapper {
  clear: both;
  padding: 25px;
  background: var(--white-color);
  margin-top: 20px;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
app-settings-connected-accounts .card-content {
  padding-bottom: 20px;
}
app-settings-connected-accounts .success-summary {
  padding-left: 15px;
  display: inline;
}
app-settings-connected-accounts .createdBy {
  color: var(--gray-color11);
  display: block;
}
app-settings-connected-accounts tr.first-row td {
  border-bottom: none;
  padding-bottom: 0 !important;
}
app-settings-connected-accounts tr.created-row td {
  padding: 0 0 5px 20px;
}
app-settings-connected-accounts .default-table {
  table-layout: fixed;
  width: 100%;
}
app-settings-connected-accounts .default-table td.bank-name {
  width: 20%;
}
app-settings-connected-accounts .default-table td.account-name {
  width: 20%;
}
app-settings-connected-accounts .default-table td.account-name span {
  word-break: normal !important;
  overflow-wrap: break-word !important;
  word-wrap: break-word !important;
}
app-settings-connected-accounts .default-table td.alias {
  width: 10%;
}
app-settings-connected-accounts .default-table td.status {
  width: 10%;
}
app-settings-connected-accounts .default-table td.account-type {
  width: 9%;
}
app-settings-connected-accounts .default-table td.account-type div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
app-settings-connected-accounts .default-table td.allocate {
  width: 10%;
}
app-settings-connected-accounts .default-table td.currency {
  width: 6%;
}
app-settings-connected-accounts .default-table td.balance {
  width: 10%;
}
app-settings-connected-accounts .default-table td.td-actions {
  width: 6% !important;
  min-width: 80px !important;
}
app-settings-connected-accounts .default-table td.balance {
  min-width: 140px;
  max-width: 180px;
}
app-settings-connected-accounts .default-table .nowrap {
  white-space: nowrap;
}
app-settings-connected-accounts .default-table .col-allies {
  min-width: 140px;
  max-width: 200px;
}
app-settings-connected-accounts .default-table .col-allies .justify {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
app-settings-connected-accounts .default-table .col-allies .justify span {
  word-break: break-all;
}
app-settings-connected-accounts .default-table .col-allies .justify .icon-wrapper {
  justify-content: flex-end;
  width: 50px;
}
app-settings-connected-accounts .default-table .account-actions {
  text-align: right;
}
app-settings-connected-accounts .default-table .account-actions .wrapper {
  align-items: center;
}
app-settings-connected-accounts .default-table .account-actions .tooltip {
  right: -5px;
  top: 100%;
}
app-settings-connected-accounts .default-table .account-actions .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 20px);
}
app-settings-connected-accounts .default-table .table-header td {
  font-size: 13px;
  padding: 15px 10px;
}
app-settings-connected-accounts .default-table .table-header td:first-child {
  padding-left: 20px;
}
app-settings-connected-accounts .default-table .bank-name {
  font-weight: 500;
}
app-settings-connected-accounts .default-table .bank-name div {
  max-width: 20vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
app-settings-connected-accounts .default-table .bank-name .connection {
  color: #667C93;
  font-weight: normal;
}
app-settings-connected-accounts .default-table .upcase-l, app-settings-connected-accounts .default-table .popover-title .text, .popover-title app-settings-connected-accounts .default-table .text, app-settings-connected-accounts .default-table app-settings-bank-accounts .sub-block-title, app-settings-bank-accounts app-settings-connected-accounts .default-table .sub-block-title, app-settings-connected-accounts .default-table app-settings-bank-accounts .accounts-sub-tile, app-settings-bank-accounts app-settings-connected-accounts .default-table .accounts-sub-tile {
  font-weight: 500;
}
app-settings-connected-accounts .default-table .upcase-l.edit-col, app-settings-connected-accounts .default-table .popover-title .edit-col.text, .popover-title app-settings-connected-accounts .default-table .edit-col.text, app-settings-connected-accounts .default-table app-settings-bank-accounts .edit-col.sub-block-title, app-settings-bank-accounts app-settings-connected-accounts .default-table .edit-col.sub-block-title, app-settings-connected-accounts .default-table app-settings-bank-accounts .edit-col.accounts-sub-tile, app-settings-bank-accounts app-settings-connected-accounts .default-table .edit-col.accounts-sub-tile {
  text-align: right;
}
app-settings-connected-accounts .default-table .bic {
  color: var(--gray-color20);
}
app-settings-connected-accounts .default-table tr:first-child {
  font-weight: 500;
  font-size: 13px;
  color: var(--gray-color5);
  border-bottom: var(--default-border-header);
}
app-settings-connected-accounts .default-table td {
  padding: 10px;
  color: var(--black-color0);
  text-align: left;
  word-wrap: break-word;
}
app-settings-connected-accounts .default-table td:first-child {
  padding-left: 20px;
}
app-settings-connected-accounts .default-table td .company-name {
  color: var(--black-color0);
  font-size: 13px;
  line-height: 15px;
}
app-settings-connected-accounts .default-table .icon-wrapper {
  display: flex;
}
app-settings-connected-accounts .default-table .account-type span {
  padding-left: 2px;
}
app-settings-connected-accounts .default-table .edit-account {
  color: var(--gray-color2);
  font-size: 20px;
  cursor: pointer;
  padding-right: 10px;
}
app-settings-connected-accounts .default-table .edit-account.disabled {
  opacity: 0.2;
}
app-settings-connected-accounts .default-table .basket {
  color: var(--orange-color6);
  font-size: 20px;
  cursor: pointer;
  margin-left: 5px;
}
app-settings-connected-accounts .default-table .basket.disabled {
  opacity: 0.2;
}
app-settings-connected-accounts .default-table .hide1-inf {
  display: none;
}
app-settings-connected-accounts .add-btn {
  margin-right: 20px;
}
app-settings-connected-accounts .list-title {
  color: var(--gray-color12);
  font-family: Rubik;
  font-style: normal;
  font-weight: normal;
  font-size: 13px;
  line-height: 15px;
  text-transform: capitalize;
  display: inline-grid;
  width: 100%;
  height: 60px;
  flex-shrink: 0;
  overflow: hidden;
  transition: linear 0.2s;
  border-bottom: var(--default-border);
  padding: 30px 0 10px;
}
app-settings-connected-accounts .allocate .modal {
  background: var(--white-color) !important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
  border-radius: var(--border-radius);
  top: 50%;
  transform: translateY(-50%);
}
app-settings-connected-accounts .allocate .buttons {
  padding: 0 35px;
}
app-settings-connected-accounts .allocate .title-wrapper {
  background-color: var(--white-color) !important;
}
app-settings-connected-accounts .allocate .title {
  font-family: Rubik !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-size: 15px !important;
  line-height: 18px !important;
  margin: 0 !important;
}
app-settings-connected-accounts .allocation-info {
  padding: 0 35px 30px;
  max-height: 60vh;
  overflow: auto;
  display: flex;
  flex-direction: column;
}
app-settings-connected-accounts .deallocation-content {
  width: 100%;
  padding-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
app-settings-connected-accounts .deallocation-content .deallocation-list {
  overflow-y: auto;
  max-height: 200px;
  display: inline;
  width: auto;
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row {
  display: flex;
  font-style: normal;
  font-weight: normal;
  font-size: 13px;
  line-height: 15px;
  color: var(--black-color0);
  padding: 5px;
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row span {
  padding-left: 20px;
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row input[type=checkbox] {
  left: -9999px;
  position: absolute;
  top: -9999px;
  visibility: hidden;
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row input[type=checkbox] + label {
  cursor: pointer;
  position: relative;
  padding-left: 19px;
  display: inline-block;
  vertical-align: top;
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row input[type=checkbox] + label:before {
  content: " ";
  position: absolute;
  top: -1px;
  left: 0;
  width: 19px;
  height: 19px;
  border: 1px solid var(--gray-color21);
  cursor: pointer;
  background: var(--white-color);
  border-radius: var(--border-radius);
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row input[type=checkbox]:checked + label:after {
  content: "";
  background: url(/assets/images/checkmark.png);
  width: 15px;
  height: 14px;
  position: absolute;
  top: 1px;
  left: 2px;
  display: inline-block;
}
app-settings-connected-accounts .deallocation-content .deallocation-list .item-row .item-name {
  padding-left: 20px;
  padding-top: 2px;
}
app-settings-connected-accounts .banks-list {
  overflow-y: auto;
  max-height: 30vh;
}
app-settings-connected-accounts .banks-list .bank-blz {
  padding-left: 15px;
}
app-settings-connected-accounts .banks-list .loader {
  margin: auto;
  width: 80px;
}
app-settings-connected-accounts .banks-list .item {
  display: inline-grid;
  width: 100%;
  height: 60px;
  flex-shrink: 0;
  overflow: hidden;
  transition: linear 0.2s;
  border-bottom: var(--default-border);
  align-items: center;
}
app-settings-connected-accounts .banks-list .item:hover, app-settings-connected-accounts .banks-list .item.active {
  background: var(--green-allocate);
}
app-settings-connected-accounts .banks-list .item img {
  margin: auto;
}
app-settings-connected-accounts .banks-list .item .item-row {
  display: flex;
  font-style: normal;
  font-weight: 500;
  font-size: 13px;
  color: var(--black-color0);
  align-items: center;
}
app-settings-connected-accounts .banks-list .item .item-row span {
  padding-left: 20px;
}
app-settings-connected-accounts .banks-list .item .item-row input[type=checkbox] {
  left: -9999px;
  position: absolute;
  top: -9999px;
  visibility: hidden;
}
app-settings-connected-accounts .banks-list .item .item-row input[type=checkbox] + label {
  cursor: pointer;
  position: relative;
  padding-left: 19px;
  display: inline-block;
  vertical-align: top;
}
app-settings-connected-accounts .banks-list .item .item-row input[type=checkbox] + label:before {
  content: " ";
  position: absolute;
  top: -1px;
  left: 0;
  width: 19px;
  height: 19px;
  border: 1px solid var(--gray-color21);
  cursor: pointer;
  background: var(--white-color);
  border-radius: var(--border-radius);
}
app-settings-connected-accounts .banks-list .item .item-row input[type=checkbox]:checked + label:after {
  content: "";
  background: url(/assets/images/checkmark.png);
  width: 15px;
  height: 14px;
  position: absolute;
  top: 1px;
  left: 2px;
  display: inline-block;
}
app-settings-connected-accounts .banks-list .item .item-row .item-name {
  padding-left: 10px;
}
app-settings-connected-accounts .banks-list .item .item-row .item-allocated {
  margin-left: auto;
  display: flex;
  padding-right: 20px;
}
app-settings-connected-accounts .banks-list .item .item-row .item-allocated .icon {
  padding: 6px 5px 0 5px;
  color: var(--white-color);
  background: var(--green-color1);
  border-radius: 50%;
  transition: background linear 0.2s;
  height: 23px;
}
app-settings-connected-accounts .banks-list .item .item-row .item-allocated .item-allocated-text {
  padding-left: 10px;
  font-family: Rubik;
  font-style: normal;
  font-weight: 500;
  font-size: 11px;
  line-height: 13px;
  color: var(--green-color1);
  align-self: center;
}
app-settings-connected-accounts .setting-container {
  position: relative;
}
app-settings-connected-accounts .setting-container .btn-edit-plan {
  border: 0;
  background: transparent;
  padding: 0;
  font-size: 20px;
}
app-settings-connected-accounts .confirm-delete {
  position: relative;
  display: block;
}
app-settings-connected-accounts .add-checking {
  text-align: right !important;
  padding: 10px 5px !important;
}
app-settings-connected-accounts .add-checking .wrapper {
  justify-content: space-between;
}
app-settings-connected-accounts .add-checking .wrapper .basket {
  padding-right: 5px;
}
app-settings-connected-accounts .subtitle-gray {
  font-weight: normal;
}
app-settings-connected-accounts .btn-wrapper {
  display: flex;
  justify-content: flex-start;
}
app-settings-connected-accounts .btn-wrapper .loader {
  color: var(--white-color);
  height: 18px;
  width: 18px;
  margin-right: 0;
}
app-settings-connected-accounts .btn-wrapper .loader .image-load {
  margin: -9px 0 0 -9px;
  width: 18px;
}
app-settings-connected-accounts .btn-wrapper .btn-map-account {
  margin: 2px 20px 2px 2px;
}
app-settings-connected-accounts .btn-wrapper .btn-map-account button {
  height: 32px;
}
app-settings-connected-accounts .btn-wrapper .bank_issues {
  display: flex;
  align-items: center;
  color: var(--gray-color1);
}
app-settings-connected-accounts .wrapper {
  display: flex;
}
app-settings-connected-accounts .modal {
  background-color: var(--white-color);
  z-index: 2;
  width: 500px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
app-settings-connected-accounts .modal .title__delete {
  font-weight: 500;
}
app-settings-connected-accounts .modal .title .title__cancel {
  cursor: pointer;
  font-size: 13px;
  color: var(--gray-color22);
  float: right;
  padding-right: 10px;
}
app-settings-connected-accounts .modal .warning .warning__warning-message {
  padding-left: 8px;
  padding-right: 8px;
  text-align: center;
  width: 100%;
  color: var(--gray-color20);
  font-size: 12px;
  padding-top: 28px;
  font-weight: 500;
  font-family: "Rubik", sans-serif;
}
app-settings-connected-accounts .modal .warning .warning__delete-message {
  font-weight: 500;
  text-align: center;
  width: 100%;
  color: var(--orange-color1);
  font-size: 12px;
  font-family: "Rubik", sans-serif;
  padding-top: 15px;
}
app-settings-connected-accounts .modal .buttons {
  padding-top: 20px;
  padding-bottom: 27px;
  text-align: center;
}
app-settings-connected-accounts .modal .buttons .buttons__cancel {
  transition: all linear 0.2s;
  width: 100px;
  background-color: var(--gray-color6);
  border: 1px solid var(--gray-color16);
  border-radius: 4px;
  color: var(--gray-color23);
  font-size: 11px;
  cursor: pointer;
  font-weight: 500;
  padding-top: 9px;
  padding-bottom: 9px;
}
app-settings-connected-accounts .modal .buttons .buttons__cancel:hover {
  background-color: var(--btn-gray-hover-bg);
  border-color: var(--btn-gray-border-hover-color);
}
app-settings-connected-accounts .modal .buttons .buttons__delete {
  transition: all linear 0.2s;
  width: 100px;
  background-color: var(--green-color1);
  border: 1px solid var(--green-color8);
  border-radius: 4px;
  color: var(--white-color);
  font-size: 11px;
  cursor: pointer;
  font-weight: 500;
  padding-top: 9px;
  padding-bottom: 9px;
}
app-settings-connected-accounts .modal .buttons .buttons__delete:hover {
  background-color: var(--btn-green-hover-bg);
  border-color: var(--btn-green-border-hover-color);
}
app-settings-connected-accounts .transaction-status {
  text-transform: capitalize;
  display: flex;
  align-items: center;
}
app-settings-connected-accounts .transaction-status span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 10px;
}
app-settings-connected-accounts .transactions-failed {
  color: var(--orange-color1);
}
app-settings-connected-accounts .transactions-failed span {
  background: var(--orange-color1);
}
app-settings-connected-accounts .transactions-ok {
  color: var(--green-color2);
}
app-settings-connected-accounts .transactions-ok span {
  background: var(--green-color2);
}
app-settings-connected-accounts .transactions-disconnected {
  color: var(--orange-color1);
}
app-settings-connected-accounts .transactions-disconnected span {
  background: var(--orange-color1);
}
app-settings-connected-accounts .transactions-offline {
  color: var(--blue-color6);
}
app-settings-connected-accounts .transactions-offline span {
  background: var(--blue-color6);
}
app-settings-connected-accounts .table-buttons-wrapper {
  text-align: right;
}
app-settings-connected-accounts .connected-account-button {
  display: flex;
  justify-content: space-between;
}
app-settings-connected-accounts .connected-account-button .error {
  color: var(--orange-color1);
  background: var(--orange-color2);
  margin-left: 15px;
  display: inline-block;
}
app-settings-connected-accounts .error-message {
  color: var(--orange-color1);
  background: var(--orange-color2);
  padding: 5px 20px;
}
app-settings-connected-accounts .page-loader {
  height: 200px;
  width: 100%;
}
app-settings-connected-accounts .no-company {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
}
app-settings-connected-accounts .empty-text {
  text-transform: lowercase;
  font-weight: 400;
}
app-settings-connected-accounts .blue-text, app-settings-connected-accounts .text-tag, app-settings-connected-accounts planning-manage-budget .notifications .notification-item.info-message .icon, planning-manage-budget .notifications .notification-item.info-message app-settings-connected-accounts .icon {
  color: var(--link-color);
  cursor: pointer;
}
app-settings-connected-accounts .overdraft-input {
  min-width: 80px;
}
app-settings-connected-accounts .account-info {
  display: flex;
  justify-content: space-between;
  width: 100%;
  border-top: none;
  border-bottom: var(--default-border);
}
app-settings-connected-accounts .account-info .nowrap {
  white-space: nowrap;
}
app-settings-connected-accounts .account-info-item {
  display: block;
  margin: 10px 0;
}
app-settings-connected-accounts .account-info-item div {
  display: flex;
  justify-content: flex-end;
}
app-settings-connected-accounts .account-info-item div label {
  padding-right: 5px;
}
app-settings-connected-accounts .banks-list {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  app-settings-connected-accounts .banks-list { /* For Firefox */
    scrollbar-width: thin;
  }
}
app-settings-connected-accounts .banks-list::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
app-settings-connected-accounts .banks-list::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
app-settings-connected-accounts .banks-list::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
app-settings-connected-accounts .row {
  width: 100%;
  display: flex;
}
app-settings-connected-accounts .right-aligned {
  margin-left: auto;
}
app-settings-connected-accounts .right-aligned .btn-next {
  width: 110px;
}
app-settings-connected-accounts .sidepanel {
  padding: 30px;
}
app-settings-connected-accounts .sidepanel .header {
  color: var(--gray-color5);
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 30px;
  line-height: 1;
}
app-settings-connected-accounts .sidepanel .limit {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
app-settings-connected-accounts .sidepanel .limit:not(:last-child) {
  margin-bottom: 10px;
}
app-settings-connected-accounts .sidepanel .limit .form-field {
  width: calc(50% - 35px);
}
app-settings-connected-accounts .sidepanel .limit .form-field .label {
  color: var(--gray-color1);
  font-size: 13px;
  margin-bottom: 5px;
}
app-settings-connected-accounts .sidepanel .limit .form-field ui-text-box {
  width: 100%;
}
app-settings-connected-accounts .sidepanel .limit .form-field .ng-invalid input {
  border: 1px solid var(--orange-color6);
}
app-settings-connected-accounts .sidepanel .limit .delete {
  font-size: 20px;
  width: 20px;
  color: var(--red-color);
  cursor: pointer;
  margin-bottom: 5px;
  align-self: end;
  line-height: 1;
}
app-settings-connected-accounts .sidepanel .limit .picker {
  position: relative;
}
app-settings-connected-accounts .sidepanel .add-limit {
  cursor: pointer;
  margin-top: 5px;
  color: var(--blue-color6);
  font-size: 13px;
  font-weight: 500;
}
app-settings-connected-accounts .sidepanel .buttons {
  margin-top: 65px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 16px;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
}

@media screen and (max-width: 1480px) {
  .btn-wrapper {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 1280px) {
  .hide2-inf {
    display: none;
  }
  .hide1-inf {
    display: inline !important;
  }
  .upcase-l.edit-col, .popover-title .edit-col.text, app-settings-bank-accounts .edit-col.sub-block-title, app-settings-bank-accounts .edit-col.accounts-sub-tile {
    width: 30%;
  }
}
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-account-receivables-overview .header-component {
  display: flex;
  padding: 20px 25px 0;
}
app-account-receivables-overview .header-total {
  display: flex;
  flex: 1 1 80%;
  width: 80%;
}
app-account-receivables-overview .header-total .total-item {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  width: 33.3333333333%;
  display: flex;
  min-height: 82px;
}
app-account-receivables-overview .header-total .total-item:nth-child(2) {
  margin: 0 15px;
}
app-account-receivables-overview .header-total .total-item.receivables {
  border-left: 5px solid var(--green-color1);
}
app-account-receivables-overview .header-total .total-item.receivables .iconsax {
  --Iconsax-Color: var(--green-color1);
}
app-account-receivables-overview .header-total .total-item.payables {
  border-left: 5px solid var(--orange-color1);
}
app-account-receivables-overview .header-total .total-item.payables .iconsax {
  --Iconsax-Color: var(--orange-color1);
}
app-account-receivables-overview .header-total .total-item.overall {
  border-left: 5px solid var(--gray-color15);
}
app-account-receivables-overview .header-total .total-item.overall .iconsax {
  --Iconsax-Color: var(--gray-color15);
}
app-account-receivables-overview .header-total .total-item .icon {
  padding: 0 30px;
  display: flex;
  align-items: center;
}
app-account-receivables-overview .header-total .total-item-content {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  padding-right: 25px;
  min-height: 60px;
}
app-account-receivables-overview .header-total .total-item-content .total-item-content-text {
  line-height: 24px;
}
app-account-receivables-overview .header-total .total-item-content .total-item-content-text .content-title {
  font-size: 13px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}
app-account-receivables-overview .header-total .total-item-content .total-item-content-text .content-amount span {
  font-size: 24px;
  color: var(--link-color-active);
}
app-account-receivables-overview .header-total .total-item-content .total-item-content-text .content-amount span.currency {
  font-size: 14px;
}
app-account-receivables-overview .header-total .total-item-content .total-item-content-text:last-child {
  text-align: right;
}
app-account-receivables-overview .header-total .small-font {
  font-size: 12px !important;
}
app-account-receivables-overview .header-picture {
  flex: 1 1 20%;
  width: 20%;
  justify-content: flex-end;
  position: relative;
  display: flex;
}
app-account-receivables-overview .header-picture .image {
  position: absolute;
  top: -5px;
  height: 105px;
  right: 15px;
}
app-account-receivables-overview .filter {
  display: flex;
  align-items: center;
  padding: 20px 25px 0;
}
app-account-receivables-overview .filter .reset {
  margin-left: 10px;
}
app-account-receivables-overview .filter .reset a {
  display: flex;
  align-items: center;
}
app-account-receivables-overview .filter .search-text {
  margin-left: 15px;
}
app-account-receivables-overview .filter .picker input::placeholder {
  font-style: italic;
  color: var(--default-input-placeholder-color);
  opacity: 1;
}
app-account-receivables-overview app-widget {
  margin: 20px 25px;
}
app-account-receivables-overview app-widget .toggle {
  display: flex;
  align-items: center;
  padding-left: 15px;
  margin-top: 10px;
  font-weight: 500;
  color: var(--gray-color5);
}
app-account-receivables-overview app-widget .toggle .label {
  margin-right: 10px;
}
app-account-receivables-overview app-widget .details {
  display: flex;
  margin-top: 20px;
}
app-account-receivables-overview app-widget .details .title {
  padding: 0;
  font-weight: 500;
  display: flex;
  align-items: center;
}
app-account-receivables-overview app-widget .details .title ui-button {
  margin-left: auto;
}
app-account-receivables-overview app-widget .details .invoices {
  margin-bottom: 20px;
}
app-account-receivables-overview app-widget .details .incoming {
  flex: 1 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 30px 0 20px;
}
app-account-receivables-overview app-widget .details .incoming .invoice .amount {
  color: var(--orange-color3);
}
app-account-receivables-overview app-widget .details .outgoing {
  flex: 1 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 20px 0 30px;
  border-right: var(--default-border);
}
app-account-receivables-overview app-widget .details .outgoing .invoice .amount {
  color: var(--gray-color5);
}
app-account-receivables-overview app-widget .details .invoice {
  display: flex;
  padding: 20px 0;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: var(--default-border);
}
app-account-receivables-overview app-widget .details .invoice:last-child {
  border: none;
}
app-account-receivables-overview app-widget .details .invoice .info {
  display: block;
}
app-account-receivables-overview app-widget .details .invoice .info .date {
  display: flex;
}
app-account-receivables-overview app-widget .details .invoice .info .gray1-text {
  word-break: normal;
  overflow-wrap: anywhere;
}
app-account-receivables-overview app-widget .details .invoice .info .name {
  color: var(--gray-color5);
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  text-transform: capitalize;
  word-break: normal;
  overflow-wrap: anywhere;
}
app-account-receivables-overview app-widget .details .invoice .info .link {
  color: var(--blue-color3);
  cursor: pointer;
}
app-account-receivables-overview app-widget .details .invoice .info .link:hover {
  color: var(--blue-color21);
}
app-account-receivables-overview app-widget .details .invoice .info app-datepicker {
  background: none;
  border: none;
}
app-account-receivables-overview app-widget .details .invoice .info-2 {
  display: flex;
  align-items: flex-start;
}
app-account-receivables-overview app-widget .details .invoice .info-2 .dropdown-wrapper {
  width: 135px;
}
app-account-receivables-overview app-widget .details .invoice .amount {
  margin-right: 15px;
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
}
app-account-receivables-overview app-widget .details .no-invoices {
  text-align: center;
  padding: 20px 20px 20px;
  font-weight: 500;
  font-size: 13px;
  color: var(--green-color5);
}
app-account-receivables-overview app-widget .details .loader {
  margin: 20px auto;
}
app-account-receivables-overview .negative {
  color: var(--orange-color1);
}
app-account-receivables-overview .positive {
  color: var(--green-color1);
}
app-account-receivables-overview .monster-content {
  position: absolute;
  top: 0;
  right: 130px;
  background: var(--white-color);
  border: 2px solid var(--white-color2);
  border-radius: 16px;
  padding: 10px 15px;
  width: 170px;
}
app-account-receivables-overview .monster-content:after {
  content: "";
  background: url(/assets/images/progress-message-aside.png);
  position: absolute;
  top: 53px;
  right: 10px;
  width: 21px;
  height: 20px;
}
app-account-receivables-overview .monster-content .text {
  color: var(--link-color-active);
  font-weight: 500;
}
app-account-receivables-overview .highcharts-container {
  overflow: visible !important;
}
@media screen and (max-width: 1600px) {
  app-account-receivables-overview .total-item {
    min-width: 290px;
  }
  app-account-receivables-overview .total-item-content-text {
    flex-direction: column !important;
  }
  app-account-receivables-overview .total-item-content-text:first-child {
    width: 70% !important;
  }
  app-account-receivables-overview .total-item-content-text:last-child {
    width: 30% !important;
  }
  app-account-receivables-overview .total-item-content-text:last-child .content-title {
    text-align: right;
  }
  app-account-receivables-overview .total-item-content-text:last-child .content-amount {
    text-align: right !important;
  }
  app-account-receivables-overview .content-title {
    text-align: left;
    width: 100%;
    font-size: 12px !important;
    display: block !important;
    line-height: 24px;
  }
  app-account-receivables-overview .content-amount {
    text-align: left;
    width: 100%;
  }
  app-account-receivables-overview .content-amount span {
    font-size: 16px;
  }
  app-account-receivables-overview .content-amount span.currency {
    font-size: 10px;
  }
  app-account-receivables-overview .header-picture {
    width: 120px !important;
    flex: 1 1 auto !important;
  }
  app-account-receivables-overview .header-picture img {
    width: 80px !important;
    height: auto !important;
  }
  app-account-receivables-overview .header-total {
    width: 90% !important;
    flex: 1 1 90% !important;
  }
  app-account-receivables-overview .total-item-img-split {
    width: 60px !important;
    height: 60px !important;
  }
  app-account-receivables-overview .total-item-img-split:after {
    width: 60px !important;
    height: 60px !important;
    top: 10px !important;
  }
  app-account-receivables-overview .total-item-img-split:before {
    width: 60px !important;
    height: 60px !important;
    top: -10px !important;
  }
}
app-account-receivables-overview .chart-content {
  padding: 0 !important;
}
app-account-receivables-overview .chart-header {
  width: 100%;
  display: flex;
  padding: 20px;
}
app-account-receivables-overview .chart-title {
  position: absolute;
  top: 40px;
  z-index: 1;
  left: 40px;
  text-transform: capitalize;
}
app-account-receivables-overview .chart-title:after {
  content: "";
  position: absolute;
  width: 90px;
  height: 100%;
  left: 0;
  border-bottom: var(--default-border);
}
app-account-receivables-overview ui-pagination {
  margin: auto auto 20px auto;
}
app-account-receivables-overview .banner {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  container-type: inline-size;
  display: flex;
  width: 100%;
  position: relative;
  min-height: 80px;
  min-width: 880px;
}
app-account-receivables-overview .banner__title {
  display: flex;
  background: linear-gradient(270deg, var(--green-color1) 15.75%, var(--green-color2) 100.61%);
  width: 366px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  z-index: 2;
  align-items: center;
}
app-account-receivables-overview .banner__title__subtitle {
  color: var(--white-color);
  font-weight: 500;
  font-size: 16px;
  margin: auto auto auto 44px;
  display: flex;
  flex-direction: column;
}
app-account-receivables-overview .banner__title__img-wrapper {
  height: auto;
  margin-right: -47px;
}
app-account-receivables-overview .banner__title__img-wrapper img {
  height: 80px;
}
app-account-receivables-overview .banner__desc {
  display: flex;
  background-color: var(--white-color);
  width: calc(100% - 366px);
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}
app-account-receivables-overview .banner__desc__text {
  margin: auto auto auto 80px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
}
@supports (container-type: inline-size) {
  @container (max-width: 1050px) {
    app-account-receivables-overview .banner__desc__text {
      flex-direction: column !important;
      align-items: flex-start;
      gap: 16px !important;
    }
  }
}
@supports not (container-type: inline-size) {
  @media screen and (max-width: 1280px) {
    app-account-receivables-overview .banner__desc__text {
      flex-direction: column !important;
      align-items: flex-start;
      gap: 16px !important;
    }
  }
}
app-account-receivables-overview .banner__desc__text-subtitle {
  font-weight: 500;
}
app-account-receivables-overview .banner__desc__text-options {
  min-width: 275px;
  width: 100%;
}
app-account-receivables-overview .banner__desc__text ul {
  list-style: disc;
  margin-left: 13px;
}
app-account-receivables-overview .banner__desc__actions {
  margin: auto 25px auto 20px;
  display: flex;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Common for both new and mapped transactions ======================================*/
.mapping-table {
  padding: 0 25px;
  display: flex;
  flex-direction: column;
}
.mapping-table .actions {
  height: 60px;
  display: flex;
  align-items: center;
}
.mapping-table .actions .select-all {
  margin: 0 17px;
}
.mapping-table .actions .map-selected-to-category {
  margin-right: 7px;
  width: 145px;
  background: var(--gray-color7);
}
.mapping-table .actions .map-all-to-suggested {
  width: 160px;
}

.mat-expansion-panel-body {
  margin: 0px !important;
  background-color: var(--gray-color7);
}

.mat-expansion-indicator {
  display: none !important;
}

.mat-form-field-underline {
  height: 0px !important;
}

.mat-form-field-ripple {
  background-color: var(--gray-color6) !important;
}

.mat-select-value {
  width: 83% !important;
}

.mat-input-element {
  caret-color: var(--black-color0) !important;
}
.mat-input-element.invalid {
  border-color: var(--orange-color1) !important;
}

.tag-wrapper .tag-1 {
  max-width: 100%;
}
.tag-wrapper .tag-2 {
  max-width: 50%;
}
.tag-wrapper .tag-3 {
  max-width: 34%;
}
.tag-wrapper .tag-4 {
  max-width: 30%;
}

.autocomplete {
  width: 100%;
  height: 30px;
}
.autocomplete .mat-form-field-underline {
  display: none;
}
.autocomplete .mat-form-field-wrapper {
  padding: 0 !important;
}
.autocomplete .mat-form-field-flex {
  padding: 0 !important;
  display: flex;
  height: 30px;
}
.autocomplete .mat-form-field-flex .mat-form-field-infix {
  padding: 0 !important;
  display: flex;
  height: 30px;
}
.autocomplete input {
  border-radius: var(--border-radius);
  border: 1px solid var(--gray-color16) !important;
  color: #333 !important;
  padding: 0 10px !important;
  font-family: "Rubik", sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  height: 100%;
  width: 100% !important;
  transition: border-color linear 0.2s;
}

.autocomplete-option {
  height: 32px !important;
  line-height: 15px !important;
  font-family: "Rubik", sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.mat-form-field-appearance-fill .mat-form-field-flex {
  padding: 0 !important;
  background-color: var(--white-color) !important;
  border-radius: var(--border-radius);
  border: 1px solid var(--gray-color16);
  display: flex;
  height: 32px;
}
.mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix {
  height: 30px;
  width: 170px;
  margin: auto;
  border: none;
  padding: 0;
  display: flex;
  align-items: center;
  padding-left: 10px;
}
.mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-start-wrapper, .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-end-wrapper {
  padding-left: 6px;
  overflow: unset;
  max-width: 100%;
}
.mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner {
  color: var(--black-color1);
  font-family: var(--default-font);
}
.mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner.ng-invalid {
  color: var(--orange-color6) !important;
}
.mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner::placeholder {
  font-style: italic;
  color: var(--default-input-placeholder-color);
  opacity: 1;
}
.mat-form-field-appearance-fill .mat-form-field-underline {
  display: none;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transactions-filter {
  background: var(--white-color);
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 25px;
}
transactions-filter .filter-by-type .type {
  margin-right: 35px;
}
transactions-filter .other-filters {
  display: flex;
  align-items: center;
}
transactions-filter .other-filters .filter {
  margin-right: 8px;
  width: 145px;
}
transactions-filter .other-filters .reset {
  margin-left: 10px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
connected-account {
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: space-between;
}
connected-account .bottom {
  white-space: nowrap;
}
connected-account .divider {
  background-color: var(--default-border-color);
  height: 100%;
  width: 1px;
}
connected-account .accounts {
  display: flex;
  align-items: center;
  height: 100%;
  padding-bottom: 15px;
}
connected-account .accounts .account-cards {
  padding: 2px 25px 0;
  max-height: 45px;
  overflow: auto;
  max-width: 370px;
  width: 370px;
  margin-right: 10px;
}
connected-account .accounts .account-cards .item {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
connected-account .accounts .account-cards .name {
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
connected-account .accounts .account-cards .totals {
  font-size: 11px;
  padding-left: 10px;
  font-weight: 500;
  color: var(--black-color0);
  white-space: nowrap;
}
connected-account .accounts .account-cards {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  connected-account .accounts .account-cards { /* For Firefox */
    scrollbar-width: thin;
  }
}
connected-account .accounts .account-cards::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
connected-account .accounts .account-cards::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
connected-account .accounts .account-cards::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
connected-account .accounts .account {
  display: flex;
  flex-direction: column;
  padding: 0 25px;
  white-space: nowrap;
}
connected-account .accounts .account .name {
  color: var(--gray-color1);
}
connected-account .accounts .account .currency {
  color: var(--black-color0);
}
connected-account .accounts .account .total-amount {
  font-size: 24px;
  font-weight: 400;
  white-space: nowrap;
  color: var(--blue-color6);
  position: relative;
  padding-right: 20px;
  cursor: pointer;
}
connected-account .accounts .account .total-amount::after {
  content: "";
  position: absolute;
  top: calc(50% - 3px);
  right: 0;
  width: 10px;
  height: 6px;
  background: url(/assets/images/icons/blue-chevron.svg) center center no-repeat;
}
connected-account .accounts .account .total.expanded .total-amount::after {
  transform: rotate(180deg);
}
connected-account .accounts .view-more {
  width: 100px;
}
connected-account .toggle-accounts-status {
  width: 100%;
  display: flex;
  margin-bottom: 20px;
  position: relative;
}
connected-account .detail-section {
  display: flex;
  width: 100%;
}
connected-account .toggle-accounts-wrapper {
  overflow-x: auto;
  padding: 20px;
  position: relative;
  width: 100%;
  background: var(--gray-color24);
}
connected-account .toggle-accounts-wrapper {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  connected-account .toggle-accounts-wrapper { /* For Firefox */
    scrollbar-width: thin;
  }
}
connected-account .toggle-accounts-wrapper::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
connected-account .toggle-accounts-wrapper::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
connected-account .toggle-accounts-wrapper::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
connected-account .triangle {
  display: block;
  position: absolute;
  left: 25px;
  height: 0;
  bottom: -2px;
  z-index: 2;
}
connected-account .triangle .sharp-triangle {
  width: 0;
  height: 0;
  top: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid var(--gray-color18);
  position: absolute;
}
connected-account .triangle .sharp-triangle:after {
  position: absolute;
  content: "";
  z-index: 0;
  left: -15px;
  top: 2px;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid var(--white-color);
}
connected-account .card-item {
  background: var(--gray-color25);
  border-radius: 20px;
  width: 244.9px;
  color: var(--white-color);
  height: 155px;
  min-width: 244.9px;
  margin: 0 10px;
  overflow: hidden;
  box-shadow: 2px 2px 10px 1px var(--gray-color26);
  position: relative;
}
connected-account .card-item::before {
  content: "";
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 60%;
  height: 100%;
  background: linear-gradient(to top left, var(--green-color12), transparent);
  filter: blur(15px);
  border-top-left-radius: 50%;
}
connected-account .card-item.offline:before {
  background: linear-gradient(to top left, #B1F1FF, transparent);
}
connected-account .card-item.failed:before {
  background: linear-gradient(to top left, var(--orange-color5), transparent);
}
connected-account .card-item .card-wrapper {
  padding: 15px;
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
}
connected-account .card-item .card-status {
  margin-left: auto;
  color: var(--green-color1);
  position: absolute;
  right: 10px;
  bottom: 10px;
}
connected-account .card-item .card-status > div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
connected-account .card-item .card-status.offline {
  color: var(--blue-color6);
}
connected-account .card-item .card-status.failed {
  color: var(--orange-color1);
}
connected-account .card-data {
  display: flex;
  width: 100%;
  z-index: 1;
}
connected-account .card-data .card-currency {
  width: 25%;
}
connected-account .card-data .card-currency .image {
  width: 35px;
  margin-top: 25px;
}
connected-account .card-data .card-amount .card-amount-num {
  display: inline-block;
  margin-left: auto;
  font-size: 24px;
  font-weight: 500;
}
connected-account .card-data .card-amount .limit {
  display: flex;
}
connected-account .card-data .card-amount .limit .disconnected {
  color: var(--orange-color1);
}
connected-account .card-data .card-amount .limit :last-child {
  display: flex;
}
connected-account .card-account-name {
  padding-right: 5px;
  white-space: nowrap;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
}
connected-account .header-toggle-link {
  padding: 0 100px 0 10px;
  position: relative;
}
connected-account .card-text, connected-account .currency-text, connected-account .limit-text, connected-account .large-size {
  font-weight: 500;
  font-size: var(--default-font-size);
}
connected-account .card-id {
  width: 100%;
}
connected-account .action-tab {
  display: flex;
  align-items: center;
  margin: 0 10px;
  flex-direction: column;
  min-width: 200px;
  justify-content: flex-end;
}
connected-account .action-tab .manage-link {
  white-space: nowrap;
  font-size: 13px;
  text-decoration: none;
  background: url(/assets/images/icons_new_design/ico_cog_blue.svg) 0 50% no-repeat;
  padding: 5px 0 5px 30px;
}
connected-account .funds {
  display: flex;
  min-width: 400px;
}
connected-account .funds .account-inner {
  padding: 0 25px;
}
connected-account .funds .account-inner .top {
  color: var(--gray-color1);
}
connected-account .transactions {
  display: flex;
  margin: 0 30px 0 30px;
}
connected-account .transactions .icon {
  font-size: 36px;
  line-height: 1;
  color: var(--blue-color3);
  margin: 0 17px 0 0;
}
connected-account .transactions .new-transactions {
  display: flex;
  flex-direction: column;
}
connected-account .transactions .new-transactions .count {
  font-size: 27px;
  font-weight: 400;
  color: var(--black-color0);
  line-height: 1;
}
connected-account .deleted-account {
  color: var(--orange-color1);
  padding-left: 5px;
}

.bold-default-amount {
  white-space: nowrap;
}

.accoutns .account-cards {
  padding: 0 25px;
  width: 300px;
  background-color: var(--orange-color6);
  display: flex;
  flex-direction: row;
}
.accoutns .account-cards .name {
  flex-grow: 1;
}
.accoutns .account-cards .total {
  flex-grow: 2;
}
.accoutns .account {
  background-color: var(--orange-color6);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transaction-comments-dialog .dialog-inner {
  width: auto !important;
}
transaction-comments-dialog .close {
  z-index: 2;
}
transaction-comments-dialog .inner-content {
  display: flex;
  justify-content: flex-end;
  min-width: 650px;
  position: relative;
}
transaction-comments-dialog .dialog__content {
  min-width: 650px;
  max-width: 650px;
  height: 100vh;
  background: var(--menu-bg-color);
  overflow-y: scroll;
}
transaction-comments-dialog .dialog__content {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  transaction-comments-dialog .dialog__content { /* For Firefox */
    scrollbar-width: thin;
  }
}
transaction-comments-dialog .dialog__content::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
transaction-comments-dialog .dialog__content::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
transaction-comments-dialog .dialog__content::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
transaction-comments-dialog .comments-activities__open {
  position: fixed;
  margin-left: -65px;
  left: 0;
}
transaction-comments-dialog .comments {
  padding: 15px 20px;
}
transaction-comments-dialog .lessPadding {
  padding: 0 20px;
}
transaction-comments-dialog .transaction-section {
  display: flex;
  flex-wrap: wrap;
  margin: 0 20px;
  justify-content: space-between;
}
transaction-comments-dialog .transaction-section .form-line {
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
  width: calc(33.3333333333% - 10px);
}
transaction-comments-dialog .transaction-section .form-line.form-line-full {
  width: 100%;
}
transaction-comments-dialog .transaction-section .button {
  margin-bottom: 20px;
}
transaction-comments-dialog .invoice-details {
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 10px 0;
}
transaction-comments-dialog .invoice-details .buttons {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  align-items: center;
  margin-top: 10px;
  border-top: 1px solid var(--gray-color14);
  padding-top: 10px;
}
transaction-comments-dialog .invoice-details .buttons > * {
  margin-right: 10px;
}
transaction-comments-dialog .invoice-details .buttons .note {
  width: 100%;
  margin-top: 10px;
}
transaction-comments-dialog .invoice-details .buttons ui-dropdown {
  height: 30px;
}
transaction-comments-dialog .invoice-details .buttons ui-dropdown .drp-label {
  height: 30px;
}
transaction-comments-dialog .invoice-details .buttons .checksum {
  width: 100%;
  margin-bottom: 10px;
  text-align: right;
}
transaction-comments-dialog .invoice-details .buttons .checksum span {
  font-weight: bold;
}
transaction-comments-dialog .invoice-details .buttons .checksum.redChecksum, transaction-comments-dialog .invoice-details .buttons .checksum > .redChecksum {
  color: var(--orange-color1);
}
transaction-comments-dialog .invoice-details .buttons .leftsum {
  margin-left: auto;
  display: flex;
  align-items: center;
}
transaction-comments-dialog .invoice-details .buttons .leftsum > * {
  margin-left: 10px;
}
transaction-comments-dialog .invoice-details .form {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
transaction-comments-dialog .invoice-details .form.form-hidden {
  display: none;
}
transaction-comments-dialog .invoice-details .form .form-line {
  margin-bottom: 10px;
  width: 100%;
}
transaction-comments-dialog .invoice-details .form .form-line label {
  display: block;
}
transaction-comments-dialog .invoice-details .form .form-line ui-text-box {
  width: 100%;
}
transaction-comments-dialog .invoice-details .form ui-button button {
  height: 35px;
}
transaction-comments-dialog .invoice-details .section-title_invoice {
  padding: 15px 0 10px;
}
transaction-comments-dialog .invoice-details .parts {
  width: 100%;
}
transaction-comments-dialog .invoice-details .parts .part {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 0;
  border-top: 1px solid var(--gray-color14);
}
transaction-comments-dialog .invoice-details .parts .part .form-label {
  font-size: 14px;
  font-weight: 400;
}
transaction-comments-dialog .invoice-details .parts .part .left-side {
  display: flex;
  width: 60%;
}
transaction-comments-dialog .invoice-details .parts .part .left-side .title {
  font-weight: 500;
  color: var(--black-color0);
  word-break: break-all;
  margin-bottom: 5px;
}
transaction-comments-dialog .invoice-details .parts .part .left-side .part-id {
  width: 50px;
  min-width: 50px;
  margin-right: 10px;
  word-break: break-all;
  overflow: hidden;
}
transaction-comments-dialog .invoice-details .parts .part .right-side {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 40%;
}
transaction-comments-dialog .invoice-details .parts .part .right-side .amount {
  line-height: 17px;
  font-weight: bold;
  margin-left: auto;
  margin-right: 10px;
}
transaction-comments-dialog .invoice-details .name {
  color: var(--black-color0);
  font-weight: 500;
  font-size: 16px;
}
transaction-comments-dialog .invoice-details .amount {
  font-weight: bold;
  color: var(--black-color0);
}
transaction-comments-dialog .invoice-details .date {
  display: flex;
}
transaction-comments-dialog .invoice-details .date div {
  margin-right: 10px;
}
transaction-comments-dialog .invoice-details .subtitle {
  width: 100%;
  font-size: 24px;
  font-weight: 600;
  color: var(--black-color0);
  margin: 20px 0;
}
transaction-comments-dialog .invoice-details .invoice-full-detail {
  width: 100%;
  padding: 0;
  margin-bottom: 20px;
}
transaction-comments-dialog .invoice-details .invoice-full-detail .invoice-section_header {
  margin-bottom: 20px;
}
transaction-comments-dialog .invoice-details .invoice-full-detail .invoice-section_header .amount {
  font-weight: 400;
  font-size: 16px;
  color: var(--gray-color5);
}
transaction-comments-dialog .invoice-details .invoice-full-detail .invoice-section_header .amount span {
  font-size: 24px;
  font-weight: 500;
}
transaction-comments-dialog .invoice-details .invoice-full-detail .invoice-section_body .detail {
  min-height: 40px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  padding: 10px 0;
  color: var(--gray-color1);
}
transaction-comments-dialog .invoice-details .invoice-full-detail .invoice-section_body .detail .detail_name {
  padding-right: 30px;
  width: 150px;
  font-size: 13px;
  color: var(--gray-color5);
  font-weight: 500;
}
transaction-comments-dialog .invoice-details .invoice-full-detail .invoice-section_body .detail:nth-child(2n-1) {
  background: var(--ultra-light-blue1);
}
transaction-comments-dialog .transaction-full-detail {
  margin: 0 20px;
}
transaction-comments-dialog .transaction-full-detail .transaction-section_header {
  margin-bottom: 20px;
}
transaction-comments-dialog .transaction-full-detail .transaction-section_header .amount {
  font-weight: 400;
  font-size: 16px;
  color: var(--gray-color5);
}
transaction-comments-dialog .transaction-full-detail .transaction-section_header .amount span {
  font-size: 24px;
  font-weight: 500;
}
transaction-comments-dialog .transaction-full-detail .transaction-section_body .detail {
  min-height: 40px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  padding: 10px 16px;
  color: var(--gray-color1);
}
transaction-comments-dialog .transaction-full-detail .transaction-section_body .detail .detail_name {
  padding-right: 30px;
  width: 30%;
  font-size: 13px;
  color: var(--gray-color5);
  font-weight: 500;
}
transaction-comments-dialog .transaction-full-detail .transaction-section_body .detail .detail_value {
  width: 70%;
  word-break: break-all;
}
transaction-comments-dialog .transaction-full-detail .transaction-section_body .detail:nth-child(2n-1) {
  background: var(--ultra-light-blue1);
}
transaction-comments-dialog .parent-link {
  padding: 0 20px 20px;
  display: flex;
  align-items: center;
}
transaction-comments-dialog .parent-link .parentName {
  margin-left: 10px;
}
transaction-comments-dialog .parent-link .wrapper-tooltip {
  width: 100%;
}
transaction-comments-dialog .parent-link .wrapper-tooltip .tooltip {
  left: 0;
  top: calc(100% + 5px);
  right: unset !important;
}
transaction-comments-dialog .parent-link .wrapper-tooltip .tooltip:after {
  content: "";
  position: absolute !important;
  top: -10px !important;
  left: 12px !important;
}
transaction-comments-dialog .section-title {
  font-weight: 500;
  font-size: 15px;
  padding: 15px 0 10px;
  color: var(--gray-color5);
}
transaction-comments-dialog .map-section {
  padding: 20px 0;
  margin: 20px;
  border-top: var(--default-border);
  border-bottom: var(--default-border);
}
transaction-comments-dialog .map-section .map-title {
  font-size: 14px;
  margin-bottom: 5px;
}
transaction-comments-dialog .map-section .map-body {
  display: flex;
  align-items: center;
}
transaction-comments-dialog .map-section .map-body .dropdown {
  margin-right: 10px;
  width: 300px;
}
transaction-comments-dialog .button .loader {
  width: 20px;
  height: 20px;
}
transaction-comments-dialog .button .loader img {
  width: 100%;
  margin: 0;
  top: 0;
  left: 0;
}
transaction-comments-dialog .actions-section {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
transaction-comments-dialog .actions-section ui-text-button, transaction-comments-dialog .actions-section .toggle-wrapper {
  margin-right: 10px;
  display: flex;
}
transaction-comments-dialog .actions-section ui-text-button app-checkbox-toggle, transaction-comments-dialog .actions-section .toggle-wrapper app-checkbox-toggle {
  margin: auto;
}
transaction-comments-dialog .actions-section ui-text-button app-checkbox-toggle .label, transaction-comments-dialog .actions-section .toggle-wrapper app-checkbox-toggle .label {
  color: var(--gray-color5);
}
transaction-comments-dialog .actions-section .row {
  display: flex;
  margin: 7.5px 0;
  height: 32px;
  align-items: center;
  position: relative;
}
transaction-comments-dialog .actions-section .row ui-button {
  margin-right: 5px;
}
transaction-comments-dialog .actions-section .row .tooltip {
  top: -35px;
  left: 0;
  right: auto;
}
transaction-comments-dialog .actions-section .row .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 10px;
  top: auto;
  transform: rotate(180deg);
}
transaction-comments-dialog .actions-section .row.full-row {
  width: 100%;
}
transaction-comments-dialog .actions-section label {
  width: 100%;
  color: var(--gray-color5);
  margin-bottom: 5px;
}
transaction-comments-dialog .section {
  padding: 0 20px;
}
transaction-comments-dialog .section .label {
  padding-top: 10px;
  color: var(--black-color1);
}
transaction-comments-dialog .split-header {
  display: flex;
  align-items: center;
}
transaction-comments-dialog .split-header .title {
  margin-right: auto;
}
transaction-comments-dialog .split-header > *:not(:last-child) {
  margin-right: 10px;
}
transaction-comments-dialog .split-section .drp-label {
  height: 32px;
}
transaction-comments-dialog .split-section .check-amount {
  display: flex;
  padding: 20px 20px 10px;
}
transaction-comments-dialog .split-section .check-amount .text {
  line-height: 17px;
  margin-left: auto;
}
transaction-comments-dialog .split-section .check-amount .value {
  font-size: 13px;
  margin-left: 10px;
  font-weight: bold;
}
transaction-comments-dialog .split-section .check-amount .value span.currency {
  font-size: 13px;
  line-height: 13px;
  margin-right: 5px;
  font-weight: bold;
}
transaction-comments-dialog .split-section .negative {
  color: var(--orange-color1);
}
transaction-comments-dialog .split-section .positive {
  display: flex;
  color: var(--green-color1);
}
transaction-comments-dialog .split-section .amount {
  font-size: 13px;
  font-weight: normal;
  margin-left: auto;
  margin-right: 10px;
  color: var(--gray-color5);
}
transaction-comments-dialog .split-section .amount span.currency {
  margin-right: 5px;
  line-height: 13px;
  font-size: 11px;
  color: var(--gray-color5);
}
transaction-comments-dialog .transaction-wrapper {
  background: var(--white-color);
  display: flex;
  width: 100%;
  color: var(--black-color1);
  flex-direction: column;
}
transaction-comments-dialog .transaction-wrapper .row {
  display: flex;
}
transaction-comments-dialog .transaction-wrapper .row .day {
  margin-right: auto;
}
transaction-comments-dialog .transaction-wrapper .row:not(:last-child) {
  padding-bottom: 9px;
}
transaction-comments-dialog .children-table {
  padding-bottom: 20px;
}
transaction-comments-dialog .children-table {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  transaction-comments-dialog .children-table { /* For Firefox */
    scrollbar-width: thin;
  }
}
transaction-comments-dialog .children-table::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
transaction-comments-dialog .children-table::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
transaction-comments-dialog .children-table::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
transaction-comments-dialog .children-table .children-body {
  border-top: var(--default-border);
  border-bottom: var(--default-border);
}
transaction-comments-dialog .children-table .children-body .wrapper {
  padding: 5px 0;
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: space-between;
  background: var(--white-color);
}
transaction-comments-dialog .children-table .children-body .wrapper:not(:last-child) {
  border-bottom: var(--default-border);
}
transaction-comments-dialog .children-table .children-body .info {
  width: 68%;
}
transaction-comments-dialog .children-table .children-body .actions {
  width: unset !important;
}
transaction-comments-dialog .children-table .children-body .trunc {
  -webkit-line-clamp: 1 !important;
}
transaction-comments-dialog .trunc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
transaction-comments-dialog .icon-info {
  align-items: center;
  width: 20px;
  height: auto;
  position: relative;
  display: flex;
  text-align: center;
  margin: 0 auto 0 20px;
}
transaction-comments-dialog .icon-info:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image: url(/assets/images/icons/info.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}
transaction-comments-dialog .icon-info .tooltip {
  top: -40px;
  left: 0;
  right: auto;
  width: auto;
}
transaction-comments-dialog .icon-info .tooltip:after {
  content: "";
  position: absolute;
  top: 100%;
  left: 5px;
  transform: rotate(180deg);
}
transaction-comments-dialog .icon-info .tooltip .icon-info-inside {
  display: inline-block;
  margin: 0 4px;
  text-align: left;
}
transaction-comments-dialog .offset-item-wrapper {
  margin-bottom: 30px;
}
transaction-comments-dialog .icon-info:hover .tooltip, transaction-comments-dialog .row:hover .tooltip {
  display: block;
}
transaction-comments-dialog .go-to-match {
  font-weight: 500;
  margin: 0 15px;
}
transaction-comments-dialog .bank-name {
  display: inline-block;
  width: 90%;
}
transaction-comments-dialog .loader-wrapper {
  display: flex;
  margin-top: 20px;
  justify-content: center;
}
transaction-comments-dialog .slider-item {
  padding: 0 20px;
}
transaction-comments-dialog .create img {
  margin-right: 10px;
}
transaction-comments-dialog .update {
  width: 160px;
}
transaction-comments-dialog .btn-done {
  margin-left: 20px;
}
transaction-comments-dialog .deleting {
  opacity: 0.8;
}
transaction-comments-dialog .deleting .action-delete {
  color: var(--gray-color2) !important;
}
transaction-comments-dialog .autoSplitDropdown {
  margin-right: 10px;
}
transaction-comments-dialog .autoSplitDropdown .drp-label {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transaction-comments-dialog .createTransaction {
  padding: 10px 20px 0;
}
transaction-comments-dialog .createTransaction .title {
  padding-bottom: 15px;
}
transaction-comments-dialog .createTransaction .form-line {
  margin-bottom: 10px;
  width: 100%;
}
transaction-comments-dialog .createTransaction .form-line .form-label {
  display: block;
}
transaction-comments-dialog .createTransaction .form-line .form-control {
  width: 100%;
}
transaction-comments-dialog .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
transaction-comments-dialog.form-line-chips {
  margin-bottom: 0;
}
transaction-comments-dialog.form-line-chips .chip-name {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
}
transaction-comments-dialog.form-line-chips .mat-form-field-infix {
  padding: 0 !important;
  height: auto;
}
transaction-comments-dialog.form-line-chips .mat-form-field-flex {
  padding: 5px !important;
  border-radius: var(--border-radius) !important;
  height: auto;
}
transaction-comments-dialog.form-line-chips .mat-chip.mat-standard-chip {
  background-color: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color1);
  padding-top: 0;
  padding-bottom: 0;
  min-height: 21px;
  max-width: 100%;
  overflow: hidden;
}
transaction-comments-dialog .form .buttons {
  justify-content: flex-end !important;
  margin: 15px 0 0;
  display: flex;
  align-items: center;
}
transaction-comments-dialog .file-upload-error {
  display: inline-block;
  color: var(--orange-color1);
  margin-top: 5px;
  line-height: 22px;
}
transaction-comments-dialog .file-upload-error span a {
  width: 50px;
}
transaction-comments-dialog .transaction-button-wrapper {
  display: flex;
}
transaction-comments-dialog .transaction-button-wrapper .delete {
  margin-right: 0;
}
transaction-comments-dialog .transaction-button-wrapper .create {
  margin-right: 10px;
}
transaction-comments-dialog .transaction-button-wrapper .cancel {
  width: 85px;
  margin-right: 10px;
}
transaction-comments-dialog .transaction-button-wrapper .finish-button {
  margin-left: 10px;
}
transaction-comments-dialog .uploader-wrapper {
  margin: 0;
  position: relative;
}
transaction-comments-dialog .uploader-wrapper input {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  opacity: 0;
  cursor: pointer;
}
transaction-comments-dialog .upload-wrapper {
  display: flex;
}
transaction-comments-dialog .upload-wrapper .tooltip {
  top: -40px;
  left: 0;
  right: auto;
  width: auto;
}
transaction-comments-dialog .upload-wrapper .tooltip:after {
  content: "";
  position: absolute;
  top: 100%;
  left: 5px !important;
  transform: rotate(180deg);
}
transaction-comments-dialog .unsubscribe {
  margin: 0 35px 20px;
}
transaction-comments-dialog .mat-chip-list {
  width: 100%;
}
transaction-comments-dialog .mat-chip-list-wrapper .mat-standard-chip {
  background-color: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color1);
  min-height: 21px;
  font-size: 13px;
  font-weight: 400;
}
transaction-comments-dialog .mat-form-field-appearance-fill .mat-form-field-flex,
transaction-comments-dialog .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix {
  height: auto;
}
transaction-comments-dialog .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix {
  padding: 5px;
}
transaction-comments-dialog .tags {
  width: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
}
transaction-comments-dialog .tags .counterpart-name {
  margin-bottom: 5px;
  color: var(--gray-color5);
}
transaction-comments-dialog .tags .mat-form-field-appearance-fill .mat-form-field-flex {
  background-color: transparent !important;
  border-radius: var(--border-radius) !important;
  border: var(--default-border) !important;
  min-height: 32px;
}
transaction-comments-dialog .tags .remove.iconsax {
  --Iconsax-Size: 20px;
  --Iconsax-Color: var(--black-color0);
}
transaction-comments-dialog .form-label {
  font-size: 13px;
  font-weight: 400;
  color: var(--gray-color1);
  margin-bottom: 5px;
}
transaction-comments-dialog .border-bottom {
  border-bottom: 1px solid var(--gray-color14);
  padding-bottom: 20px;
  margin-bottom: 20px;
}
transaction-comments-dialog .finishButton button {
  position: relative;
}
transaction-comments-dialog .mat-mdc-text-field-wrapper {
  background: none !important;
  padding: 0;
}
transaction-comments-dialog .mat-chip-list-wrapper {
  margin: 0 !important;
}
transaction-comments-dialog .mat-mdc-form-field-infix {
  padding: 0 !important;
  min-height: auto !important;
}
transaction-comments-dialog .mat-chip-remove .mat-icon,
transaction-comments-dialog .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing {
  width: 20px !important;
  height: 20px !important;
}
transaction-comments-dialog .mat-mdc-form-field-focus-overlay {
  background-color: transparent !important;
}
transaction-comments-dialog .form-buttons {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}
transaction-comments-dialog .form-buttons > ui-button:first-child {
  margin-right: 10px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-expected-dialog-offline .comments {
  padding: 15px 20px;
}
app-expected-dialog-offline .row {
  padding: 15px;
}
app-expected-dialog-offline .split-section {
  padding: 0 20px;
}
app-expected-dialog-offline .split-section .split-list {
  margin-top: 20px;
}
app-expected-dialog-offline .split-section .split-list .split-header {
  padding: 15px 0;
}
app-expected-dialog-offline .split-section .split-item-parent {
  margin-bottom: 15px;
}
app-expected-dialog-offline .split-header {
  padding: 15px 20px;
}
app-expected-dialog-offline .wrapper {
  height: 70px;
  display: flex;
  padding: 0 15px;
  flex: 1;
  align-items: center;
  justify-content: space-between;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
app-expected-dialog-offline .date {
  width: 30%;
}
app-expected-dialog-offline .testW {
  display: block;
}
app-expected-dialog-offline .info {
  width: 38%;
}
app-expected-dialog-offline .form-line .dropdown {
  width: 100% !important;
  display: inline-block;
  vertical-align: top;
}
app-expected-dialog-offline .form-line .dropdown.category {
  z-index: 15;
}
app-expected-dialog-offline .form-line ui-dropdown {
  width: 100%;
}
app-expected-dialog-offline .form-line .form-group {
  width: 100%;
}
app-expected-dialog-offline .form-line .form-group ui-button.deleteLimit {
  margin-top: auto;
  margin-bottom: 3px;
}
app-expected-dialog-offline .form-line .form-group .form-field:not(:last-child) {
  margin-bottom: 15px;
}
app-expected-dialog-offline .form-line .form-group .form-field .label {
  color: var(--gray-color1);
  font-size: 13px;
  margin-bottom: 5px;
}
app-expected-dialog-offline .form-line .form-group .form-field ui-text-box {
  width: 100%;
}
app-expected-dialog-offline .form-line .form-group .delete {
  font-size: 20px;
  width: 20px;
  color: var(--red-color);
  cursor: pointer;
  margin-bottom: 5px;
  align-self: end;
  line-height: 1;
}
app-expected-dialog-offline .form-line .form-group .picker {
  position: relative;
}
app-expected-dialog-offline .form-line .form-group .picker .ng-invalid {
  border-color: var(--red-color);
}
app-expected-dialog-offline .form-line .error-text {
  margin-top: 5px;
  color: var(--orange-color1);
}
app-expected-dialog-offline .add-limit {
  cursor: pointer;
  margin-top: 5px;
  color: var(--blue-color6);
  font-size: 13px;
  font-weight: 500;
  display: inline-block;
}
app-expected-dialog-offline .error-limits {
  color: var(--red-color);
  font-weight: 500;
}
app-expected-dialog-offline .form-line-error {
  height: auto !important;
}
app-expected-dialog-offline .form-line-error .error-summary {
  padding: 10px !important;
}
app-expected-dialog-offline .tooltip {
  top: -40px;
  left: 22px;
  width: 170px;
}
app-expected-dialog-offline .offset-item-wrapper {
  margin-bottom: 30px;
}
app-expected-dialog-offline .bank-name {
  display: inline-block;
  width: 90%;
}
app-expected-dialog-offline .label-purpose {
  padding-left: 8px;
}
app-expected-dialog-offline .description {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
  display: inline-block;
}
app-expected-dialog-offline .loader-wrapper {
  display: flex;
  margin-top: 20px;
  justify-content: center;
}
app-expected-dialog-offline .counterpart-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
  display: inline-block;
}
app-expected-dialog-offline .negative {
  display: flex;
  color: var(--orange-color1);
}
app-expected-dialog-offline .positive {
  display: flex;
  color: var(--green-color1);
}
app-expected-dialog-offline .check-amount, app-expected-dialog-offline .amount, app-expected-dialog-offline .actions {
  width: 16%;
}
app-expected-dialog-offline .actions, app-expected-dialog-offline .check-amount {
  display: flex;
  justify-content: flex-end;
  padding-right: 10px;
}
app-expected-dialog-offline .check-amount {
  display: block;
}
app-expected-dialog-offline .slider-item {
  padding: 0 20px;
}
app-expected-dialog-offline .create {
  margin-right: 20px;
}
app-expected-dialog-offline .btn-done {
  margin: 15px 0;
}
app-expected-dialog-offline .createTransaction {
  border-bottom: var(--default-border);
}
app-expected-dialog-offline .createTransaction .form-line {
  display: flex;
  align-items: center;
  height: 40px;
  position: relative;
}
app-expected-dialog-offline .createTransaction .form-line .form-label {
  width: 90px;
  font-size: 13px;
  flex-shrink: 0;
}
app-expected-dialog-offline .createTransaction .form-line .form-label.required {
  padding-left: 10px;
}
app-expected-dialog-offline .createTransaction .form-line .form-label.required:before {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: -10px;
  margin-right: 4px;
}
app-expected-dialog-offline .createTransaction .form-line .form-control {
  flex-grow: 1;
  flex-basis: 100px;
}
app-expected-dialog-offline .form {
  padding: 20px 15px;
}
app-expected-dialog-offline .form .buttons {
  justify-content: flex-end !important;
  margin: 15px 0;
  display: flex;
  align-items: center;
}
app-expected-dialog-offline .form > .error {
  color: var(--orange-color1);
  margin: 0 0 5px 90px;
}
app-expected-dialog-offline .offline-label {
  color: var(--orange-color1);
}
app-expected-dialog-offline .file-upload-error {
  display: inline-block;
  color: var(--orange-color1);
  margin-top: 5px;
  line-height: 22px;
}
app-expected-dialog-offline .file-upload-error span a {
  width: 50px;
}
app-expected-dialog-offline .transaction-button-wrapper {
  display: flex;
}
app-expected-dialog-offline .transaction-button-wrapper .delete {
  margin-right: 0;
}
app-expected-dialog-offline .transaction-button-wrapper .cancel {
  width: 85px;
  margin-right: 10px;
}
app-expected-dialog-offline .form-line {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
  position: relative;
  align-items: flex-start;
  height: auto;
}
app-expected-dialog-offline .form-line .form-label {
  width: 90px;
  font-size: 13px;
  flex-shrink: 0;
  margin-bottom: 5px;
}
app-expected-dialog-offline .form-line .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
app-expected-dialog-offline .form-line .form-control {
  flex-grow: 1;
  flex-basis: auto;
  width: 100%;
}
app-expected-dialog-offline .button-wrapper {
  display: flex;
  padding-top: 20px;
  justify-content: flex-end;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}
app-expected-dialog-offline .button-wrapper ui-text-button {
  width: 150px;
}
app-expected-dialog-offline .button-wrapper ui-button {
  margin-left: 10px;
}
app-expected-dialog-offline ui-text-box.ng-invalid.ng-dirty input {
  border: 1px solid var(--orange-color6) !important;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.transaction-new__sync-box {
  padding: 20px 25px 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.transaction-new__sync-box__left {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 20px;
}
.transaction-new__sync-box__right__item {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 9px;
  margin-left: 20px;
  color: var(--gray-color1);
  font-size: 12px;
}
.transaction-new__filter__top {
  margin: 10px 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-right: 25px;
}
.transaction-new__filter__top input-search {
  display: block;
  width: 320px;
}
.transaction-new__filter__top__right {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.transaction-new__filter__more {
  padding-left: 10px;
  font-size: 13px;
  color: var(--blue-color6);
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.transaction-new__filter__more span {
  -webkit-user-select: none;
          user-select: none;
  padding-left: 5px;
}
.transaction-new__filter__icon svg path {
  stroke: var(--blue-color6) !important;
}
.transaction-new__filter__bottom {
  margin-bottom: 10px;
  padding: 0 25px;
}
.transaction-new__filter__bottom__line {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 5px;
}
.transaction-new__filter__bottom__line:not(:last-child) {
  margin-bottom: 5px;
}
.transaction-new__filter__bottom__line app-input-date-range {
  width: 250px;
}
.transaction-new__filter__bottom__line app-input-single-select {
  width: 160px;
}
.transaction-new__filter__bottom__line app-input-multiple-select {
  width: 160px;
}
.transaction-new__filter__bottom__line app-input-categories-select {
  width: 160px;
  display: block;
}
.transaction-new__filter__bottom__clear {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  cursor: pointer;
  padding-left: 10px;
}
.transaction-new__filter__bottom__clear .iconsax svg path {
  stroke: var(--blue-color6);
}
.transaction-new__filter__bottom__clear span {
  color: var(--blue-color6);
  font-size: 13px;
  padding-left: 5px;
}

transactions-new .linkToMatch path {
  fill: var(--orange-color6);
}
transactions-new .map-to .drp-menu {
  width: auto;
  padding: 0 10px;
}
transactions-new ui-plug {
  padding: 0 25px;
}
transactions-new .dropdown {
  border: none;
  font-size: 13px;
  height: 32px;
}
transactions-new ui-dropdown.disabled {
  opacity: 0.5;
}
transactions-new .drp-label {
  position: relative;
}
transactions-new .actions {
  display: flex;
  width: 30px;
  position: relative;
  align-items: center;
}
transactions-new .actions .select-all {
  float: left;
  margin: 0 17px !important;
  padding-top: 7px;
}
transactions-new .filter-input-wrapper {
  width: 100%;
  position: relative;
}
transactions-new .filter-input-wrapper .search-text {
  width: 100%;
}
transactions-new .monster {
  position: absolute;
  top: 78px;
  cursor: pointer;
  right: 30px;
  width: 70px;
}
transactions-new .monster img {
  width: 100%;
}
transactions-new .mat-form-field-appearance-fill .mat-form-field-flex {
  width: auto;
}
transactions-new .mat-form-field-appearance-fill .mat-form-field-flex,
transactions-new .header-component .filter-all .other-filters .search-form .text-boxes {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-new .header-component {
  display: flex;
  flex-direction: column;
}
transactions-new .header-component .btn-wrapper {
  display: flex;
  position: relative;
  justify-content: space-between;
  align-items: center;
  padding: 20px 25px 0;
}
transactions-new .header-component .btn-wrapper .button-section {
  display: flex;
  justify-content: flex-start;
}
transactions-new .header-component .btn-wrapper ui-button {
  margin-right: 20px;
}
transactions-new .header-component .date-sync {
  display: flex;
  margin-left: 20px;
  flex-direction: column;
  color: var(--gray-color1);
  font-size: 12px;
}
transactions-new .header-component .upload-xls-loader {
  width: auto;
}
transactions-new .header-component .upload-xls-loader .loader {
  width: 20px;
  margin: 0 0 0 10px;
}
transactions-new .header-component .upload-xls-loader .image-load {
  margin: -10px 0 0 -10px !important;
  width: 20px !important;
}
transactions-new .header-component .item:not(.item-picker) {
  position: relative;
}
transactions-new .header-component .filter-search input {
  background: var(--gray-color13);
  border-radius: 20px;
  border: none;
  height: 35px;
  color: var(--gray-color5);
}
transactions-new .header-component .clicks {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 25px 0 25px;
}
transactions-new .header-component .clicks .header-link-wrapper {
  font-weight: 500;
  white-space: nowrap;
  display: flex;
  align-items: center;
}
transactions-new .header-component .clicks .header-toggle-link {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: flex-end;
}
transactions-new .header-component .clicks .header-toggle-link .filter-input-wrapper {
  width: 320px;
}
transactions-new .header-component .clicks .header-toggle-link ui-button {
  margin-left: 10px;
}
transactions-new .header-component .clicks .filter-switch {
  text-transform: capitalize;
  background: url("/assets/images/icons_new_design/ico_filter.svg") 0 50% no-repeat;
  padding-left: 20px;
}
transactions-new .header-component .filter-all {
  width: 100%;
  display: flex;
  overflow: unset;
  transition: all ease-in 0.1s;
  padding: 10px 25px;
}
transactions-new .header-component .filter-all .mat-form-field-wrapper {
  padding: 0;
}
transactions-new .header-component .filter-all .filter-btn-wrapper {
  display: flex;
}
transactions-new .header-component .filter-all .filter-btn-wrapper .item {
  margin-right: 5px;
}
transactions-new .header-component .filter-all .filter-btn-wrapper .item:last-child {
  margin-right: 0;
}
transactions-new .header-component .filter-all .filter-btn-wrapper .item .picker .ngx-datepicker {
  height: 35px;
  width: 220px;
}
transactions-new .header-component .filter-all.hideFilter {
  height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}
transactions-new .header-component .filter-all .reset {
  text-align: right;
}
transactions-new .header-component .filter-all .reset a {
  font-weight: 400;
  font-size: 13px;
  color: var(--blue-color6);
  align-items: center;
  display: flex;
}
transactions-new .header-component .filter-all .other-filters {
  display: flex;
  align-items: center;
}
transactions-new .header-component .filter-all .other-filters .search-form {
  position: relative;
  display: flex;
  justify-content: flex-start;
  width: 100%;
  flex-direction: column;
}
transactions-new .header-component .filter-all .other-filters .search-form .filter-row {
  margin-right: auto;
}
transactions-new .header-component .filter-all .other-filters .search-form .filter-row:first-child {
  padding-bottom: 5px;
}
transactions-new .header-component .filter-all .other-filters .search-form .search-text {
  max-width: 160px;
}
transactions-new .header-component .filter-all .other-filters .search-form .text-boxes {
  padding-right: 25px;
}
transactions-new .dropdown-tag .drp-label {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-new .dropdown-tag .drp-menu {
  width: 250px;
}
transactions-new .header-component .filter-all .other-filters .dropdown-tag .drp-menu .text-boxes {
  background: var(--white-color) !important;
}
transactions-new bulk-map {
  margin-right: 10px;
}
transactions-new .bulk-map {
  display: flex;
  align-items: center;
  height: 60px;
  margin: 0 25px;
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--ultra-light-blue1);
}
transactions-new .bulk-map .map-selected-to {
  width: 100% !important;
  top: 0 !important;
  height: 35px;
  padding-bottom: 0;
}
transactions-new .bulk-map .map-selected-to .select {
  width: 20px;
}
transactions-new .bulk-map .delete {
  width: 30px;
  height: 30px;
  cursor: pointer;
  background: url(/assets/images/icons/trashcan.svg) 50% 50% no-repeat;
  margin-left: 5px;
  border-radius: 20px;
}
transactions-new .bulk-map .delete:hover {
  background-color: var(--gray-color13);
}
transactions-new .description {
  position: relative;
  word-break: break-all;
}
transactions-new .search-button {
  position: absolute;
  right: 5px;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
transactions-new .tooltip-desc {
  display: none;
  right: -200px;
  padding: 10px;
  line-height: 20px;
  word-break: break-all;
}
transactions-new .tooltip-desc .counterpart-name {
  word-break: break-all;
  white-space: unset;
}
transactions-new .hoverTooltip:hover .tooltip-desc {
  display: block;
}
transactions-new .hoverTooltip {
  cursor: pointer;
}
transactions-new .titleDesc {
  word-break: break-all;
  white-space: pre-wrap;
  display: inline-block;
  color: var(--gray-color3);
}
transactions-new .mapping-table {
  position: relative;
  margin-top: 10px;
}
transactions-new .mapping-table.loading {
  height: 160px;
}
transactions-new .mapping-table.loading:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
transactions-new .mapping-table .body .row.hide {
  display: none;
}
transactions-new .mapping-table .body .row.rowChecked .left-part,
transactions-new .mapping-table .body .row.rowChecked .right-part {
  background: var(--ultra-light-blue3);
}
transactions-new .mapping-table .body .row {
  min-height: 60px;
  margin-bottom: 8px;
  display: flex;
  width: 100%;
}
transactions-new .mapping-table .body .row__title {
  height: 40px;
  min-height: 40px;
}
transactions-new .mapping-table .body .row .left-part {
  width: 72%;
  position: relative;
  display: flex;
  align-items: flex-start;
  padding: 10px 0;
  height: 100%;
  justify-content: space-between;
  background: var(--white-color);
  min-height: 60px;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
transactions-new .mapping-table .body .row .left-part__title {
  padding: 5px 0;
  height: 40px;
  min-height: 40px;
  background: transparent;
  box-shadow: none;
}
transactions-new .mapping-table .body .row .left-part__title .checkbox {
  width: 37px;
  height: 100%;
}
transactions-new .mapping-table .body .row .left-part__title .date {
  text-align: left !important;
  padding-left: 8px !important;
}
transactions-new .mapping-table .body .row .left-part__title .trx-actions {
  padding-right: 8px;
}
transactions-new .mapping-table .body .row .left-part__title div {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 30px;
  color: var(--black-color0) !important;
  font-weight: 500 !important;
}
transactions-new .mapping-table .body .row .left-part .select {
  margin: 4px 0 0 17px;
  width: 20px;
}
transactions-new .mapping-table .body .row .left-part .date {
  margin-left: 12px;
  text-align: center;
  white-space: nowrap;
  display: flex;
  flex-direction: column;
  width: 80px;
  padding: 6px 0;
}
transactions-new .mapping-table .body .row .left-part .date .day {
  font-size: 13px;
  color: var(--gray-color3);
}
transactions-new .mapping-table .body .row .left-part .account {
  padding: 6px 10px 6px 20px;
  width: 165px;
  text-align: left;
  flex-wrap: wrap;
  font-weight: normal;
}
transactions-new .mapping-table .body .row .left-part .info {
  width: 0;
  min-width: 100px;
  flex-grow: 1;
  flex-basis: 250px;
  text-align: left;
  display: flex;
  flex-direction: column;
  padding: 6px 0;
}
transactions-new .mapping-table .body .row .left-part .info .tags {
  margin: 0 0;
}
transactions-new .mapping-table .body .row .left-part .info .tags .title {
  font-size: 9px;
  font-weight: 500;
}
transactions-new .mapping-table .body .row .left-part .amount {
  padding: 6px 10px;
  width: 150px;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
}
transactions-new .mapping-table .body .row .left-part .amount .currency {
  font-size: 11px;
  font-weight: 500;
  margin-right: 5px;
}
transactions-new .mapping-table .body .row .central-part {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  width: 125px;
}
transactions-new .mapping-table .body .row .right-part {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  width: 28%;
  padding: 10px 15px;
  margin-left: 8px;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
transactions-new .mapping-table .body .row .right-part__title {
  background: transparent;
  box-shadow: none;
  padding: 5px 15px;
  height: 40px;
  min-height: 40px;
  line-height: 30px;
  color: var(--black-color0) !important;
  font-weight: 500 !important;
}
transactions-new .mapping-table .body .row .right-part .dropdown {
  max-width: calc(100% - 50px) !important;
  width: 100%;
}
transactions-new .mapping-table .body .row .right-part .map {
  margin-left: 15px;
}
@media screen and (min-width: 1050px) {
  transactions-new .mapping-table .body .row .right-part .map {
    padding: 8px 16px;
    border-radius: 20px;
    border: none;
    font-size: 13px;
    margin: 0 15px;
  }
  transactions-new .mapping-table .body .row .right-part .dropdown {
    max-width: calc(100% - 100px) !important;
  }
}
transactions-new .mapping-table .body .row .tag-wrapper {
  margin-top: 5px;
  display: flex;
}
transactions-new .mapping-table .body .row .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  margin-right: 5px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
transactions-new .mapping-table .body .row .tag:not(:first-child) {
  margin-left: 5px;
}
transactions-new .mapping-table .body .row .tag.more-tag {
  min-width: unset;
  border: unset;
}
transactions-new .mapping-table .body .row .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
transactions-new .pagination-data {
  margin-left: 10px;
  margin-top: 10px;
  margin-bottom: 20px;
}
transactions-new .pagination-data .btn {
  background-color: var(--green-color1);
  color: var(--white-color);
  font-size: 13px;
}
transactions-new .pagination {
  display: flex;
  flex-direction: row;
  text-align: center;
}
transactions-new .pagination .pagination-count {
  margin: auto;
  display: flex;
}
transactions-new .pagination .pagination-data {
  flex-grow: 1;
  margin-right: 64px;
}
transactions-new .drp-label.disabled {
  opacity: 1 !important;
}
transactions-new .mapping-table .ros {
  margin-right: 15px;
  width: 230px !important;
  background-color: var(--gray-color7) !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  cursor: default;
}
transactions-new .selected.shows {
  background-color: var(--orange-color6) !important;
}
transactions-new .mapping-table .nope {
  width: 93% !important;
  background-color: var(--gray-color7) !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  cursor: default;
}
transactions-new .pagination .pag-control {
  padding-top: 14px;
}
transactions-new .counterpart-name {
  font-weight: 500;
  color: var(--black-color0);
  word-break: break-all;
  display: inline-block;
}
transactions-new .trunc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
transactions-new .pagination .per-page {
  padding-left: 12px;
}
transactions-new .popover-datepicker {
  position: absolute;
  top: 10px;
  left: 0;
  width: 270px;
  background-color: var(--white-color);
  z-index: 5;
  padding: 0 20px 20px;
  border: var(--default-border);
}
transactions-new .popover-datepicker .datepicker__wrapper {
  display: flex;
  justify-content: space-between;
}
transactions-new .popover-datepicker .mat-calendar-body-label {
  display: none !important;
}
transactions-new .page-loader {
  position: relative;
  top: 0;
  left: 0;
  width: 100px;
  height: 100px;
  margin: calc(50vh - 210px) auto;
}
transactions-new .bank-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 135px;
  color: var(--gray-color3);
}
transactions-new .predicted-count {
  font-size: 11px;
  color: var(--white-color);
  background: var(--orange-color1);
  border-radius: var(--border-radius);
  margin-left: -25px;
  padding: 1px 4px;
  position: relative;
  z-index: 1000;
}
transactions-new #predicted-popup .title-wrapper {
  padding-left: 20px;
  height: 60px;
  line-height: 60px;
}
transactions-new #predicted-popup .message {
  white-space: normal;
}
transactions-new .icon {
  display: inline-block;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 50%;
  font-size: 18px;
  text-align: center;
}
transactions-new .tooltip {
  top: 100%;
  right: -5px;
}
transactions-new .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 20px);
}
transactions-new transactions-rules-dialog ui-icon-hint .tooltip {
  top: 25px;
  left: 0;
  margin-top: 0 !important;
}
transactions-new transactions-rules-dialog ui-icon-hint .tooltip:after {
  content: "";
  position: absolute;
  bottom: 100% !important;
  left: 5px !important;
  transform: rotate(0deg) !important;
}
transactions-new .trx-actions {
  width: 100px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
transactions-new .trx-actions > div {
  margin-right: 15px;
}
transactions-new .trx-actions .edit-trx {
  position: relative;
}
transactions-new .trx-actions .edit-trx:hover .tooltip {
  display: block;
}
transactions-new .trx-actions .link-to-match {
  cursor: pointer;
  position: relative;
  display: flex;
}
transactions-new .trx-actions .link-to-match:hover .tooltip {
  display: block;
}
transactions-new .trx-actions .comment {
  text-align: left;
  display: inline-block;
  position: relative;
  margin-top: 4px;
  cursor: pointer;
}
transactions-new .trx-actions .comment .isComment {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green-color1);
  top: -3px;
  right: -4px;
}
transactions-new .trx-actions .comment.active:before {
  background-position: 0 0;
}
transactions-new .trx-actions .comment .comment-count {
  padding-left: 5px;
  position: absolute;
  top: -2px;
  right: 0;
}
transactions-new .trx-actions .comment.active .comment-count {
  color: var(--blue-color3);
}
transactions-new .trx-actions .comment:hover .tooltip {
  display: block;
}
transactions-new .trx-actions .list-split-transaction {
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
}
transactions-new .trx-actions .list-split-transaction .icon {
  cursor: pointer;
  position: relative;
  line-height: unset;
}
transactions-new .trx-actions .list-split-transaction .icon:hover {
  text-decoration: unset !important;
}
transactions-new .trx-actions .list-split-transaction:hover .tooltip {
  display: block;
}
transactions-new .trx-tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  margin-right: 5px;
  position: relative;
}
transactions-new .trx-tag:last-child {
  margin-right: 0;
}
transactions-new .trx-tag:hover .tooltip {
  display: block;
}
transactions-new .split-tag {
  background: var(--orange-light-color);
  color: var(--orange-color);
}
transactions-new .matched-tag {
  background: var(--ultra-light-blue3);
  color: var(--btn-blue-color);
}
transactions-new .purpose-tag {
  color: var(--gray-color3);
  padding-left: 0;
  padding-right: 0;
  font-weight: 400;
  overflow: hidden;
  display: block;
  text-overflow: ellipsis;
  word-break: break-word;
}

.per-page .primary-color {
  color: var(--orange-color6) !important;
}

.per-page .accent-color {
  color: var(--orange-color6) !important;
}

.background-primary-color {
  background-color: var(--blue-color13) !important;
}

.background-accent-color {
  background-color: var(--purple-color1) !important;
}

.white-text {
  color: var(--white-color) !important;
}

.my-class {
  color: var(--black-color0);
}

.d-none {
  display: none !important;
}

@media screen and (max-width: 1400px) {
  transactions-new .mapping-table .body .row .left-part .account {
    display: none;
  }
  transactions-new .mapping-table .body .row .left-part .date {
    text-align: left;
    width: 130px;
  }
  transactions-new .mapping-table .body .row .left-part .date .bank-name {
    display: block;
    width: 100%;
    font-size: 12px;
    color: var(--gray-color3);
  }
}
@media screen and (max-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-block {
    display: block !important;
  }
  .dropdown {
    width: 104px !important;
  }
}
.transactions-new-table__container {
  display: block;
  margin: 0 25px;
}
.transactions-new-table__table__toolbar {
  margin: 0 25px;
  padding: 12px 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.transactions-new-table__table__checkbox {
  padding-left: 25px;
}
.transactions-new-table__table__notice {
  font-size: 13px;
  line-height: 24px;
  font-style: italic;
  padding-left: 18px;
  color: var(--gray-color15);
}
.transactions-new-table__table__bulk {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 15px;
}
.transactions-new-table__table__bulk app-input-categories-select {
  display: block;
  width: 330px;
}
.transactions-new-table__table__buttons {
  padding-left: 45px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 18px;
}
.transactions-new-table__line {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.transactions-new-table__line:last-child {
  margin-bottom: 0;
}
.transactions-new-table__line.checked {
  background: var(--ultra-light-blue3);
}
.transactions-new-table__line__left {
  display: flex;
  justify-content: flex-start;
  background: var(--white-color);
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: var(--border-radius);
  flex: 1;
}
.transactions-new-table__checkbox, .transactions-new-table__date, .transactions-new-table__bank, .transactions-new-table__nameDescription, .transactions-new-table__amount, .transactions-new-table__actions, .transactions-new-table__category {
  flex: 1;
  font-size: 13px;
  line-height: 20px;
  padding: 18px 10px;
  position: relative;
}
.transactions-new-table__category {
  padding: 11px 10px;
  max-width: 270px;
  min-width: 270px;
  background: var(--white-color);
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: var(--border-radius);
}
.transactions-new-table__actions {
  max-width: 170px;
  min-width: 170px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 13px 10px;
  gap: 5px;
}
.transactions-new-table__actions ui-button {
  width: 30px;
  height: 30px;
  display: block;
}
.transactions-new-table__actions ui-button:last-child {
  margin-right: -6px;
}
.transactions-new-table__amount {
  max-width: 150px;
  min-width: 150px;
  text-align: right;
  font-weight: 500;
  color: var(--gray-color5);
}
.transactions-new-table__amount span:not(:last-child) {
  margin-right: 5px;
}
.transactions-new-table__bank {
  max-width: 180px;
  min-width: 180px;
  color: var(--gray-color1);
}
.transactions-new-table__date {
  color: var(--gray-color1);
  max-width: 100px;
  min-width: 100px;
}
.transactions-new-table__checkbox {
  max-width: 44px;
  min-width: 44px;
}
.transactions-new-table__nameDescription {
  overflow: hidden;
}
.transactions-new-table__nameDescription div:nth-child(1) {
  color: var(--gray-color5);
  font-weight: 500;
}
.transactions-new-table__nameDescription div:nth-child(2) {
  color: var(--gray-color1);
}
.transactions-new-table__tag-wrapper {
  margin-top: 5px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.transactions-new-table__tag-item {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.transactions-new-table__tag-item div {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.transactions-new-table__category {
  max-width: 290px;
  min-width: 290px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 16px;
}
.transactions-new-table__category app-input-categories-select {
  display: block;
  flex: 1;
  max-width: calc(100% - 60px);
}
.transactions-new-table__content {
  position: relative;
}
.transactions-new-table__loader {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  margin: 0 25px;
  z-index: 9;
  background: var(--overlay-loader);
  border-radius: 5px;
}
.transactions-new-table__checkbox {
  max-width: 44px;
  min-width: 44px;
}
.transactions-new-table__checkbox .checkbox {
  width: 24px;
  height: 24px;
  border-radius: 5px;
  border: 1px solid var(--gray-color15);
  padding: 4px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.transactions-new-table__checkbox .checkbox div {
  display: none;
  max-height: 100%;
  max-width: 100%;
  justify-content: center;
  align-items: center;
}
.transactions-new-table__checkbox .checkbox.active {
  background: var(--green-color1);
  border-color: var(--green-color1);
  position: relative;
}
.transactions-new-table__checkbox .checkbox.active:before {
  content: "";
  display: flex;
  height: 100%;
  width: 100%;
  background: url(/assets/images/icons_new_design/ico_white_check.svg) 50% 50% no-repeat var(--green-color1);
}
.transactions-new-table__checkbox .checkbox.partial {
  background: var(--green-color1);
  border-color: var(--green-color1);
}
.transactions-new-table__checkbox .checkbox.partial:before {
  content: "";
  padding: 1px 6px;
  background: var(--btn-green-color);
  border-radius: 1px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transactions-mapped .my-class {
  color: var(--black-color0);
}
transactions-mapped ui-plug {
  padding: 0 25px;
}
transactions-mapped .plugInfo {
  margin: 0 !important;
}
transactions-mapped .map-to .drp-menu {
  width: auto;
  padding: 0 20px;
}
transactions-mapped .transactions-download-wrapper {
  display: flex;
  margin-left: auto;
}
transactions-mapped .header-component {
  display: flex;
  flex-direction: column;
}
transactions-mapped .header-component .item:not(.item-datepicker) {
  position: relative;
}
transactions-mapped .header-component .hideFilter {
  height: 0 !important;
  overflow: hidden !important;
}
transactions-mapped .header-component .clicks {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 25px 0 25px;
}
transactions-mapped .header-component .clicks .header-link-wrapper {
  width: 50%;
  font-weight: 500;
  white-space: nowrap;
  display: flex;
  align-items: center;
}
transactions-mapped .header-component .clicks .header-toggle-link {
  display: flex;
  position: relative;
  justify-content: flex-end;
  align-items: center;
}
transactions-mapped .header-component .clicks .header-toggle-link .filter-input-wrapper {
  width: 320px;
}
transactions-mapped .header-component .clicks .header-toggle-link ui-button {
  margin-left: 10px;
}
transactions-mapped .header-component .clicks .filter-switch {
  text-transform: capitalize;
  background: url("/assets/images/icons_new_design/ico_filter.svg") 0 50% no-repeat;
  padding-left: 20px;
}
transactions-mapped .header-component .filter-input-wrapper {
  width: 100%;
  position: relative;
}
transactions-mapped .header-component .filter-input-wrapper .search-text {
  width: 100%;
}
transactions-mapped .header-component .filter-input-wrapper .search-text input {
  background: var(--gray-color13);
  border-radius: 20px;
  border: none;
  height: 35px;
  color: var(--gray-color5);
}
transactions-mapped .header-component .filter-all {
  width: 100%;
  display: flex;
  overflow: unset;
  transition: all ease-in 0.1s;
  padding: 10px 25px 0;
}
transactions-mapped .header-component .filter-all .filter-btn-wrapper {
  display: flex;
}
transactions-mapped .header-component .filter-all .filter-btn-wrapper ui-check-box {
  line-height: 32px;
  margin-right: 10px;
}
transactions-mapped .header-component .filter-all .filter-btn-wrapper .item {
  margin-right: 5px;
}
transactions-mapped .header-component .filter-all .filter-btn-wrapper .item:last-child {
  margin-right: 0;
}
transactions-mapped .header-component .filter-all .filter-btn-wrapper .item .iconsax {
  position: absolute;
  right: 5px;
  top: calc(50% - 12px);
  cursor: pointer;
}
transactions-mapped .header-component .filter-all .filter-btn-wrapper .item .picker .ngx-datepicker {
  width: 220px;
}
transactions-mapped .header-component .filter-all.hideFilter {
  height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}
transactions-mapped .header-component .filter-all .reset {
  text-align: right;
}
transactions-mapped .header-component .filter-all .reset a {
  font-weight: 400;
  font-size: 13px;
  color: var(--blue-color6);
  align-items: center;
  display: flex;
}
transactions-mapped .header-component .filter-all .mat-form-field-wrapper {
  padding: 0;
}
transactions-mapped .header-component .filter-all .other-filters {
  display: flex;
  align-items: center;
}
transactions-mapped .header-component .filter-all .other-filters .search-form {
  position: relative;
  display: flex;
  justify-content: flex-end;
  width: 100%;
  flex-direction: column;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .filter-row {
  margin-right: auto;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .filter-row:first-child {
  padding-bottom: 5px;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .search-text {
  max-width: 160px;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .search-text input {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .mat-form-field-appearance-fill .mat-form-field-flex {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .search-button {
  position: absolute;
  right: 5px;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
transactions-mapped .header-component .filter-all .other-filters .search-form .text-boxes {
  padding-right: 25px;
}
transactions-mapped .filter-input-wrapper {
  position: relative;
}
transactions-mapped .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
transactions-mapped .drp-label.disabled {
  opacity: 1 !important;
}
transactions-mapped .mapping-table .body .category {
  background: var(--gray-color7);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin-bottom: 15px;
}
transactions-mapped .mapping-table .body .category .header {
  background: var(--white-color);
  border-radius: var(--border-radius) var(--border-radius) 0 0;
  height: 45px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
transactions-mapped .mapping-table .body .category .header .category-title {
  cursor: pointer;
  margin-left: 25px;
  display: flex;
}
transactions-mapped .mapping-table .body .category .header .category-title .chevron {
  font-size: 12px;
  font-weight: bold;
  margin-right: 25px;
}
transactions-mapped .mapping-table .body .category .header .show-on-dashboard {
  display: flex;
  align-items: center;
  margin-right: 20px;
}
transactions-mapped .mapping-table .body .category .header .show-on-dashboard .text {
  margin-right: 13px;
}
transactions-mapped .mapping-table .body .category .header .show-on-dashboard .icon {
  font-size: 18px;
}
transactions-mapped .mapping-table .body .category .header .show-on-dashboard .icon:hover, transactions-mapped .mapping-table .body .category .header .show-on-dashboard .icon:active, transactions-mapped .mapping-table .body .category .header .show-on-dashboard .icon.active {
  color: var(--green-color1);
}
transactions-mapped .mapping-table .body .category .transactions .row {
  min-height: 60px;
  border-top: var(--default-border);
  display: flex;
  align-items: stretch;
}
transactions-mapped .mapping-table .body .category .transactions .row .select {
  margin: 9px 17px 0 17px;
  width: 20px;
}
transactions-mapped .mapping-table .body .category .transactions .row .date {
  width: 50px;
  text-align: center;
  display: flex;
  flex-direction: column;
}
transactions-mapped .mapping-table .body .category .transactions .row .date .day {
  font-size: 18px;
}
transactions-mapped .mapping-table .body .category .transactions .row .account {
  padding: 0 10px 0 20px;
  width: 120px;
  text-align: left;
  flex-wrap: wrap;
  font-weight: normal;
}
transactions-mapped .mapping-table .body .category .transactions .row .info {
  flex-grow: 1;
  flex-basis: 300px;
  max-width: 38%;
  padding: 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
transactions-mapped .mapping-table .body .category .transactions .row .info .tags {
  margin: 5px 0;
}
transactions-mapped .mapping-table .body .category .transactions .row .info .tags .title {
  font-size: 9px;
  font-weight: 500;
}
transactions-mapped .mapping-table .body .category .transactions .row .info .description {
  font-size: 13px;
}
transactions-mapped .mapping-table .body .category .transactions .row .amount {
  padding: 0 10px;
  min-width: 130px;
  max-width: 130px;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
}
transactions-mapped .mapping-table .body .category .transactions .row .mapped-to, transactions-mapped .mapping-table .body .category .transactions .row .remap {
  width: 100px;
  margin: 0 10px;
  text-align: center;
}
transactions-mapped .mapping-table .body .category .transactions .row .map-to-category {
  width: 155px;
  margin: 0 20px;
  background: var(--white-color);
}
transactions-mapped .new-table {
  margin: 10px 25px 0 25px;
}
transactions-mapped .new-table__container {
  background-color: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
transactions-mapped .new-table .title-for-panel {
  font-size: 13px;
}
transactions-mapped .new-table mat-panel-title {
  font-size: 11px;
  font-weight: 400;
  color: var(--black-color0);
}
transactions-mapped .new-table .hello-map {
  position: relative;
  margin-bottom: 15px;
  background-color: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
transactions-mapped .new-table .hello-map .transactions .news {
  background-color: var(--orange-color6);
}
transactions-mapped .new-table .hello-map .transactions.hide {
  display: none;
}
transactions-mapped .new-table .hello-map.hide {
  display: none;
}
transactions-mapped .new-table .ss.hide {
  display: none;
}
transactions-mapped .new-table .hello-map .transactions.lala {
  display: none;
}
transactions-mapped .new-table .hello-map .transactions .row {
  min-height: 60px;
  border-top: var(--default-border);
  position: relative;
  display: flex;
  align-items: stretch;
}
transactions-mapped .new-table .hello-map .transactions .row .select {
  margin: 9px 17px 0 17px;
  width: 20px;
}
transactions-mapped .new-table .hello-map .transactions .row .date {
  margin-left: 10px;
  text-align: center;
  font-family: "Rubik", sans-serif;
  display: flex;
  flex-direction: column;
}
transactions-mapped .new-table .hello-map .transactions .row .date .bank-name {
  display: none;
}
transactions-mapped .new-table .hello-map .transactions .row .date .day {
  font-size: 18px;
}
transactions-mapped .new-table .hello-map .transactions .row .account {
  padding: 0 10px 0 20px;
  text-align: left;
  flex-wrap: wrap;
  font-weight: normal;
}
transactions-mapped .new-table .hello-map .transactions .row .info {
  flex-grow: 1;
  flex-basis: 300px;
  padding: 10px;
  max-width: 38%;
  text-align: left;
  display: flex;
  flex-direction: column;
}
transactions-mapped .new-table .hello-map .transactions .row .info .tags {
  margin: 5px 0;
}
transactions-mapped .new-table .hello-map .transactions .row .amount {
  padding: 0 10px;
  width: 110px;
  text-align: center;
  font-size: 13px;
  font-family: "Rubik", sans-serif;
  font-weight: 500;
}
transactions-mapped .new-table .hello-map .transactions .row .mapped-to, transactions-mapped .new-table .hello-map .transactions .row .remap {
  width: 100px;
  margin: 0 10px;
  text-align: center;
}
transactions-mapped .new-table .hello-map .transactions .row .map-to-category {
  width: 155px;
  margin: 0 20px;
  background: var(--white-color);
}
transactions-mapped .mat-expansion-panel {
  overflow: visible !important;
}
transactions-mapped .with-price {
  justify-content: space-between;
}
transactions-mapped .expanded .chevron, transactions-mapped .mat-expanded .chevron {
  transform: rotate(0deg);
}
transactions-mapped .chevron {
  color: var(--black-color0);
  font-size: 12px;
  font-weight: bold;
  height: 13px;
  width: 13px;
  transition: linear 0.2s;
  display: inline-block;
  margin-top: 1px;
}
transactions-mapped a.collaps {
  padding-right: 10px;
}
transactions-mapped a.collaps:hover {
  text-decoration: none;
}
transactions-mapped a.collaps .chevron {
  cursor: pointer;
}
transactions-mapped .icon {
  display: inline-block;
  flex-shrink: 0;
  cursor: pointer;
  border-radius: 50%;
  font-size: 18px;
  text-align: center;
}
transactions-mapped .list-split-transaction {
  display: flex;
  align-items: center;
  position: relative;
}
transactions-mapped .list-split-transaction .icon {
  cursor: pointer;
  position: relative;
  line-height: unset;
}
transactions-mapped .list-split-transaction .icon:hover {
  text-decoration: unset !important;
}
transactions-mapped .list-split-transaction .tooltip {
  top: -22px;
  left: 25px;
  width: 200px;
}
transactions-mapped .list-split-transaction:hover .tooltip {
  display: block;
}
transactions-mapped .trx-actions {
  width: 160px;
  min-width: 130px;
  padding-top: 10px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
transactions-mapped .trx-actions .tooltip {
  top: -45px;
  left: 0;
}
transactions-mapped .trx-actions .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 5px;
  transform: rotate(180deg);
}
transactions-mapped .trx-actions > div {
  margin: 0 7px;
}
transactions-mapped .trx-actions .link-to-match {
  color: var(--blue-color3);
  font-size: 18px;
  cursor: pointer;
  position: relative;
}
transactions-mapped .trx-actions .link-to-match:hover .tooltip {
  display: block;
}
transactions-mapped .trx-actions .comment {
  text-align: left;
  display: inline-block;
  position: relative;
  margin-top: 4px;
  cursor: pointer;
}
transactions-mapped .trx-actions .comment .isComment {
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green-color1);
  top: -3px;
  right: -4px;
}
transactions-mapped .trx-actions .comment.active:before {
  background-position: 0 0;
}
transactions-mapped .trx-actions .comment .comment-count {
  padding-left: 5px;
  position: absolute;
  top: -2px;
  right: 0;
}
transactions-mapped .trx-actions .comment.active .comment-count {
  color: var(--blue-color3);
}
transactions-mapped .trx-actions .comment:hover .tooltip {
  display: block;
}
transactions-mapped .trx-tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  margin-right: 5px;
  position: relative;
}
transactions-mapped .trx-tag:last-child {
  margin-right: 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
transactions-mapped .trx-tag:hover .tooltip {
  display: block;
  top: -40px;
  left: 0;
}
transactions-mapped .trx-tag:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 10%;
  transform: rotate(180deg);
}
transactions-mapped .split-tag {
  background: var(--orange-light-color);
  color: var(--orange-color);
}
transactions-mapped .matched-tag {
  background: var(--ultra-light-blue3);
  color: var(--btn-blue-color);
}
transactions-mapped .purpose-tag {
  color: var(--gray-color11);
  padding-left: 0;
  padding-right: 0;
  font-weight: 400;
  overflow: hidden;
  display: block;
  text-overflow: ellipsis;
  word-break: break-word;
}
transactions-mapped .current-checkbox {
  width: 20px;
  height: 20px;
  margin-right: 20px;
  cursor: pointer;
  margin-top: 26px;
}
transactions-mapped .current-checkbox__input[type=checkbox]:before {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border: 1px solid var(--gray-color16);
  border-radius: var(--border-radius);
  content: "";
  background: var(--white-color);
}
transactions-mapped .current-checkbox__input[type=checkbox]:after {
  position: relative;
  display: block;
  top: -20px;
  width: 7px;
  height: 7px;
  content: "";
  background-repeat: no-repeat;
  background-position: center;
}
transactions-mapped .counterpart-name {
  font-weight: 500;
  color: var(--black-color0);
  font-family: "Rubik", sans-serif;
}
transactions-mapped .mat-expansion-panel-header {
  height: 48px !important;
  font-family: "Rubik", sans-serif;
}
transactions-mapped .mat-expansion-panel-content {
  font: inherit;
}
transactions-mapped .opened .mat-expansion-panel-body, transactions-mapped .opened .mat-expansion-panel-content {
  margin: 0 !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
}
transactions-mapped .mat-expansion-panel {
  color: inherit;
}
transactions-mapped .wrap-bulk-map {
  position: absolute;
  left: 170px;
  margin-top: 15px;
}
transactions-mapped .tag-wrapper {
  display: flex;
  gap: 5px;
}
transactions-mapped .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
transactions-mapped .tag:not(:first-child) {
  margin-left: 5px;
}
transactions-mapped .tag.more-tag {
  min-width: unset;
  border: unset;
}
transactions-mapped .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
transactions-mapped .bulk-map {
  display: flex;
  position: sticky;
  top: -1px;
  z-index: 4;
  align-items: center;
  height: 60px;
  margin: 0 25px;
  padding-left: 10px;
  background: var(--ultra-light-blue1);
}
transactions-mapped .bulk-map .map-selected-to {
  width: 100% !important;
}
transactions-mapped .bulk-map .bulk-delete {
  margin-left: 10px;
}
transactions-mapped .search-by-all {
  text-align: right;
  width: 50%;
  height: 63px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--white-color);
  padding-right: 30px;
}
transactions-mapped .transactions.hide {
  display: none;
}
transactions-mapped .transactions.hide-category {
  display: none;
}
transactions-mapped .actions {
  display: flex;
  width: 30px;
  position: relative;
  align-items: center;
}
transactions-mapped .actions .select-all {
  float: left;
  margin: 0px 17px !important;
  padding-top: 7px;
}
transactions-mapped .actions .ros {
  margin-right: 15px;
  width: 230px !important;
  index: 3;
  background-color: var(--gray-color7) !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  cursor: default;
  margin-top: 66px !important;
}
transactions-mapped .actions .checkbox {
  margin-top: 80px;
}
transactions-mapped .new-table .info .titles {
  font-family: "Rubik", sans-serif;
  font-size: 13px;
}
transactions-mapped .transactions .description, transactions-mapped .transactions .bank-name, transactions-mapped .transactions .month-year {
  font-size: 13px;
  font-family: "Rubik", sans-serif;
}
transactions-mapped .transactions .description {
  position: relative;
}
transactions-mapped .tooltip-desc {
  display: none;
  right: -200px;
  padding: 10px;
  line-height: 20px;
  word-break: break-all;
}
transactions-mapped .tooltip-desc .counterpart-name {
  word-break: break-all;
  white-space: unset;
}
transactions-mapped .hoverTooltip:hover .tooltip-desc {
  display: block;
}
transactions-mapped .transactions .month-year {
  white-space: nowrap;
  min-width: 85px;
  max-width: 85px;
  text-align: left;
  color: var(--gray-color11);
}
transactions-mapped .titleDesc {
  word-break: break-all;
  white-space: pre-wrap;
  display: inline-block;
}
transactions-mapped .central-part {
  margin-right: 17px;
  width: 102px;
}
transactions-mapped .central-part .map {
  width: 100px;
}
transactions-mapped .categories {
  margin-right: 17px;
  width: 337px;
}
transactions-mapped .search_inside {
  display: flex;
  align-items: center;
  float: right;
}
transactions-mapped .search_inside .search-form {
  margin-right: 10px;
  position: relative;
}
transactions-mapped .search_inside .search-form .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
}
transactions-mapped .hoverTooltip {
  cursor: pointer;
}
transactions-mapped .left-part {
  width: 72%;
  align-items: flex-start;
  display: flex;
  padding: 10px 0;
}
transactions-mapped .left-part.full {
  width: 100%;
}
transactions-mapped .popover-datepicker {
  position: absolute;
  top: -1px;
  left: 0;
  width: 270px;
  background-color: var(--white-color);
  z-index: 5;
  padding: 0 20px 20px;
  border: var(--default-border);
}
transactions-mapped .popover-datepicker .datepicker__wrapper {
  display: flex;
  justify-content: space-between;
}
transactions-mapped .popover-datepicker .mat-calendar-body-label {
  display: none !important;
}
transactions-mapped .mat-calendar-period-button {
  pointer-events: none;
}
transactions-mapped .mat-button-wrapper {
  pointer-events: none;
}
transactions-mapped .mat-button-wrapper .mat-calendar-arrow {
  display: none;
}
transactions-mapped .test {
  overflow: visible !important;
}
transactions-mapped .total-price {
  font-size: 13px;
  font-weight: 500;
  padding-right: 8px;
}
transactions-mapped .total-price .currency {
  font-size: 11px;
}
transactions-mapped .bank-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 170px;
  max-width: 170px;
}
transactions-mapped .loader {
  margin: 0 auto;
  width: 30px;
}
transactions-mapped .loader-accordion {
  width: 80px;
  height: 80px;
  border: 15px solid transparent;
}
transactions-mapped .page-loader {
  position: relative;
  top: 0;
  left: 0;
  width: 100px;
  height: 100px;
  margin: calc(50vh - 210px) auto;
}
transactions-mapped .pagination .pag-control {
  display: flex;
  width: 100% !important;
  justify-content: center;
  padding: 14px;
}
transactions-mapped .counterpart-name {
  font-weight: 500;
  color: var(--black-color0);
  word-break: break-all;
  display: inline-block;
}
transactions-mapped .trunc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
transactions-mapped .pagination .per-page {
  padding-left: 12px;
}
transactions-mapped .mat-select {
  color: var(--orange-color6) !important;
}
transactions-mapped .mat-select-trigger {
  color: var(--orange-color6) !important;
}
transactions-mapped .category-item {
  position: relative;
  transition: linear 0.2s;
  background: var(--white-color);
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: var(--border-radius);
}
transactions-mapped .category-item:not(:last-child) {
  margin-bottom: 8px;
}
transactions-mapped .category-item:last-child {
  margin-bottom: 0;
  border-bottom: none;
}
transactions-mapped .category-item:not(.opened):hover {
  background: var(--black-color4);
}
transactions-mapped .category-item.opened {
  height: 130px;
}
transactions-mapped .category-item.opened .chevron {
  transform: rotate(90deg);
}
transactions-mapped .category-item.opened.loaded {
  height: auto;
}
transactions-mapped .category-item .chevron {
  transition: linear 0.2s;
}
transactions-mapped .category-item .category-item--wrapper {
  display: flex;
  align-items: center;
  padding-left: 16px;
  gap: 8px;
}
transactions-mapped .category-item .category-item--wrapper .chevron {
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
}
transactions-mapped .category-item .category-item--wrapper ui-check-box .button {
  min-height: 24px;
  min-width: 24px;
  width: 24px;
  height: 24px;
}
transactions-mapped .category-item .title {
  align-items: center;
  justify-content: space-between;
  display: flex;
  color: var(--black-color0);
  cursor: pointer;
  padding: 11px 16px;
}
transactions-mapped .category-item .transactions.first-child row {
  border-top: 2px solid var(--default-border);
}
transactions-mapped .category-item .transactions .row {
  min-height: 60px;
  border-top: var(--default-border);
  position: relative;
  display: flex;
  align-items: flex-start;
  height: 100%;
  padding: 0 16px 16px 12px;
  gap: 16px;
  margin: 0 20px;
}
transactions-mapped .category-item .transactions .row.row-selected {
  background: var(--ultra-light-blue3);
}
transactions-mapped .category-item .transactions .row .mapped-checkbox {
  margin-top: 16px;
}
transactions-mapped .category-item .transactions .row .date {
  text-align: center;
  font-family: "Rubik", sans-serif;
  justify-content: center;
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
transactions-mapped .category-item .transactions .row .date .bank-name {
  display: none;
}
transactions-mapped .category-item .transactions .row .date .day {
  font-size: 18px;
}
transactions-mapped .category-item .transactions .row .account {
  text-align: left;
  flex-wrap: wrap;
  font-weight: normal;
  display: flex;
  align-items: center;
  margin-top: 20px;
}
transactions-mapped .category-item .transactions .row .info {
  flex-grow: 1;
  flex-basis: 300px;
  width: 0;
  min-width: 100px;
  text-align: left;
  display: flex;
  flex-direction: column;
  margin-top: 20px;
  gap: 8px;
}
transactions-mapped .category-item .transactions .row .amount {
  min-width: 135px;
  max-width: 135px;
  text-align: center;
  justify-content: flex-end;
  font-size: 13px;
  font-family: "Rubik", sans-serif;
  font-weight: 500;
  display: flex;
  align-items: flex-end;
  margin-top: 20px;
}
transactions-mapped .category-item .transactions .row .amount .currency {
  font-size: 11px;
  font-weight: 500;
  margin-right: 5px;
}
transactions-mapped .category-item .transactions .row .mapped-to, transactions-mapped .category-item .transactions .row .remap {
  width: 100px;
  margin: 0 10px;
  text-align: center;
}
transactions-mapped .category-item .transactions .row .map-to-category {
  width: 155px;
  margin: 0 20px;
  background: var(--white-color);
}
transactions-mapped .category-item .transactions .row .row-category {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-top: 10px;
  flex: 1;
  gap: 16px;
  min-width: 370px;
  max-width: 370px;
}
transactions-mapped .category-item .transactions .row .row-category ui-dropdown {
  max-width: calc(100% - 60px);
  display: block;
  flex: 1;
}
transactions-mapped .category-item .transactions .row .row-category ui-dropdown.disabled {
  opacity: 0.5;
}
transactions-mapped .category-item .transactions .row .row-category .map {
  border-radius: 20px;
  border: none;
}
transactions-mapped .category-item .transactions .row .row-category .loader {
  margin: 0 35px;
}
transactions-mapped .category-item .pagination-count {
  display: flex;
}
transactions-mapped .dropdown-tag .drp-label {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-mapped .dropdown-tag .drp-menu {
  width: 250px;
}
transactions-mapped .header-component .filter-all .other-filters .dropdown-tag .drp-menu .text-boxes {
  background: var(--white-color) !important;
}

.d-none {
  display: none !important;
}

@media screen and (max-width: 1400px) {
  transactions-mapped .date, transactions-mapped .amount, transactions-mapped .comment, transactions-mapped .account {
    margin-top: 0 !important;
  }
  transactions-mapped .transactions .row .account {
    display: none !important;
  }
  transactions-mapped .transactions .row .date {
    text-align: left;
    width: 130px;
  }
  transactions-mapped .transactions .row .date .bank-name {
    display: block;
    width: 100%;
    font-size: 11px;
    color: var(--gray-color3);
  }
  transactions-mapped .actions, transactions-mapped .list-split-transaction {
    display: block;
  }
}
@media screen and (max-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-block {
    display: block !important;
  }
  .dropdown {
    width: 104px !important;
  }
}
.mapped-checkbox {
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  border-radius: 5px;
  border: 1px solid var(--gray-color15);
  padding: 4px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-right: 20px;
}
.mapped-checkbox div {
  display: none;
  max-height: 100%;
  max-width: 100%;
  justify-content: center;
  align-items: center;
}
.mapped-checkbox.active {
  background: var(--green-color1);
  border-color: var(--green-color1);
  position: relative;
}
.mapped-checkbox.active:before {
  content: "";
  display: flex;
  height: 100%;
  width: 100%;
  background: url(/assets/images/icons_new_design/ico_white_check.svg) 50% 50% no-repeat var(--green-color1);
}
.mapped-checkbox.partial {
  background: var(--green-color1);
  border-color: var(--green-color1);
}
.mapped-checkbox.partial:before {
  content: "";
  padding: 1px 6px;
  background: var(--btn-green-color);
  border-radius: 1px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transactions-expected .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
  margin: 5px 10px 0;
}
transactions-expected .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 13px;
  height: 11px;
  cursor: pointer;
  background-image: url(/assets/images/icons/filter-variant-plus-blue.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}
transactions-expected ui-plug {
  padding: 0 25px;
}
transactions-expected .table {
  table-layout: fixed;
  width: 100%;
}
transactions-expected .table thead.stick-header {
  top: 60px !important;
}
transactions-expected .table tr td:first-child {
  padding-left: 2px !important;
}
transactions-expected .table .date-th .table-title, transactions-expected .table .sortable-align-right .table-title {
  justify-content: flex-end;
  padding: 0;
}
transactions-expected .table td {
  vertical-align: top;
}
transactions-expected .table td, transactions-expected .table th, transactions-expected .table app-th-sortable, transactions-expected .table app-th-sortable-muliple {
  padding: 19px 10px;
}
transactions-expected .table th {
  vertical-align: middle;
}
transactions-expected .table .th-checkbox {
  width: 30px;
  min-width: 30px;
  padding: 15px 20px;
}
transactions-expected .table .row-create td {
  vertical-align: top !important;
}
transactions-expected .table th {
  text-align: left;
  color: var(--black-color0);
  font-weight: 500;
}
transactions-expected .table th.left {
  text-align: left;
}
transactions-expected .table th.th-swipe {
  width: 10px;
  padding: 0;
  max-width: 10px;
}
transactions-expected .table tr.tr-selected {
  background: var(--ultra-light-blue3);
}
transactions-expected .table tr:last-child td.colorRow .status-color-wrapper {
  border-bottom-left-radius: 3px !important;
}
transactions-expected .table td:last-child {
  padding: 12px 10px;
}
transactions-expected .table td.category-title {
  width: 15% !important;
  position: relative;
}
transactions-expected .table td.category-title {
  padding: 10px 10px;
}
transactions-expected .table td.category-title .tooltip {
  top: -40px;
  left: 0;
}
transactions-expected .table td.category-title .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 15px;
  transform: rotate(180deg);
}
transactions-expected .table td .colored:hover + .wrapper-tooltip > .tooltip, transactions-expected .table td .tagName:hover + .wrapper-tooltip > .tooltip {
  display: block;
}
transactions-expected .table td.colorRow {
  height: 100%;
  position: relative;
  width: 10px;
  padding: 0;
}
transactions-expected .table td.colorRow .colored {
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
}
transactions-expected .table td .draggable-icon {
  left: 16px !important;
}
transactions-expected .table td.amount {
  font-size: 13px;
  color: var(--black-color0);
}
transactions-expected .table td.amount .text-highlighted {
  color: var(--blue-color3);
  cursor: pointer;
}
transactions-expected .table td .tag-wrapper .tag-1 {
  max-width: 100%;
}
transactions-expected .table td .tag-wrapper .tag-2 {
  max-width: 50%;
}
transactions-expected .table td .tag-wrapper .tag-3 {
  max-width: 34%;
}
transactions-expected .table td .tag-wrapper .tag-4 {
  max-width: 30%;
}
transactions-expected .table td.date {
  color: var(--gray-color3);
  text-align: right;
}
transactions-expected .table td.date .amount-content {
  padding: 20px;
}
transactions-expected .table td.date .text-highlighted {
  color: var(--blue-color3);
  cursor: pointer;
}
transactions-expected .table td.date .link {
  color: var(--blue-color3);
  cursor: pointer;
}
transactions-expected .table td.date .link:hover {
  color: var(--blue-color21);
}
transactions-expected .table td.date {
  width: 10%;
  position: relative;
}
transactions-expected .table td ui-overdue-chip {
  position: absolute;
  right: 0;
  padding-right: 10px;
  margin-top: 8px;
}
transactions-expected .table td .negative {
  color: var(--orange-color1);
}
transactions-expected .table td .positive {
  color: var(--green-color1);
}
transactions-expected .table td .dropdown {
  width: 100% !important;
  display: inline-block;
  vertical-align: top;
}
transactions-expected .table td .dropdown.colored {
  margin: 0;
  min-width: 125px;
}
transactions-expected .table .description-title {
  width: 15%;
}
transactions-expected .table .description-title .form-control {
  width: 100%;
  display: block !important;
  max-width: 300px;
}
transactions-expected .table .description-title .titleDesc {
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  max-height: 70px;
  word-wrap: break-word;
  display: -webkit-box;
}
transactions-expected .table .description-title .item-name {
  display: flex;
  align-items: center;
}
transactions-expected .table .description-title .item-name .reference {
  text-overflow: ellipsis;
  overflow: hidden;
}
transactions-expected .table .description-title .item-name .reference.touched {
  width: calc(100% - 20px);
}
transactions-expected .table .description-title .item-name .touched-invoice {
  margin-left: 10px;
  width: 10px;
  height: 10px;
  background: var(--green-color8);
  border-radius: 50%;
}
transactions-expected .table .right-align {
  text-align: right;
}
transactions-expected .table .status-color-wrapper {
  padding: 0;
  width: 5px;
}
transactions-expected .table .category-title {
  width: 22%;
}
transactions-expected .table .statuses {
  width: 145px;
  padding: 15px 10px;
  cursor: pointer;
}
transactions-expected .table .statuses .table-title {
  justify-content: center;
}
transactions-expected .table .status-drp-down {
  width: 100%;
}
transactions-expected .table .not-padding {
  padding: 10px;
}
transactions-expected .table .td-actions {
  width: 75px;
}
transactions-expected .table .actions {
  display: flex;
  margin: 0 auto;
  position: relative;
  align-items: center;
  justify-content: flex-end;
}
transactions-expected .table .actions .btn-edit-plan {
  border: 0;
  background: transparent;
}
transactions-expected .btn-billomat {
  margin-left: 20px;
}
transactions-expected .bulk-map {
  display: flex;
  align-items: center;
  height: 60px;
  margin: 0 25px;
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--ultra-light-blue1);
}
transactions-expected .bulk-map .delete-button {
  margin-left: 5px;
}
transactions-expected .bulk-map .map-selected-to {
  width: 100% !important;
  top: 0 !important;
}
transactions-expected .bulk-map .delete {
  width: 30px;
  height: 30px;
  cursor: pointer;
  background: url(/assets/images/icons/trashcan.svg) 50% 50% no-repeat;
  margin-left: 5px;
  border-radius: 20px;
  position: relative;
}
transactions-expected .bulk-map .delete:hover {
  background-color: var(--gray-color13);
}
transactions-expected .bulk-map .delete:hover .tooltip {
  display: block;
  bottom: calc(100% + 5px);
  left: 0;
}
transactions-expected .bulk-map .delete:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  top: auto;
  left: 11px;
  transform: rotate(180deg);
}
transactions-expected .confirm-delete .text-boxes {
  text-align: left;
}
transactions-expected .transaction-drp-down {
  font-size: 13px;
  height: 32px;
  font-weight: 400;
  position: relative;
  background: transparent;
  color: var(--black-color1);
  border: 1px solid var(--gray-color1);
  border-radius: var(--border-radius);
  width: 100%;
  display: flex;
  align-items: center;
  padding: 0 10px;
  cursor: pointer;
}
transactions-expected .transaction-drp-down .title-drp-down {
  width: 93%;
  overflow: hidden;
  white-space: nowrap;
  display: inline-block;
  text-overflow: ellipsis;
}
transactions-expected .transaction-drp-down .btn-down {
  font-size: 10px;
  right: 0;
  position: absolute;
  margin-right: 10px;
}
transactions-expected .date-sync {
  display: flex;
  margin-left: 20px;
  flex-direction: column;
  color: var(--gray-color1);
  font-size: 12px;
}
transactions-expected .date-sync .sync-row {
  display: flex;
  flex-wrap: wrap;
}
transactions-expected tr[draggable=false], transactions-expected tr[draggable=true] {
  transform: none !important;
}
transactions-expected .tooltip-actions-wrapper {
  display: flex;
  justify-content: flex-end;
}
transactions-expected .picker.blue, transactions-expected .picker.blue .ngx-datepicker {
  text-align: right;
}
transactions-expected .pagination-data {
  margin-left: 10px;
  margin-top: 10px;
  margin-bottom: 20px;
}
transactions-expected .sortable-ghost {
  background: var(--green-color10);
  cursor: move;
  color: var(--black-color0);
}
transactions-expected .setting-container .cog {
  cursor: pointer;
}
transactions-expected .item .drp-menu {
  width: auto;
}
transactions-expected .pagination-data .btn {
  background-color: var(--green-color1);
  color: var(--white-color);
  font-size: 13px;
}
transactions-expected ui-icon-hint {
  margin: 0 20px 0;
}
transactions-expected ui-icon-hint .tooltip {
  top: 100%;
  left: 0;
}
transactions-expected ui-icon-hint .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 5px;
}
transactions-expected .pagination {
  display: flex;
  flex-direction: row;
  text-align: center;
}
transactions-expected .pagination .pagination-count {
  margin: auto;
  display: flex;
}
transactions-expected .pagination .pagination-data {
  flex-grow: 1;
  margin-right: 64px;
}
transactions-expected .pagination .pag-control {
  padding-top: 14px;
}
transactions-expected .pagination .per-page {
  padding-left: 12px;
}
transactions-expected .header-component {
  display: flex;
  flex-direction: column;
}
transactions-expected .header-component .button .plus {
  display: inline-block;
  margin-right: 10px;
  font-size: 15px;
}
transactions-expected .header-component .button .plus {
  margin-top: -1px;
}
transactions-expected .header-component .item {
  position: relative;
}
transactions-expected .header-component .datepicker {
  margin-right: 5px;
}
transactions-expected .header-component .clicks {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 25px;
  margin: 10px 0;
}
transactions-expected .header-component .clicks .header-link-wrapper {
  width: 60%;
  font-weight: 500;
  margin-top: auto;
  margin-bottom: auto;
  display: flex;
  align-items: center;
}
transactions-expected .header-component .clicks .header-toggle-link {
  display: flex;
  position: relative;
  justify-content: flex-end;
  align-items: center;
}
transactions-expected .header-component .clicks .header-toggle-link .filter-input-wrapper {
  width: 320px;
}
transactions-expected .header-component .clicks .header-toggle-link ui-button {
  margin-left: 10px;
}
transactions-expected .header-component .clicks .filter-switch {
  text-transform: capitalize;
  background: url("/assets/images/icons_new_design/ico_filter.svg") 0 50% no-repeat;
  padding-left: 20px;
}
transactions-expected .header-component .filter-input-wrapper {
  width: 100%;
  position: relative;
}
transactions-expected .header-component .filter-input-wrapper .search-text {
  width: 100%;
}
transactions-expected .header-component .filter-input-wrapper .search-text input {
  background: var(--gray-color13);
  border-radius: 20px;
  border: none;
  height: 35px;
  color: var(--gray-color15);
}
transactions-expected .header-component .mat-form-field-appearance-fill .mat-form-field-flex {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
  justify-content: space-between;
  flex-direction: row-reverse;
}
transactions-expected .header-component .filter-all {
  width: 100%;
  display: flex;
  overflow: unset;
  transition: all ease-in 0.1s;
  padding: 0 25px;
}
transactions-expected .header-component .filter-all .mat-form-field-wrapper {
  padding: 0;
}
transactions-expected .header-component .filter-all .filter-btn-wrapper {
  display: flex;
}
transactions-expected .header-component .filter-all .filter-btn-wrapper .picker .ngx-datepicker {
  height: 35px;
  width: 220px;
}
transactions-expected .header-component .filter-all.hideFilter {
  height: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden !important;
}
transactions-expected .header-component .filter-all .reset {
  text-align: right;
}
transactions-expected .header-component .filter-all .reset a {
  font-weight: 400;
  font-size: 13px;
  color: var(--blue-color6);
  align-items: center;
  display: flex;
}
transactions-expected .header-component .filter-all .other-filters {
  display: flex;
  align-items: center;
}
transactions-expected .header-component .filter-all .other-filters .search-form {
  display: flex;
  align-items: center;
  flex-direction: column;
}
transactions-expected .header-component .filter-all .other-filters .search-form .filter-row {
  margin-right: auto;
}
transactions-expected .header-component .filter-all .other-filters .search-form .filter-row:first-child {
  padding-bottom: 5px;
}
transactions-expected .header-component .filter-all .other-filters .search-form .search-text {
  max-width: 160px;
}
transactions-expected .header-component .filter-all .other-filters .search-form .search-text .text-boxes {
  padding-right: 25px;
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-expected .header-component .filter-all .other-filters .search-form .filter {
  margin-left: 5px;
}
transactions-expected .header-component .filter-all .other-filters .search-form .drp-label {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
transactions-expected .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
transactions-expected .description .form-control {
  width: 100%;
  max-width: 300px;
}
transactions-expected .dropdown-tag {
  min-width: 200px;
}
transactions-expected .popover-datepicker {
  position: absolute;
  top: 10px;
  left: 0;
  width: 270px;
  background-color: var(--white-color);
  z-index: 5;
  padding: 0 20px 20px;
  border: var(--default-border);
}
transactions-expected .popover-datepicker .datepicker__wrapper {
  display: flex;
  justify-content: space-between;
}
transactions-expected .popover-datepicker .mat-calendar-body-label {
  display: none !important;
}
transactions-expected .mat-calendar-period-button {
  pointer-events: none;
}
transactions-expected .mat-button-wrapper {
  pointer-events: none;
}
transactions-expected .mat-button-wrapper .mat-calendar-arrow {
  display: none;
}
transactions-expected .page-loader {
  position: relative;
  top: 0;
  left: 0;
  width: 100px;
  height: 100px;
  margin: calc(50vh - 210px) auto;
}
transactions-expected .top-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
transactions-expected .top-wrapper > .button, transactions-expected .top-wrapper .button.upload {
  width: 126px;
  margin-top: -2px;
}
transactions-expected .uploader-wrapper {
  margin: 0;
  position: relative;
}
transactions-expected .uploader-wrapper input {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  opacity: 0;
  cursor: pointer;
}
transactions-expected .uploader-wrapper:hover .tooltip {
  display: block;
  bottom: calc(100% + 5px);
  left: 0;
}
transactions-expected .uploader-wrapper:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  top: auto;
  left: 19px;
  transform: rotate(180deg);
}
transactions-expected .file-upload-error {
  color: var(--orange-color1);
  margin-left: 30px;
}
transactions-expected .btn-wrapper {
  display: flex;
  position: relative;
  justify-content: space-between;
  align-items: center;
  padding: 20px 25px 0;
}
transactions-expected .btn-wrapper .button-section {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 20px;
}
transactions-expected .btn-wrapper .sync-section {
  min-width: 400px;
}
transactions-expected .btn-wrapper .sync-section .sync-row {
  justify-content: flex-end;
}
transactions-expected .btn-wrapper ui-text-button {
  width: 120px;
}
transactions-expected .status-color {
  padding: 0 0 0 13px;
  border-left: 5px solid transparent;
  position: relative;
  height: 68px;
}
transactions-expected .status-color > .inner, transactions-expected .status-color:before, transactions-expected .status-color:after {
  width: 3px;
  height: 3px;
  border-left: 2px solid var(--gray-color3);
  border-right: 1px solid var(--gray-color3);
  position: absolute;
  left: 10px;
}
transactions-expected .status-color > .inner {
  top: calc(50% - 1px);
}
transactions-expected .status-color:before {
  content: "";
  top: calc(50% - 8px);
}
transactions-expected .status-color:after {
  content: "";
  top: calc(50% + 6px);
}
transactions-expected #search-text-name {
  background: var(--gray-color13);
  border-radius: 20px;
  border: none;
  height: 35px;
  color: var(--gray-color5);
}
transactions-expected .counterpart-name {
  font-size: 13px;
  color: var(--black-color0);
  font-weight: 500;
  padding: 3px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  max-height: 73px;
  word-wrap: break-word;
}
transactions-expected .counterpart-name + .description {
  overflow: hidden;
  text-overflow: ellipsis;
}
transactions-expected tr.item-7 .reference, transactions-expected tr.item-7 .description, transactions-expected tr.item-7 .amount, transactions-expected tr.item-7 .date, transactions-expected tr.item-6 .reference, transactions-expected tr.item-6 .description, transactions-expected tr.item-6 .amount, transactions-expected tr.item-6 .date {
  opacity: 0.5;
}
transactions-expected app-datepicker {
  width: 100% !important;
  background: none;
  border: none;
  text-align: right;
}
transactions-expected app-datepicker .input-text {
  width: 100% !important;
}
transactions-expected .upload-xls-loader {
  width: auto;
}
transactions-expected .upload-xls-loader .loader {
  width: 20px;
  margin: 0 0 0 10px;
}
transactions-expected .upload-xls-loader .image-load {
  margin: -10px 0 0 -10px !important;
  width: 20px !important;
}
transactions-expected .loader-btn .image-load {
  margin: -12px 0 0 0px !important;
  width: 25px !important;
}

@media screen and (max-width: 1500px) {
  transactions-expected .responsive-width {
    width: 14%;
  }
}
@media screen and (max-width: 1280px) {
  transactions-expected .table th {
    padding: 15px 10px;
  }
  transactions-expected .table .comment-count {
    padding-left: 5px;
    position: absolute;
    top: -2px;
    left: 20px;
  }
  transactions-expected .table td {
    padding: 10px !important;
  }
}
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transaction-expected-dialog .dialog-inner {
  width: auto !important;
}
transaction-expected-dialog .close {
  z-index: 2;
}
transaction-expected-dialog .inner-content {
  display: flex;
  justify-content: flex-end;
  min-width: 650px;
  position: relative;
}
transaction-expected-dialog .dialog__content {
  min-width: 650px;
  max-width: 650px;
  height: 100vh;
  background: var(--menu-bg-color);
  overflow-y: scroll;
}
transaction-expected-dialog .dialog__content {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  transaction-expected-dialog .dialog__content { /* For Firefox */
    scrollbar-width: thin;
  }
}
transaction-expected-dialog .dialog__content::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
transaction-expected-dialog .dialog__content::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
transaction-expected-dialog .dialog__content::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
transaction-expected-dialog .comments {
  padding: 15px 20px;
}
transaction-expected-dialog .row {
  padding: 15px;
}
transaction-expected-dialog .split-section {
  padding: 0 20px;
}
transaction-expected-dialog .split-section .split-list {
  margin-top: 20px;
}
transaction-expected-dialog .split-section .split-list .split-header {
  padding: 15px 0;
}
transaction-expected-dialog .split-section .split-item-parent {
  margin-bottom: 15px;
}
transaction-expected-dialog .split-header {
  padding: 15px 20px;
}
transaction-expected-dialog .wrapper {
  height: 70px;
  display: flex;
  padding: 0 15px;
  flex: 1;
  align-items: center;
  justify-content: space-between;
}
transaction-expected-dialog .add-new-rule-wrapper {
  margin-left: 10px;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 50%;
  position: relative;
}
transaction-expected-dialog .add-new-rule-wrapper:hover .tooltip {
  display: block;
}
transaction-expected-dialog .add-new-rule-wrapper .wrapper {
  width: 100%;
  height: 100%;
  background: unset;
  padding: unset;
}
transaction-expected-dialog .add-new-rule-wrapper .wrapper .tooltip {
  left: -135px;
}
transaction-expected-dialog .add-new-rule-wrapper .wrapper .tooltip::after {
  left: 85%;
}
transaction-expected-dialog .date {
  width: 30%;
}
transaction-expected-dialog .testW {
  display: block;
}
transaction-expected-dialog .info {
  width: 38%;
}
transaction-expected-dialog .picker.disabled input, transaction-expected-dialog .picker.disabled label {
  pointer-events: none;
  cursor: default;
  opacity: 0.5;
}
transaction-expected-dialog .columns-3 {
  display: flex;
}
transaction-expected-dialog .columns-3 .form-control {
  width: 100px !important;
  flex-grow: unset !important;
}
transaction-expected-dialog .columns-3 .form-line:first-child {
  width: 33% !important;
}
transaction-expected-dialog .columns-3 .form-line:first-child.columns-2 {
  width: 70% !important;
  justify-content: flex-end;
}
transaction-expected-dialog .columns-3 .form-line:first-child.columns-2 .form-label {
  width: 110px;
}
transaction-expected-dialog .columns-3 .form-line:first-child.columns-2 a {
  font-weight: 500;
}
transaction-expected-dialog .columns-3 .form-line:first-child.columns-2 .counterpart {
  max-width: 120px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-right: 10px;
}
transaction-expected-dialog .columns-3 .form-line:first-child.columns-2 .date {
  max-width: 70px;
}
transaction-expected-dialog .columns-3 .form-line:not(:first-child) {
  width: 30% !important;
  justify-content: flex-end;
}
transaction-expected-dialog .columns-3 .form-line:not(:first-child) .form-label {
  margin-right: 6px;
  text-align: right;
}
transaction-expected-dialog .columns-3 .form-line:not(:first-child).second {
  width: 40% !important;
}
transaction-expected-dialog .columns-3 .form-line:not(:first-child).second .form-label {
  width: 115px;
}
transaction-expected-dialog .columns-2 {
  display: flex;
}
transaction-expected-dialog .columns-2 .form-line:first-child {
  width: 50% !important;
}
transaction-expected-dialog .columns-2 .form-line:not(:first-child) {
  width: 50% !important;
}
transaction-expected-dialog .columns-2 .form-line:not(:first-child) .form-label {
  margin-right: 16px;
  text-align: right;
}
transaction-expected-dialog .form-line .invoice-type {
  margin-right: 20px;
}
transaction-expected-dialog .form-line.desc {
  height: 70px;
}
transaction-expected-dialog .form-line textarea {
  border: var(--default-border) !important;
  border-radius: var(--border-radius);
  background: var(--white-color);
  justify-content: space-between;
  color: var(--gray-color5);
  resize: none;
  padding: 7px 10px !important;
  font-size: 13px;
  font-weight: 400;
  width: 100%;
}
transaction-expected-dialog .form-line textarea:focus {
  border-color: var(--blue-color3);
}
transaction-expected-dialog .form-line .dropdown {
  width: 100% !important;
  display: inline-block;
  vertical-align: top;
}
transaction-expected-dialog .form-line .dropdown.category .drp-menu {
  z-index: 15;
}
transaction-expected-dialog .form-line-error {
  height: auto !important;
  width: 100% !important;
  margin-bottom: 20px;
}
transaction-expected-dialog .form-line-error .error-summary {
  padding: 10px !important;
}
transaction-expected-dialog .tooltip {
  top: -40px;
  right: 0;
}
transaction-expected-dialog .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  right: 12px;
  transform: rotate(180deg);
}
transaction-expected-dialog .offset-item-wrapper {
  margin-bottom: 30px;
}
transaction-expected-dialog .bank-name {
  display: inline-block;
  width: 90%;
}
transaction-expected-dialog .label-purpose {
  padding-left: 8px;
}
transaction-expected-dialog .description {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
  display: inline-block;
}
transaction-expected-dialog .loader-wrapper {
  display: flex;
  margin-top: 20px;
  justify-content: center;
}
transaction-expected-dialog .counterpart-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
  display: inline-block;
}
transaction-expected-dialog .negative {
  display: flex;
  color: var(--orange-color1);
}
transaction-expected-dialog .positive {
  display: flex;
  color: var(--green-color1);
}
transaction-expected-dialog .check-amount, transaction-expected-dialog .amount, transaction-expected-dialog .actions {
  width: 16%;
}
transaction-expected-dialog .actions, transaction-expected-dialog .check-amount {
  display: flex;
  justify-content: flex-end;
  padding-right: 10px;
}
transaction-expected-dialog .check-amount {
  display: block;
}
transaction-expected-dialog .slider-item {
  padding: 0 20px;
}
transaction-expected-dialog .create {
  margin-right: 20px;
}
transaction-expected-dialog .btn-done {
  margin: 15px 0;
}
transaction-expected-dialog .createTransaction {
  border-bottom: var(--default-border);
}
transaction-expected-dialog .createTransaction .form-line {
  display: flex;
  align-items: center;
  height: 40px;
  position: relative;
}
transaction-expected-dialog .createTransaction .form-line .form-label {
  width: 90px;
  font-size: 13px;
  flex-shrink: 0;
}
transaction-expected-dialog .createTransaction .form-line .form-label.required {
  padding-left: 10px;
}
transaction-expected-dialog .createTransaction .form-line .form-label.required:before {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: -10px;
  margin-right: 4px;
}
transaction-expected-dialog .createTransaction .form-line .form-control {
  flex-grow: 1;
  flex-basis: 100px;
}
transaction-expected-dialog .form {
  padding: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
transaction-expected-dialog .form .buttons {
  justify-content: flex-end !important;
  margin: 15px 0;
  display: flex;
  align-items: center;
}
transaction-expected-dialog .form > .error {
  color: var(--orange-color1);
  margin: 0 0 5px 90px;
}
transaction-expected-dialog .form ui-overdue-chip {
  margin-top: 4px;
}
transaction-expected-dialog .file-upload-error {
  display: inline-block;
  color: var(--orange-color1);
  margin-top: 5px;
  line-height: 22px;
}
transaction-expected-dialog .file-upload-error span a {
  width: 50px;
}
transaction-expected-dialog .transaction-button-wrapper {
  display: flex;
}
transaction-expected-dialog .transaction-button-wrapper .delete {
  margin-right: 0;
}
transaction-expected-dialog .transaction-button-wrapper .cancel {
  width: 85px;
  margin-right: 10px;
}
transaction-expected-dialog .table-header {
  line-height: 17px;
  padding: 12px 10px !important;
  height: 44px;
  color: var(--black-color0);
  font-weight: 500;
  border-bottom: var(--default-border-header);
}
transaction-expected-dialog .form-line {
  display: flex;
  position: relative;
  flex-direction: column;
  width: calc(33% - 5px);
  margin-bottom: 15px;
}
transaction-expected-dialog .form-line.half-width {
  width: 50%;
}
transaction-expected-dialog .form-line.full-width {
  width: 100%;
}
transaction-expected-dialog .form-line.filler {
  width: auto;
  flex-grow: 2;
  margin-right: 10px;
}
transaction-expected-dialog .form-line.form-line-chips {
  margin-bottom: 0;
}
transaction-expected-dialog .form-line.form-line-chips .chip-name {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
}
transaction-expected-dialog .form-line.form-line-chips .mat-form-field-infix {
  padding: 0 !important;
  height: auto;
}
transaction-expected-dialog .form-line.form-line-chips .mat-form-field-flex {
  padding: 5px !important;
  border-radius: var(--border-radius) !important;
  height: auto;
}
transaction-expected-dialog .form-line.form-line-chips .mat-chip.mat-standard-chip {
  background-color: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color1);
  padding-top: 0;
  padding-bottom: 0;
  min-height: 21px;
  max-width: 100%;
  overflow: hidden;
}
transaction-expected-dialog .form-line .drp-label {
  border: var(--default-border) !important;
  border-radius: var(--border-radius) !important;
  background: var(--white-color) !important;
  justify-content: space-between !important;
  color: var(--menu-link-color) !important;
}
transaction-expected-dialog .form-line .drp-label.invalid {
  border-color: var(--orange-color1) !important;
}
transaction-expected-dialog .form-line .form-label {
  font-size: 13px;
  flex-shrink: 0;
  margin-bottom: 5px;
}
transaction-expected-dialog .form-line .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
transaction-expected-dialog .button-wrapper {
  display: flex;
  gap: 16px;
  justify-content: flex-end;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}
transaction-expected-dialog .button-wrapper.button-wrapper-second {
  padding: 10px 20px;
  margin-left: 0;
  margin-right: 0;
  width: 100%;
}
transaction-expected-dialog .button-wrapper .button-match {
  margin-right: auto;
}
transaction-expected-dialog .category-row {
  display: flex;
  flex-direction: column;
  padding: 20px 0;
  border-top: var(--default-border);
  border-bottom: var(--default-border);
  margin: 20px 35px;
}
transaction-expected-dialog .category-row .form-label {
  margin-bottom: 5px;
}
transaction-expected-dialog .category-row > div {
  display: flex;
}
transaction-expected-dialog .category-row > div .dropdown {
  width: 33%;
  margin-right: 10px;
}
transaction-expected-dialog .td-amount {
  text-align: end;
  color: var(--gray-color1);
  width: 200px;
}
transaction-expected-dialog .td-amount > * {
  cursor: pointer;
}
transaction-expected-dialog .td-amount.td-amount-manual {
  color: #00B7FF;
  padding: 17px 10px;
}
transaction-expected-dialog .td-amount.td-amount-manual .form-control {
  width: 90px;
}
transaction-expected-dialog .td-amount .cantEdit {
  color: var(--gray-color1);
}
transaction-expected-dialog .warning-manual-paid {
  width: 100%;
  padding: 5px;
  margin: 5px 0;
  text-align: center;
  color: var(--orange-color1);
  background: var(--white-color) 60000;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
}
transaction-expected-dialog .default-table tr:last-child td {
  border: none;
}
transaction-expected-dialog .buttons-row {
  padding: 0 20px;
  margin-bottom: 20px;
  margin-top: 30px;
}
transaction-expected-dialog .buttons-row > * {
  margin-right: 10px;
}
transaction-expected-dialog .buttons-row .side-title {
  font-size: 15px;
  font-weight: 500;
  color: var(--black-color0);
  margin-bottom: 15px;
}
transaction-expected-dialog .buttons-row .match-button-link {
  padding-left: 40px;
  background-image: url(/assets/images/icons_new_design/ico_link_white.png);
  background-position: 11px 50%;
  background-repeat: no-repeat;
  background-size: 20px auto;
}
transaction-expected-dialog .transactions-row {
  padding: 0 20px;
}
transaction-expected-dialog .transactions-row td {
  padding: 17px 0;
}
transaction-expected-dialog .transactions-row td:first-child {
  width: 90px;
  padding: 17px 10px;
}
transaction-expected-dialog .transactions-row td:last-child {
  padding-right: 10px;
}
transaction-expected-dialog .invoice-transactions {
  margin-top: 30px;
}
transaction-expected-dialog .invoice-transactions .header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
transaction-expected-dialog .invoice-transactions .header .title {
  font-size: 18px;
  font-weight: 500;
  color: var(--black-color0);
}
transaction-expected-dialog .invoice-transactions .header a {
  font-weight: 500;
}
transaction-expected-dialog .invoice-transactions .trx {
  border: 1px solid var(--gray-color16);
  border-radius: var(--border-radius);
  padding: 10px;
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
transaction-expected-dialog .invoice-transactions .trx .counterpart {
  margin: 10px 0;
}
transaction-expected-dialog .invoice-transactions .trx .counterpart, transaction-expected-dialog .invoice-transactions .trx .amount {
  font-size: 16px;
  font-weight: 500;
  color: var(--black-color0);
}
transaction-expected-dialog .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
  margin: 5px 10px 0;
}
transaction-expected-dialog .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 13px;
  height: 11px;
  cursor: pointer;
  background-image: url(/assets/images/icons/filter-variant-plus-blue.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}
transaction-expected-dialog .add-tag {
  border: none;
  font-weight: 500;
  cursor: pointer;
  font-size: 11px;
  line-height: 13px;
  color: var(--blue-color6);
  background: transparent;
}
transaction-expected-dialog .add-new-rule-wrapper .wrapper {
  border-bottom: none;
}
transaction-expected-dialog .preview {
  padding: 0 35px;
}
transaction-expected-dialog .preview .preview-header {
  margin-bottom: 35px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
transaction-expected-dialog .preview .preview-header .preview-header-dates {
  color: var(--gray-color1);
  font-size: 13px;
}
transaction-expected-dialog .preview .preview-header .preview-header-amounts {
  margin-top: 5px;
  color: var(--black-color0);
  font-weight: 500;
  font-size: 14px;
}
transaction-expected-dialog .preview .preview-header .preview-header-amounts span {
  color: var(--orange-color1);
  font-size: 24px;
}
transaction-expected-dialog .preview .preview-header .preview-header-status {
  padding: 8px 15px;
  border-radius: 20px;
  color: var(--white-color);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-1 {
  background: var(--orange-color1);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-2 {
  color: var(--green-color5);
  border: 1px solid #999;
  background: var(--white-color);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-3 {
  background: var(--green-color1);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-4 {
  background: var(--orange-color4);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-5 {
  background: var(--gray-color13);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-6 {
  background: var(--blue-color6);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-7 {
  background: var(--gray-color14);
  color: var(--gray-color11);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-8 {
  background: var(--black-color0);
}
transaction-expected-dialog .preview .preview-header .preview-header-status.sid-9 {
  background: var(--green-color2);
}
transaction-expected-dialog .preview .preview-data {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
transaction-expected-dialog .preview .preview-data .preview-data-name-meta {
  flex-grow: 2;
}
transaction-expected-dialog .preview .preview-data .preview-data-name-meta .preview-invoice-name {
  color: var(--gray-color5);
  font-weight: 500;
  margin-bottom: 15px;
}
transaction-expected-dialog .preview .preview-data .preview-data-name-meta .preview-invoice-meta {
  color: var(--gray-color1);
}
transaction-expected-dialog .preview .preview-data .preview-data-name-meta .preview-invoice-meta span {
  margin-right: 5px;
}
transaction-expected-dialog .preview .preview-data .preview-invoice-description {
  margin: 15px 0;
}
transaction-expected-dialog .preview .preview-data .preview-data-edit {
  width: 30px;
  text-align: center;
  cursor: pointer;
}
transaction-expected-dialog .preview .preview-data .preview-invoice-description,
transaction-expected-dialog .preview .preview-data .preview-invoice-tags {
  width: 100%;
}
transaction-expected-dialog .preview .preview-data .preview-invoice-tags {
  display: flex;
  margin: 15px 0;
  flex-wrap: wrap;
}
transaction-expected-dialog .preview .preview-data .preview-invoice-tags .tag {
  margin: 5px 5px 0 0;
  padding: 5px 10px;
}
transaction-expected-dialog .chips {
  width: 100%;
  height: 100%;
}
transaction-expected-dialog .chips .form-label {
  margin-top: 8px;
  margin-bottom: auto;
}
transaction-expected-dialog .chips .add-new-rule-wrapper {
  margin-bottom: auto;
}
transaction-expected-dialog .chips .mat-form-field-underline {
  display: none;
}
transaction-expected-dialog .chips .mat-form-field-wrapper {
  padding: 0 !important;
}
transaction-expected-dialog .chips .mat-form-field-flex {
  padding: 0 !important;
  display: flex;
}
transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix {
  padding: 0 !important;
  display: flex;
}
transaction-expected-dialog .chips input {
  border: none !important;
  color: #333 !important;
  padding: 0 10px !important;
  font-family: "Rubik", sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  height: 32px;
  transition: border-color linear 0.2s;
  flex: none !important;
  border-radius: var(--border-radius);
  margin: 0px !important;
}
transaction-expected-dialog .chips input::placeholder {
  font-style: italic;
  color: var(--default-input-placeholder-color);
  opacity: 1;
}
transaction-expected-dialog .chips .autocomplete-option {
  height: 32px !important;
  line-height: 15px !important;
  font-family: "Rubik", sans-serif !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}
transaction-expected-dialog .chips .mat-form-field-flex {
  padding: 0 !important;
  background-color: var(--white-color) !important;
  border-radius: var(--border-radius);
  border: var(--default-border);
  display: flex;
  height: 100% !important;
}
transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix {
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
  margin: auto;
  border: none;
  padding: 0;
  display: flex;
  padding-top: 8px;
  padding-left: 10px;
}
transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-start-wrapper, transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-end-wrapper {
  min-width: 77px;
  padding-left: 6px;
}
transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner {
  color: var(--black-color1);
  font-family: var(--default-font);
}
transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner.ng-invalid {
  color: var(--orange-color6) !important;
}
transaction-expected-dialog .chips .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner::placeholder {
  font-style: italic;
  color: var(--default-input-placeholder-color);
  opacity: 1;
}
transaction-expected-dialog .chips .mat-chip-list {
  width: 100%;
}
transaction-expected-dialog .chips .mat-chip-list.active {
  padding: 5px 10px 0px 10px;
}
transaction-expected-dialog .chips .mat-chip-ripple {
  opacity: 0;
}
transaction-expected-dialog .chips .mat-chip {
  font-size: 10px;
  font-weight: 500;
  font-family: "Rubik", sans-serif;
}
transaction-expected-dialog .chips .mat-chip.mat-standard-chip::after {
  background: none;
}
transaction-expected-dialog .chips .chip-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
transaction-expected-dialog .chips .mat-chip-remove, transaction-expected-dialog .chips .mat-icon {
  opacity: 1 !important;
  width: 14px !important;
  height: 14px !important;
  font-size: 14px !important;
  cursor: pointer;
  margin-bottom: 1px;
}
transaction-expected-dialog .chips .mat-standard-chip.mat-chip-with-trailing-icon {
  padding: 2px 5px;
  background: var(--gray-color13);
  color: var(--gray-color1);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 400;
}
transaction-expected-dialog .chips .mat-standard-chip .mat-chip-remove, transaction-expected-dialog .chips .mat-standard-chip .mat-chip-trailing-icon {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
transaction-expected-dialog .chips .mat-chip-with-trailing-icon {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}
transaction-expected-dialog .chips .mat-standard-chip {
  max-width: 200px;
  min-height: 18px;
}
transaction-expected-dialog ui-text-box.ng-invalid.ng-dirty input {
  border: 1px solid var(--orange-color6) !important;
}
transaction-expected-dialog .link-in-nav {
  margin-left: auto;
  margin-right: 25px;
  display: flex;
  align-items: center;
  color: var(--blue-color3);
  cursor: pointer;
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
}
transaction-expected-dialog .comments-activities__open {
  position: fixed;
  margin-left: -65px;
  left: 0;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-expected-matched .header-component {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 4;
}
app-expected-matched .header-component .button .plus {
  display: inline-block;
  margin-right: 10px;
  font-size: 15px;
}
app-expected-matched .header-component .button .plus {
  margin-top: -1px;
}
app-expected-matched .header-component .item:not(.filter-date) {
  position: relative;
}
app-expected-matched .header-component .hideFilter {
  height: 0 !important;
  overflow: hidden !important;
}
app-expected-matched .header-component .clicks {
  display: flex;
  align-items: center;
  padding: 25px;
}
app-expected-matched .header-component .clicks .header-link-wrapper {
  width: 65%;
  font-weight: 500;
}
app-expected-matched .header-component .clicks .header-toggle-link {
  width: 35%;
  display: flex;
  position: relative;
  align-items: center;
  justify-content: flex-end;
}
app-expected-matched .header-component .clicks .header-toggle-link .reset {
  padding-right: 0 !important;
}
app-expected-matched .header-component .clicks .header-toggle-link .reset a {
  display: flex;
  align-items: center;
}
app-expected-matched .header-component .clicks .header-toggle-link .filter-switch {
  text-transform: capitalize;
  background: url("/assets/images/icons_new_design/ico_filter.svg") 0 50% no-repeat;
  padding-left: 20px;
}
app-expected-matched .blue-text, app-expected-matched .text-tag, app-expected-matched planning-manage-budget .notifications .notification-item.info-message .icon, planning-manage-budget .notifications .notification-item.info-message app-expected-matched .icon {
  color: var(--blue-color6);
  cursor: pointer;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transactions-rules .pagination, invoices-rules .pagination {
  display: flex;
  flex-direction: row;
  text-align: center;
}
transactions-rules .pagination .pagination-count, invoices-rules .pagination .pagination-count {
  margin: auto;
  display: flex;
}
transactions-rules ui-plug > div, invoices-rules ui-plug > div {
  margin: 0 !important;
}
transactions-rules .pagination .pag-control, invoices-rules .pagination .pag-control {
  padding-top: 14px;
}
transactions-rules .pagination .per-page, invoices-rules .pagination .per-page {
  padding-left: 12px;
}
transactions-rules .pagination-data, invoices-rules .pagination-data {
  margin-left: 10px;
  margin-top: 10px;
  margin-bottom: 20px;
}
transactions-rules .pagination-data .btn, invoices-rules .pagination-data .btn {
  background-color: var(--green-color1);
  color: var(--white-color);
  font-size: 13px;
}
transactions-rules .pagination .pagination-count, invoices-rules .pagination .pagination-count {
  margin: auto;
}
transactions-rules .pagination .pagination-data, invoices-rules .pagination .pagination-data {
  flex-grow: 1;
  margin-right: 64px;
}
transactions-rules .table-wrap, invoices-rules .table-wrap {
  padding: 15px;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin: 0 25px;
}
transactions-rules .table-wrap .table, invoices-rules .table-wrap .table {
  width: 100%;
}
transactions-rules .table-wrap .table td, transactions-rules .table-wrap .table th, invoices-rules .table-wrap .table td, invoices-rules .table-wrap .table th {
  padding: 15px 20px;
  vertical-align: middle;
}
transactions-rules .table-wrap .table .th-checkbox, invoices-rules .table-wrap .table .th-checkbox {
  width: 30px;
  min-width: 30px;
  padding: 15px 20px;
}
transactions-rules .table-wrap .table .row-create td, invoices-rules .table-wrap .table .row-create td {
  vertical-align: top !important;
}
transactions-rules .table-wrap .table th, invoices-rules .table-wrap .table th {
  text-align: left;
  font-size: 13px;
  color: var(--black-color0);
  font-weight: 500;
}
transactions-rules .table-wrap .table th.left, invoices-rules .table-wrap .table th.left {
  text-align: left;
}
transactions-rules .table-wrap .table th.th-swipe, invoices-rules .table-wrap .table th.th-swipe {
  width: 10px;
  padding: 0;
  max-width: 10px;
}
transactions-rules .table-wrap .table tbody tr, invoices-rules .table-wrap .table tbody tr {
  border-bottom: var(--default-border);
}
transactions-rules .table-wrap .table .description-title, invoices-rules .table-wrap .table .description-title {
  width: 20%;
}
transactions-rules .table-wrap .table .description-title .form-control, invoices-rules .table-wrap .table .description-title .form-control {
  width: 100%;
  display: block !important;
  max-width: 300px;
}
transactions-rules .table-wrap .table .description-title .titleDesc, invoices-rules .table-wrap .table .description-title .titleDesc {
  text-overflow: ellipsis;
  overflow: hidden;
}
transactions-rules .table-wrap .table .right-align, invoices-rules .table-wrap .table .right-align {
  text-align: right;
}
transactions-rules .table-wrap .table .category-title, invoices-rules .table-wrap .table .category-title {
  width: 15%;
}
transactions-rules .table-wrap .table .status-drp-down, invoices-rules .table-wrap .table .status-drp-down {
  width: 100%;
}
transactions-rules .table-wrap .table .not-padding, invoices-rules .table-wrap .table .not-padding {
  padding: 10px;
}
transactions-rules .table-wrap .table td.actions, invoices-rules .table-wrap .table td.actions {
  padding: 5px;
}
transactions-rules .table-wrap .table td.actions .loader, invoices-rules .table-wrap .table td.actions .loader {
  margin-left: auto !important;
}
transactions-rules .table-wrap .table .rule-title, invoices-rules .table-wrap .table .rule-title {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  color: var(--black-color0);
}
transactions-rules .table-wrap .table th.actions, invoices-rules .table-wrap .table th.actions {
  padding-right: 25px;
  display: flex;
  justify-content: flex-end;
}
transactions-rules .table-wrap .table .wrapper-actions, invoices-rules .table-wrap .table .wrapper-actions {
  display: flex;
  margin-left: auto;
  position: relative;
  align-items: center;
  justify-content: flex-end;
  width: 120px;
}
transactions-rules .table-wrap .table .wrapper-actions .btn-edit-plan, invoices-rules .table-wrap .table .wrapper-actions .btn-edit-plan {
  border: 0;
  background: transparent;
}
transactions-rules .page-loader, invoices-rules .page-loader {
  position: relative;
  top: 0;
  left: 0;
  width: 100px;
  height: 100px;
  margin: calc(50vh - 210px) auto;
}
transactions-rules .actions-container, invoices-rules .actions-container {
  display: flex;
  align-items: center;
  padding: 0 25px;
  height: 75px;
  justify-content: space-between;
}
transactions-rules .actions-container .add-new-category, invoices-rules .actions-container .add-new-category {
  margin-right: 5px;
}
transactions-rules .actions-container .header-toggle-link, invoices-rules .actions-container .header-toggle-link {
  padding-bottom: 20px;
  padding-top: 23px;
  display: flex;
  position: relative;
  align-items: center;
  justify-content: flex-end;
}
transactions-rules .actions-container .header-toggle-link .filter-input-wrapper, invoices-rules .actions-container .header-toggle-link .filter-input-wrapper {
  width: 320px;
  position: relative;
}
transactions-rules .actions-container .header-toggle-link .filter-input-wrapper input, invoices-rules .actions-container .header-toggle-link .filter-input-wrapper input {
  background: var(--gray-color13);
  border-radius: 20px;
  border: none;
  height: 35px;
  color: var(--gray-color5);
}
transactions-rules .actions-container .header-toggle-link .filter-input-wrapper ui-text-box, invoices-rules .actions-container .header-toggle-link .filter-input-wrapper ui-text-box {
  width: 100%;
}
transactions-rules .add-button, invoices-rules .add-button {
  white-space: nowrap;
}
transactions-rules .grey-disabled, invoices-rules .grey-disabled {
  opacity: 0.5;
}
transactions-rules .action, invoices-rules .action {
  float: right;
  width: 142px;
  text-align: center;
}
transactions-rules .ui-icon-hint-wrapper .tooltip, invoices-rules .ui-icon-hint-wrapper .tooltip {
  position: absolute;
  left: 0;
  top: 100%;
}
transactions-rules .ui-icon-hint-wrapper .tooltip:after, invoices-rules .ui-icon-hint-wrapper .tooltip:after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 5px !important;
  transform: rotate(0deg);
}
transactions-rules .tags, invoices-rules .tags {
  width: calc(100% - 50px);
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin: 0 25px 15px 25px;
  padding: 15px 20px;
}
transactions-rules .tags .title, invoices-rules .tags .title {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  color: var(--black-color0);
  margin-bottom: 10px;
}
transactions-rules .tags .tag-list, invoices-rules .tags .tag-list {
  display: flex;
  flex-flow: wrap;
  gap: 15px;
}
transactions-rules .tags .tag-list.show-less, invoices-rules .tags .tag-list.show-less {
  min-height: 20px;
}
transactions-rules .tags .tag-wrapper, invoices-rules .tags .tag-wrapper {
  position: relative;
  cursor: pointer;
}
transactions-rules .tags .tag-wrapper:hover .tooltip, invoices-rules .tags .tag-wrapper:hover .tooltip {
  display: block;
  bottom: calc(100% + 5px);
  left: 0;
}
transactions-rules .tags .tag-wrapper:hover .tooltip:after, invoices-rules .tags .tag-wrapper:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 15px;
  transform: rotate(180deg);
}
transactions-rules .tags .toggle-link, invoices-rules .tags .toggle-link {
  margin-top: 5px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
transactions-rules-dialog .dialog-inner, invoices-rules-dialog .dialog-inner {
  width: auto !important;
}
@supports (display: grid) {
  transactions-rules-dialog .inner-content, invoices-rules-dialog .inner-content {
    display: grid;
    grid-template-columns: 450px 650px;
  }
  transactions-rules-dialog .hide-left .inner-content, invoices-rules-dialog .hide-left .inner-content {
    grid-template-columns: 650px;
  }
  transactions-rules-dialog .hide-left .inner-content .left-panel, invoices-rules-dialog .hide-left .inner-content .left-panel {
    display: none;
  }
}
@supports not (display: grid) {
  transactions-rules-dialog .inner-content, invoices-rules-dialog .inner-content {
    display: flex;
  }
  transactions-rules-dialog .inner-content .left-panel, invoices-rules-dialog .inner-content .left-panel {
    width: 450px;
  }
  transactions-rules-dialog .inner-content .right-panel, invoices-rules-dialog .inner-content .right-panel {
    width: 550px;
  }
  transactions-rules-dialog .hide-left .left-panel, invoices-rules-dialog .hide-left .left-panel {
    display: none;
  }
}
transactions-rules-dialog .inner-content .left-panel, invoices-rules-dialog .inner-content .left-panel {
  background: var(--ultra-light-blue1);
  overflow: auto;
}
transactions-rules-dialog .inner-content .left-panel, invoices-rules-dialog .inner-content .left-panel {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  transactions-rules-dialog .inner-content .left-panel, invoices-rules-dialog .inner-content .left-panel { /* For Firefox */
    scrollbar-width: thin;
  }
}
transactions-rules-dialog .inner-content .left-panel::-webkit-scrollbar, invoices-rules-dialog .inner-content .left-panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
transactions-rules-dialog .inner-content .left-panel::-webkit-scrollbar-track, invoices-rules-dialog .inner-content .left-panel::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
transactions-rules-dialog .inner-content .left-panel::-webkit-scrollbar-thumb, invoices-rules-dialog .inner-content .left-panel::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
transactions-rules-dialog .inner-content .right-panel, invoices-rules-dialog .inner-content .right-panel {
  height: 100%;
  background: var(--white-color);
}
transactions-rules-dialog .comments, invoices-rules-dialog .comments {
  padding: 15px 20px;
}
transactions-rules-dialog ui-plug, invoices-rules-dialog ui-plug {
  padding: 0;
}
transactions-rules-dialog ui-plug .plugInfo, invoices-rules-dialog ui-plug .plugInfo {
  margin: 20px 0 !important;
}
transactions-rules-dialog .rules-header, invoices-rules-dialog .rules-header {
  border-bottom: var(--default-border);
  display: flex;
  flex-direction: column;
  padding: 30px 35px;
}
transactions-rules-dialog .rules-header .form-line, invoices-rules-dialog .rules-header .form-line {
  margin: 35px 0 10px;
  flex-direction: column;
  align-items: flex-start;
}
transactions-rules-dialog .rules-header .header-wrapper, invoices-rules-dialog .rules-header .header-wrapper {
  display: flex;
}
transactions-rules-dialog .rules-header .header-wrapper a, invoices-rules-dialog .rules-header .header-wrapper a {
  margin-left: auto;
}
transactions-rules-dialog .button-line, invoices-rules-dialog .button-line {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}
transactions-rules-dialog .add-condition, invoices-rules-dialog .add-condition {
  border: none;
  font-weight: 500;
  cursor: pointer;
  font-size: 11px;
  line-height: 13px;
  color: var(--blue-color6);
  background: transparent;
}
transactions-rules-dialog .preview, invoices-rules-dialog .preview {
  margin-bottom: 10px;
}
transactions-rules-dialog .remove, invoices-rules-dialog .remove {
  right: 0;
  cursor: pointer;
  position: absolute;
}
transactions-rules-dialog .if-content, invoices-rules-dialog .if-content {
  padding: 25px 40px 0 40px;
}
transactions-rules-dialog .if-content .drp, invoices-rules-dialog .if-content .drp {
  flex: none !important;
  width: 40%;
  max-width: 300px;
}
transactions-rules-dialog .if-content .condition-label, invoices-rules-dialog .if-content .condition-label {
  color: var(--gray-color5);
  font-weight: 500;
  font-size: 15px;
  margin-right: 15px;
  line-height: 18px;
  white-space: nowrap;
}
transactions-rules-dialog .if-content .condition-label:last-child, invoices-rules-dialog .if-content .condition-label:last-child {
  margin-left: 15px;
}
transactions-rules-dialog .if-content .form-line:first-child .drp, invoices-rules-dialog .if-content .form-line:first-child .drp {
  width: 80px;
  min-width: auto;
}
transactions-rules-dialog .if-content .form-line:not(:first-child), invoices-rules-dialog .if-content .form-line:not(:first-child) {
  margin-top: 20px;
  justify-content: space-between;
}
transactions-rules-dialog .then-content, invoices-rules-dialog .then-content {
  padding: 25px 40px;
}
transactions-rules-dialog .then-content .drp, invoices-rules-dialog .then-content .drp {
  width: 40%;
  max-width: 300px;
}
transactions-rules-dialog .then-content .form-line:last-child, invoices-rules-dialog .then-content .form-line:last-child {
  justify-content: space-between;
}
transactions-rules-dialog .then-content .condition-label, invoices-rules-dialog .then-content .condition-label {
  color: var(--gray-color5);
  font-weight: 500;
  font-size: 15px;
  line-height: 18px;
}
transactions-rules-dialog .then-content .form-line .error, invoices-rules-dialog .then-content .form-line .error {
  color: var(--orange-color1);
  position: absolute;
  bottom: -15px;
  left: 0;
}
transactions-rules-dialog .sameRule, invoices-rules-dialog .sameRule {
  margin-top: 20px;
}
transactions-rules-dialog .row, invoices-rules-dialog .row {
  padding: 15px;
}
transactions-rules-dialog .split-section, invoices-rules-dialog .split-section {
  padding: 0 20px;
}
transactions-rules-dialog .split-section .split-list, invoices-rules-dialog .split-section .split-list {
  margin-top: 20px;
}
transactions-rules-dialog .split-section .split-list .split-header, invoices-rules-dialog .split-section .split-list .split-header {
  padding: 15px 0;
}
transactions-rules-dialog .split-section .split-item-parent, invoices-rules-dialog .split-section .split-item-parent {
  margin-bottom: 15px;
}
transactions-rules-dialog .split-header, invoices-rules-dialog .split-header {
  padding: 15px 20px;
}
transactions-rules-dialog .wrapper, invoices-rules-dialog .wrapper {
  height: 70px;
  display: flex;
  padding: 0 15px;
  flex: 1;
  align-items: center;
  justify-content: space-between;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
transactions-rules-dialog .date, invoices-rules-dialog .date {
  width: 30%;
}
transactions-rules-dialog .testW, invoices-rules-dialog .testW {
  display: block;
}
transactions-rules-dialog .info, invoices-rules-dialog .info {
  width: 38%;
}
transactions-rules-dialog .form-line .dropdown, invoices-rules-dialog .form-line .dropdown {
  width: 100% !important;
  display: inline-block;
  vertical-align: top;
}
transactions-rules-dialog .form-line .dropdown.category, invoices-rules-dialog .form-line .dropdown.category {
  z-index: 15;
}
transactions-rules-dialog .form-line-error, invoices-rules-dialog .form-line-error {
  height: auto !important;
}
transactions-rules-dialog .form-line-error .error-summary, invoices-rules-dialog .form-line-error .error-summary {
  padding: 10px !important;
}
transactions-rules-dialog .offset-item-wrapper, invoices-rules-dialog .offset-item-wrapper {
  margin-bottom: 30px;
}
transactions-rules-dialog .bank-name, invoices-rules-dialog .bank-name {
  display: inline-block;
  width: 90%;
}
transactions-rules-dialog .label-purpose, invoices-rules-dialog .label-purpose {
  padding-left: 8px;
}
transactions-rules-dialog .description, invoices-rules-dialog .description {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
  display: inline-block;
}
transactions-rules-dialog .loader-wrapper, invoices-rules-dialog .loader-wrapper {
  display: flex;
  margin-top: 20px;
  justify-content: center;
}
transactions-rules-dialog .counterpart-name, invoices-rules-dialog .counterpart-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 90%;
  display: inline-block;
}
transactions-rules-dialog .negative, invoices-rules-dialog .negative {
  display: flex;
  color: var(--orange-color1);
}
transactions-rules-dialog .positive, invoices-rules-dialog .positive {
  display: flex;
  color: var(--green-color1);
}
transactions-rules-dialog .check-amount, transactions-rules-dialog .amount, transactions-rules-dialog .actions, invoices-rules-dialog .check-amount, invoices-rules-dialog .amount, invoices-rules-dialog .actions {
  width: 16%;
}
transactions-rules-dialog .actions, transactions-rules-dialog .check-amount, invoices-rules-dialog .actions, invoices-rules-dialog .check-amount {
  display: flex;
  justify-content: flex-end;
  padding-right: 10px;
}
transactions-rules-dialog .check-amount, invoices-rules-dialog .check-amount {
  display: block;
}
transactions-rules-dialog .slider-item, invoices-rules-dialog .slider-item {
  padding: 0 20px;
}
transactions-rules-dialog .create, invoices-rules-dialog .create {
  margin-right: 20px;
}
transactions-rules-dialog .btn-done, invoices-rules-dialog .btn-done {
  margin: 15px 0;
}
transactions-rules-dialog .createTransaction, invoices-rules-dialog .createTransaction {
  border-bottom: var(--default-border);
}
transactions-rules-dialog .createTransaction .form-line, invoices-rules-dialog .createTransaction .form-line {
  display: flex;
  align-items: center;
  position: relative;
}
transactions-rules-dialog .createTransaction .form-line .form-label, invoices-rules-dialog .createTransaction .form-line .form-label {
  font-size: 13px;
  flex-shrink: 0;
  margin-bottom: 10px;
}
transactions-rules-dialog .createTransaction .form-line .form-label.required, invoices-rules-dialog .createTransaction .form-line .form-label.required {
  padding-left: 10px;
}
transactions-rules-dialog .createTransaction .form-line .form-label.required:before, invoices-rules-dialog .createTransaction .form-line .form-label.required:before {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: -10px;
  margin-right: 4px;
}
transactions-rules-dialog .createTransaction .form-line .form-control, invoices-rules-dialog .createTransaction .form-line .form-control {
  flex-grow: 1;
  flex-basis: 100px;
}
transactions-rules-dialog .form .buttons, invoices-rules-dialog .form .buttons {
  justify-content: flex-end !important;
  display: flex;
  align-items: center;
  padding: 10px 40px 20px 10px;
}
transactions-rules-dialog .form .buttons .cancel, invoices-rules-dialog .form .buttons .cancel {
  width: 110px;
  margin-right: 10px;
}
transactions-rules-dialog .form .buttons .save, invoices-rules-dialog .form .buttons .save {
  width: 175px;
}
transactions-rules-dialog .form > .error, invoices-rules-dialog .form > .error {
  color: var(--orange-color1);
  margin: 0 0 5px 90px;
}
transactions-rules-dialog .file-upload-error, invoices-rules-dialog .file-upload-error {
  display: inline-block;
  color: var(--orange-color1);
  margin-top: 5px;
  line-height: 22px;
}
transactions-rules-dialog .file-upload-error span a, invoices-rules-dialog .file-upload-error span a {
  width: 50px;
}
transactions-rules-dialog .transaction-button-wrapper, invoices-rules-dialog .transaction-button-wrapper {
  display: flex;
}
transactions-rules-dialog .transaction-button-wrapper .delete, invoices-rules-dialog .transaction-button-wrapper .delete {
  margin-right: 0;
}
transactions-rules-dialog .transaction-button-wrapper .cancel, invoices-rules-dialog .transaction-button-wrapper .cancel {
  width: 85px;
  margin-right: 10px;
}
transactions-rules-dialog .form-line, invoices-rules-dialog .form-line {
  display: flex;
  align-items: center;
  position: relative;
  justify-content: space-between;
}
transactions-rules-dialog .form-line .form-control, invoices-rules-dialog .form-line .form-control {
  width: 40%;
  max-width: 300px;
}
transactions-rules-dialog .form-line .form-label, invoices-rules-dialog .form-line .form-label {
  font-size: 13px;
  flex-shrink: 0;
  margin-bottom: 10px;
}
transactions-rules-dialog .form-line .form-label.required:after, invoices-rules-dialog .form-line .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
transactions-rules-dialog .button-wrapper, invoices-rules-dialog .button-wrapper {
  display: flex;
  justify-content: space-between;
  padding-top: 20px;
}
transactions-rules-dialog .button-wrapper ui-text-button, invoices-rules-dialog .button-wrapper ui-text-button {
  width: 150px;
}
transactions-rules-dialog .category-wrapper, invoices-rules-dialog .category-wrapper {
  position: relative;
}
transactions-rules-dialog .transactions-table, invoices-rules-dialog .transactions-table {
  border-top: var(--default-border);
  padding: 20px 38px !important;
  width: 100%;
  overflow: hidden;
}
transactions-rules-dialog .transactions-table .no-new-transactions, invoices-rules-dialog .transactions-table .no-new-transactions {
  margin: 0;
}
transactions-rules-dialog .transactions-table .transactions-title, invoices-rules-dialog .transactions-table .transactions-title {
  margin: 0 0px 10px 0px;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: var(--black-color0);
}
transactions-rules-dialog .transactions-table .pagination, invoices-rules-dialog .transactions-table .pagination {
  display: flex;
  justify-content: center;
  margin: 10px 0;
}
transactions-rules-dialog .transactions-table .body, invoices-rules-dialog .transactions-table .body {
  border: var(--default-border);
  overflow-y: auto;
  max-height: 350px;
}
transactions-rules-dialog .transactions-table .body, invoices-rules-dialog .transactions-table .body {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  transactions-rules-dialog .transactions-table .body, invoices-rules-dialog .transactions-table .body { /* For Firefox */
    scrollbar-width: thin;
  }
}
transactions-rules-dialog .transactions-table .body::-webkit-scrollbar, invoices-rules-dialog .transactions-table .body::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
transactions-rules-dialog .transactions-table .body::-webkit-scrollbar-track, invoices-rules-dialog .transactions-table .body::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
transactions-rules-dialog .transactions-table .body::-webkit-scrollbar-thumb, invoices-rules-dialog .transactions-table .body::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
transactions-rules-dialog .transactions-table .body .transaction, invoices-rules-dialog .transactions-table .body .transaction {
  display: flex;
  align-items: center;
  height: 70px !important;
  border-bottom: var(--default-border);
  background: var(--white-color);
}
transactions-rules-dialog .transactions-table .body .transaction:last-child, invoices-rules-dialog .transactions-table .body .transaction:last-child {
  border-bottom: none;
}
transactions-rules-dialog .transactions-table .body .transaction .cell, invoices-rules-dialog .transactions-table .body .transaction .cell {
  color: var(--gray-color3);
}
transactions-rules-dialog .transactions-table .body .transaction .cell.date, invoices-rules-dialog .transactions-table .body .transaction .cell.date {
  padding-left: 20px;
  width: 20%;
}
transactions-rules-dialog .transactions-table .body .transaction .cell.date .month-year, invoices-rules-dialog .transactions-table .body .transaction .cell.date .month-year {
  font-size: 13px;
  line-height: 15px;
}
transactions-rules-dialog .transactions-table .body .transaction .cell.info, invoices-rules-dialog .transactions-table .body .transaction .cell.info {
  width: 60% !important;
  text-align: left;
  display: flex;
  flex-direction: column;
}
transactions-rules-dialog .transactions-table .body .transaction .cell.info .tags, invoices-rules-dialog .transactions-table .body .transaction .cell.info .tags {
  margin: 5px 0;
}
transactions-rules-dialog .transactions-table .body .transaction .cell.info .name, invoices-rules-dialog .transactions-table .body .transaction .cell.info .name {
  font-weight: 500;
  color: var(--black-color0);
}
transactions-rules-dialog .transactions-table .body .transaction .cell.info .description, transactions-rules-dialog .transactions-table .body .transaction .cell.info .name, invoices-rules-dialog .transactions-table .body .transaction .cell.info .description, invoices-rules-dialog .transactions-table .body .transaction .cell.info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
transactions-rules-dialog .transactions-table .body .transaction .cell.amount, invoices-rules-dialog .transactions-table .body .transaction .cell.amount {
  flex-grow: 1;
  padding: 0 20px;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  color: var(--black-color0);
}
@media screen and (max-width: 1050px) {
  transactions-rules-dialog .transactions-table, invoices-rules-dialog .transactions-table {
    max-width: unset;
    width: 100%;
  }
}
transactions-rules-dialog ui-confirm-dialog .content, invoices-rules-dialog ui-confirm-dialog .content {
  padding: 0;
}
transactions-rules-dialog ui-confirm-dialog .unsubscribe, invoices-rules-dialog ui-confirm-dialog .unsubscribe {
  margin: 0 35px 20px;
}
transactions-rules-dialog .form-line-chips, invoices-rules-dialog .form-line-chips {
  max-width: 100%;
  width: 100%;
  margin-top: 10px;
}
transactions-rules-dialog .form-line-chips .removeTag, invoices-rules-dialog .form-line-chips .removeTag {
  font-size: 16px;
  color: var(--orange-color1);
  line-height: 35px;
  position: absolute;
  right: -20px;
  cursor: pointer;
}
transactions-rules-dialog .form-line-chips .mat-form-field-wrapper, invoices-rules-dialog .form-line-chips .mat-form-field-wrapper {
  padding-bottom: 0;
}
transactions-rules-dialog .form-line-chips .mat-chip-ripple, invoices-rules-dialog .form-line-chips .mat-chip-ripple {
  opacity: 0;
}
transactions-rules-dialog .form-line-chips .mat-form-field, invoices-rules-dialog .form-line-chips .mat-form-field {
  width: 100%;
  max-width: 100%;
}
transactions-rules-dialog .form-line-chips .mat-form-field-flex, invoices-rules-dialog .form-line-chips .mat-form-field-flex {
  padding: 5px !important;
  border-radius: 5px !important;
  height: auto;
  min-height: 32px;
}
transactions-rules-dialog .form-line-chips .mat-form-field-infix, invoices-rules-dialog .form-line-chips .mat-form-field-infix {
  padding: 0 !important;
  height: auto !important;
}
transactions-rules-dialog .form-line-chips .mat-chip, invoices-rules-dialog .form-line-chips .mat-chip {
  font-size: 10px;
  font-weight: 500;
  font-family: "Rubik", sans-serif;
}
transactions-rules-dialog .form-line-chips .mat-chip.mat-standard-chip::after, invoices-rules-dialog .form-line-chips .mat-chip.mat-standard-chip::after {
  background: none;
}
transactions-rules-dialog .form-line-chips .chip-name, invoices-rules-dialog .form-line-chips .chip-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
transactions-rules-dialog .form-line-chips .mat-standard-chip.mat-chip-with-trailing-icon, invoices-rules-dialog .form-line-chips .mat-standard-chip.mat-chip-with-trailing-icon {
  padding: 2px 5px;
  background: var(--gray-color13);
  color: var(--gray-color1);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 400;
}
transactions-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-remove, transactions-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-trailing-icon, invoices-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-remove, invoices-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-trailing-icon {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
transactions-rules-dialog .form-line-chips .mat-chip-with-trailing-icon, invoices-rules-dialog .form-line-chips .mat-chip-with-trailing-icon {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}
transactions-rules-dialog .form-line-chips .mat-standard-chip, invoices-rules-dialog .form-line-chips .mat-standard-chip {
  max-width: 200px;
  min-height: 18px;
}
transactions-rules-dialog .form-line-chips .mat-chip-ripple, invoices-rules-dialog .form-line-chips .mat-chip-ripple {
  opacity: 0;
}
transactions-rules-dialog .form-line-chips .mat-chip, invoices-rules-dialog .form-line-chips .mat-chip {
  font-size: 10px;
  font-weight: 500;
  font-family: "Rubik", sans-serif;
}
transactions-rules-dialog .form-line-chips .mat-chip.mat-standard-chip::after, invoices-rules-dialog .form-line-chips .mat-chip.mat-standard-chip::after {
  background: none;
}
transactions-rules-dialog .form-line-chips .chip-name, invoices-rules-dialog .form-line-chips .chip-name {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
transactions-rules-dialog .form-line-chips .mat-chip-remove, transactions-rules-dialog .form-line-chips .mat-icon, invoices-rules-dialog .form-line-chips .mat-chip-remove, invoices-rules-dialog .form-line-chips .mat-icon {
  opacity: 1 !important;
  width: 14px;
  height: 14px;
  font-size: 14px !important;
  cursor: pointer;
  margin-bottom: 1px;
}
transactions-rules-dialog .form-line-chips .mat-standard-chip.mat-chip-with-trailing-icon, invoices-rules-dialog .form-line-chips .mat-standard-chip.mat-chip-with-trailing-icon {
  padding: 2px 5px;
  background: var(--gray-color13);
  color: var(--gray-color1);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 400;
}
transactions-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-remove, transactions-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-trailing-icon, invoices-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-remove, invoices-rules-dialog .form-line-chips .mat-standard-chip .mat-chip-trailing-icon {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
transactions-rules-dialog .form-line-chips .mat-chip-with-trailing-icon, invoices-rules-dialog .form-line-chips .mat-chip-with-trailing-icon {
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}
transactions-rules-dialog .form-line-chips .mat-chip-remove, invoices-rules-dialog .form-line-chips .mat-chip-remove {
  width: 20px !important;
  height: 20px !important;
}
transactions-rules-dialog .form-line-chips .mat-standard-chip, invoices-rules-dialog .form-line-chips .mat-standard-chip {
  max-width: 200px;
  min-height: 18px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-matched .pagination .pag-control {
  display: flex;
  width: 100% !important;
  justify-content: center;
  padding-top: 14px;
}
app-matched ui-plug {
  padding: 0 20px;
}
app-matched .left-part-header, app-matched .right-part-header, app-matched .left-part, app-matched .right-part, app-matched .filter-btn-wrapper .left-part, app-matched .filter-btn-wrapper .right-part {
  width: 45% !important;
}
app-matched .center-part-header, app-matched .center-part, app-matched .filter-btn-wrapper .center-part {
  width: 10% !important;
}
app-matched .filter-all {
  width: 100%;
  display: flex;
  align-items: center;
  overflow: unset;
  z-index: 2;
  transition: all ease-in 0.1s;
  padding: 0 20px;
  margin: 10px 0;
}
app-matched .filter-all .filter-btn-wrapper {
  display: flex;
}
app-matched .filter-all .reset {
  text-align: right;
  padding-bottom: 20px;
}
app-matched .filter-all .reset a {
  font-weight: 500;
  font-size: 11px;
  color: var(--blue-color3);
}
app-matched .filter-all .other-filters {
  display: flex;
  align-items: center;
  width: 100%;
  float: right;
}
app-matched .filter-all .other-filters .search-form {
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 100%;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:first-child {
  display: flex;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .item-filter {
  position: relative;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .item-filter:first-child {
  width: 30%;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .item-filter:nth-child(2) {
  width: 40%;
  padding: 0 5px;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .item-filter:last-child {
  width: 30%;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:last-child {
  width: 50%;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter {
  position: relative;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter:first-child {
  width: 25%;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter:nth-child(2) {
  padding: 0 5px;
  width: 200px;
}
app-matched .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter:last-child {
  width: 50%;
}
app-matched .filter-all .other-filters .search-form .search-text {
  width: 100%;
}
app-matched .filter-all .other-filters .search-form .text-boxes {
  padding-right: 25px;
  border: none;
  background: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color5);
}
app-matched app-datepicker {
  background: none;
  border: none;
}
app-matched .input-text {
  width: 100% !important;
  margin: 0 !important;
  border: none;
  background: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color15);
}
app-matched .body-row {
  display: flex;
  margin-bottom: 15px;
}
app-matched .titleDesc {
  text-overflow: ellipsis;
  overflow: hidden;
}
app-matched .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 10;
}
app-matched .body-header .col-inv-due-amount, app-matched .body-header .col-trx-amount, app-matched .body-header .col-inv-outstanding {
  padding-right: 20px;
  text-align: right;
}
app-matched .matched-body {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin-bottom: 8px;
}
app-matched .body-header .row,
app-matched .matched-body .row {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  align-items: flex-start;
  flex-wrap: wrap;
}
app-matched .body-header .row .expand-button,
app-matched .matched-body .row .expand-button {
  width: 2%;
  padding: 2px 0;
  text-align: center;
  cursor: pointer;
}
app-matched .body-header .row .expand-button .button,
app-matched .matched-body .row .expand-button .button {
  transform: rotate(-90deg);
}
app-matched .body-header .row .expand-button .button.expanded,
app-matched .matched-body .row .expand-button .button.expanded {
  transform: rotate(0deg);
}
app-matched .body-header .row .col-trx-account, app-matched .body-header .row .col-invoice-id, app-matched .body-header .row .title,
app-matched .matched-body .row .col-trx-account,
app-matched .matched-body .row .col-invoice-id,
app-matched .matched-body .row .title {
  text-overflow: ellipsis;
  overflow: hidden;
}
app-matched .body-header .row .col-invoice-date,
app-matched .matched-body .row .col-invoice-date {
  width: 5%;
}
app-matched .body-header .row .col-invoice-id,
app-matched .matched-body .row .col-invoice-id {
  width: 7%;
  padding: 9px 0;
}
app-matched .body-header .row .col-inv-expected,
app-matched .matched-body .row .col-inv-expected {
  width: 8%;
  padding: 9px 0;
}
app-matched .body-header .row .col-inv-due-amount,
app-matched .matched-body .row .col-inv-due-amount {
  width: 9%;
  padding: 9px 0;
}
app-matched .body-header .row .col-inv-outstanding,
app-matched .matched-body .row .col-inv-outstanding {
  width: 10%;
  padding: 9px 0;
}
app-matched .body-header .row .col-inv-description,
app-matched .matched-body .row .col-inv-description {
  word-break: break-all;
}
app-matched .body-header .row .col-inv-description,
app-matched .body-header .row .col-trx-description,
app-matched .matched-body .row .col-inv-description,
app-matched .matched-body .row .col-trx-description {
  width: 12%;
  padding: 9px 0;
}
app-matched .body-header .row .col-inv-description .title,
app-matched .body-header .row .col-trx-description .title,
app-matched .matched-body .row .col-inv-description .title,
app-matched .matched-body .row .col-trx-description .title {
  font-weight: 500;
  font-size: 13px;
  color: var(--gray-color5);
  width: 100%;
}
app-matched .body-header .row .col-trx-description,
app-matched .matched-body .row .col-trx-description {
  word-break: break-word;
}
app-matched .body-header .row .button-unmatch,
app-matched .matched-body .row .button-unmatch {
  min-width: 50px;
  width: 4%;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
app-matched .body-header .row .button-unmatch .button,
app-matched .matched-body .row .button-unmatch .button {
  width: 100%;
  max-width: 48px;
}
app-matched .body-header .row .button-unmatch:hover .tooltip,
app-matched .matched-body .row .button-unmatch:hover .tooltip {
  display: block;
  bottom: calc(100% + 5px);
  left: 0;
}
app-matched .body-header .row .button-unmatch:hover .tooltip:after,
app-matched .matched-body .row .button-unmatch:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  top: auto;
  left: 19px;
  transform: rotate(180deg);
}
app-matched .body-header .row .col-trx-amount,
app-matched .matched-body .row .col-trx-amount {
  padding: 9px 0;
  width: 7%;
}
app-matched .body-header .row .col-trx-date,
app-matched .body-header .row .col-trx-account,
app-matched .matched-body .row .col-trx-date,
app-matched .matched-body .row .col-trx-account {
  padding: 9px 0;
  width: 12%;
}
app-matched .body-header .row .col-inv-due-amount, app-matched .body-header .row .col-trx-amount, app-matched .body-header .row .col-inv-outstanding,
app-matched .matched-body .row .col-inv-due-amount,
app-matched .matched-body .row .col-trx-amount,
app-matched .matched-body .row .col-inv-outstanding {
  padding-right: 20px;
}
app-matched .body-header .row .col-inv-date,
app-matched .matched-body .row .col-inv-date {
  padding: 9px 0;
  width: 7%;
}
app-matched .body-header .row .col-trx-checkbox,
app-matched .matched-body .row .col-trx-checkbox {
  width: 50px;
  padding: 9px 15px;
}
app-matched .body-header {
  font-weight: 500;
  background-color: var(--ultra-light-blue1);
  margin-bottom: 1px;
  color: var(--black-color0);
}
app-matched .matched-body .row.row-main.expanded {
  border-bottom: var(--default-border);
}
app-matched .matched-body .row.row-secondary.hide {
  display: none;
}
app-matched .matched-body .row.row-secondary.selected-row {
  background: var(--ultra-light-blue3);
}
app-matched .matched-body .row .col-inv-expected {
  color: var(--blue-color6);
}
app-matched .matched-body .row .col-inv-due-amount,
app-matched .matched-body .row .col-trx-amount {
  font-weight: 500;
  color: var(--gray-color5);
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
app-matched .matched-body .row .col-inv-outstanding {
  color: var(--orange-color1);
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
app-matched .row-main .visible-part {
  display: flex;
}
app-matched .row-main .visible-part .invoice-info, app-matched .row-main .visible-part .invoice-additional {
  width: 100%;
  display: flex;
  align-self: center;
}
app-matched .row-main .visible-part .invoice-info {
  justify-content: space-between;
}
app-matched .row-main .visible-part .invoice-additional {
  justify-content: flex-end;
  margin-bottom: 20px;
}
app-matched .row-main .visible-part .invoice-additional .outstanding {
  width: 36%;
  padding: 0 10px;
  display: flex;
  justify-content: space-between;
  color: var(--red-color);
  font-weight: 500;
}
app-matched .row-main .visible-part .invoice-additional .outstanding .sum {
  font-weight: 500;
}
app-matched .row-main .visible-part-1 {
  border-bottom: var(--default-border);
}
app-matched .row-main .visible-part-2 .row-item {
  justify-content: center;
}
app-matched .row-main.row-header {
  display: flex;
}
app-matched .row-main .hidden-part {
  display: flex;
  justify-content: center;
  border-top: var(--default-border);
  line-height: 26px;
  color: var(--blue-color3);
  cursor: pointer;
  font-size: 12px;
}
app-matched .row-main .hidden-part span {
  display: inline-block;
}
app-matched .body-content {
  width: calc(100% - 50px);
  margin: 0 auto;
}
app-matched .body-content .left-part {
  display: flex;
}
app-matched .body-content .left-part .row-item-main {
  width: 100%;
}
app-matched .body-content .left-part .ref-number {
  text-overflow: ellipsis;
  overflow: hidden;
  min-width: 90px;
  margin-bottom: 5px;
}
app-matched .body-content .left-part .description {
  width: 44%;
  text-align: left;
  padding: 10px;
}
app-matched .body-content .left-part .description .item-name {
  text-transform: capitalize;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  display: inline-block;
  font-weight: 500;
  color: var(--link-color-active);
}
app-matched .body-content .left-part .amount {
  width: 36%;
  text-align: right;
  padding: 10px;
  font-weight: 500;
  font-size: 12px;
  align-self: end;
}
app-matched .body-content .left-part .amount > div {
  margin: 20px 0;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  line-height: 1;
}
app-matched .body-content .left-part .amount > div .title {
  color: var(--gray-color3);
  font-weight: 500;
}
app-matched .body-content .left-part .amount > div .sum {
  color: var(--black-color0);
  font-weight: 500;
}
app-matched .body-content .left-part .date {
  width: 20%;
  text-align: left;
  padding: 0 10px;
  min-width: 85px;
  font-weight: 500;
  align-self: start;
}
app-matched .body-content .left-part .row-item {
  width: 100%;
  flex-direction: column;
}
app-matched .body-content .center-part {
  width: 10%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
app-matched .body-content .center-part .button-section {
  display: flex;
  align-items: center;
  cursor: pointer;
  height: 100%;
  justify-content: center;
}
app-matched .body-content .center-part .button-section .hide-text {
  visibility: hidden;
  position: absolute;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
}
app-matched .body-content .center-part .button-section span {
  font-size: 18px;
  color: var(--blue-color3);
  padding: 5px 18px;
  border: 1px solid var(--blue-color3);
  border-radius: var(--border-radius);
}
app-matched .body-content .right-part {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
app-matched .body-content .right-part .account {
  width: 25%;
  padding: 0 10px;
}
app-matched .body-content .right-part .row-item-main {
  display: flex;
  width: 100%;
}
app-matched .body-content .right-part .description {
  width: 35%;
  padding: 10px;
}
app-matched .body-content .right-part .description .item-name {
  text-transform: capitalize;
  display: inline-block;
  text-overflow: ellipsis;
  overflow: hidden;
  font-weight: 500;
  width: 100%;
  color: var(--link-color-active);
}
app-matched .body-content .right-part .date {
  padding: 0 10px;
  width: 20%;
}
app-matched .body-content .right-part .amount {
  padding-right: 15px !important;
  text-align: right;
  width: 20%;
  font-weight: 500;
}
app-matched .body-content .right-part .row-item {
  width: 100%;
}
app-matched .link:hover span {
  background: var(--blue-color3);
  color: var(--white-color) !important;
}
app-matched .text-overflow {
  text-overflow: ellipsis;
  width: 100%;
  overflow: hidden;
  display: inline-block;
}
app-matched .row-item {
  min-height: 64px;
  border-radius: var(--border-radius);
  align-items: center;
  font-size: 12px;
  display: flex;
}
app-matched .left-part-header {
  font-size: 12px;
  display: flex;
  font-weight: 500;
}
app-matched .left-part-header .ref-number {
  width: 16%;
  padding-left: 15px;
  max-width: 90px;
  min-width: 90px;
}
app-matched .left-part-header .description {
  width: 44%;
  padding: 0 10px;
  text-align: left;
}
app-matched .left-part-header .amount-header {
  width: 36%;
  padding: 0 15px;
  text-align: right;
}
app-matched .left-part-header .date {
  width: 20%;
  padding: 0 10px;
  text-align: left;
}
app-matched .left-part-header .item-header {
  width: 100%;
  display: flex;
}
app-matched .center-part-header {
  width: 10%;
}
app-matched .right-part-header {
  position: relative;
  align-items: center;
  display: flex;
  font-size: 12px;
  font-weight: 500;
  justify-content: space-between;
}
app-matched .right-part-header .account {
  width: 25%;
  padding: 0 10px;
}
app-matched .right-part-header .description {
  width: 35%;
  padding: 0 10px;
}
app-matched .right-part-header .date {
  width: 20%;
  padding: 0 10px;
}
app-matched .right-part-header .amount-header {
  width: 20%;
  padding: 0 15px;
  text-align: right;
}
app-matched .disabled {
  opacity: 0.5;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-matching-suggested .padding-filed {
  padding: 0 10px;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  text-transform: capitalize;
}
app-matching-suggested ui-plug {
  padding: 0 25px;
}
app-matching-suggested .header-title {
  width: 100%;
  display: flex;
  padding: 0 25px;
}
app-matching-suggested .header-title .title-item {
  width: 50%;
  font-weight: 500;
  font-size: 14px;
}
app-matching-suggested .titleDesc {
  text-overflow: ellipsis;
  overflow: hidden;
}
app-matching-suggested .body-header {
  display: flex;
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: var(--ultra-light-blue1);
  margin-bottom: 1px;
}
app-matching-suggested .pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
}
app-matching-suggested .filter-all {
  width: 100%;
  display: flex;
  align-items: center;
  overflow: unset;
  z-index: 2;
  transition: all ease-in 0.1s;
  padding: 0 25px;
  margin: 10px 0;
}
app-matching-suggested .filter-all .filter-btn-wrapper {
  display: flex;
}
app-matching-suggested .filter-all .reset {
  text-align: right;
  padding-bottom: 20px;
}
app-matching-suggested .filter-all .reset a {
  font-weight: 500;
  font-size: 11px;
  color: var(--blue-color3);
}
app-matching-suggested .filter-all .other-filters {
  display: flex;
  align-items: center;
  width: 100%;
  float: right;
}
app-matching-suggested .filter-all .other-filters .search-form {
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 100%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child {
  width: 50%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .left-part {
  width: 85%;
  display: flex;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .left-part .item-filter {
  position: relative;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .left-part .item-filter:first-child {
  width: 30%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .left-part .item-filter:nth-child(2) {
  width: 40%;
  padding: 0 5px;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .left-part .item-filter:last-child {
  width: 30%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:first-child .connect-part {
  width: 15%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:last-child {
  width: 50%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter {
  position: relative;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter:first-child {
  width: 25%;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter:nth-child(2) {
  width: 25%;
  padding: 0 5px;
}
app-matching-suggested .filter-all .other-filters .search-form .filter-btn-wrapper:last-child .item-filter:last-child {
  width: 50%;
}
app-matching-suggested .filter-all .other-filters .search-form .search-text {
  width: 100%;
}
app-matching-suggested .filter-all .other-filters .search-form .text-boxes {
  padding-right: 25px;
  border: none;
  background: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color5);
}
app-matching-suggested app-datepicker {
  background: none;
  border: none;
}
app-matching-suggested .input-text {
  width: 100% !important;
  margin: 0 !important;
  border: none;
  background: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color15);
}
app-matching-suggested .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 10;
}
app-matching-suggested .loading {
  height: 160px;
}
app-matching-suggested .loading:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--white-color5);
}
app-matching-suggested .row-main {
  margin-bottom: 8px;
  display: flex;
}
app-matching-suggested .body-content {
  width: calc(100% - 50px);
  margin: 0 auto 0 auto;
}
app-matching-suggested .body-content .left-part {
  width: 50%;
  position: relative;
}
app-matching-suggested .body-content .left-part .oneToOne {
  height: 100%;
}
app-matching-suggested .body-content .left-part .oneToOne .row-item {
  height: 100%;
}
app-matching-suggested .body-content .left-part .ref-number {
  width: 16%;
  text-overflow: ellipsis;
  overflow: hidden;
  padding: 9px 5px 9px 15px;
}
app-matching-suggested .body-content .left-part .description {
  width: 39%;
  padding: 9px 10px;
  text-align: left;
}
app-matching-suggested .body-content .left-part .description .item-name {
  text-overflow: ellipsis;
  width: 100%;
  overflow: hidden;
  display: inline-block;
  font-weight: 500;
  color: var(--link-color-active);
}
app-matching-suggested .body-content .left-part .amount {
  width: 25%;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  padding: 9px 15px !important;
}
app-matching-suggested .body-content .left-part .date {
  width: 20%;
  text-align: left;
  min-width: 85px;
  padding: 9px 10px;
}
app-matching-suggested .body-content .left-part .row-item {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
app-matching-suggested .body-content .right-part {
  width: 50%;
  align-items: center;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
app-matching-suggested .body-content .right-part .select {
  width: 10%;
  padding: 9px 0;
}
app-matching-suggested .body-content .right-part .select.hidden-suggested {
  visibility: hidden;
}
app-matching-suggested .body-content .right-part .account {
  padding: 9px 10px;
  width: 20%;
}
app-matching-suggested .body-content .right-part .description {
  width: 35%;
  padding: 9px 10px;
}
app-matching-suggested .body-content .right-part .description .item-name {
  text-transform: capitalize;
  text-overflow: ellipsis;
  width: 100%;
  overflow: hidden;
  display: inline-block;
  font-weight: 500;
  color: var(--link-color-active);
}
app-matching-suggested .body-content .right-part .date {
  width: 20%;
  padding: 9px 10px;
}
app-matching-suggested .body-content .right-part .amount {
  width: 15%;
  text-align: right;
  font-weight: 500;
  padding: 9px 15px !important;
}
app-matching-suggested .body-content .right-part .row-item:not(:last-child) {
  border-bottom: var(--default-border);
}
app-matching-suggested .item-wrapper {
  display: flex;
}
app-matching-suggested .item-wrapper .row-item {
  width: 85%;
}
app-matching-suggested .item-wrapper .button-section {
  width: 15%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
app-matching-suggested .item-wrapper .button-section .button {
  padding: 5px 18px;
  position: relative;
}
app-matching-suggested .item-wrapper .button-section .button:hover .tooltip {
  display: block;
  bottom: calc(100% + 5px);
  left: 0;
}
app-matching-suggested .item-wrapper .button-section .button:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  top: auto;
  left: 19px;
  transform: rotate(180deg);
}
app-matching-suggested .item-wrapper .button-section .disabled-link {
  padding: 6px 18px;
  border: 1px solid var(--blue-color4);
  border-radius: var(--border-radius);
  color: var(--blue-color4);
  cursor: pointer;
}
app-matching-suggested .item-wrapper .button-section .icon {
  font-size: 18px;
}
app-matching-suggested .item-wrapper .button-section .link {
  cursor: pointer;
  font-size: 18px;
  color: var(--blue-color3);
  padding: 5px 18px;
  border: 1px solid var(--blue-color3);
  border-radius: var(--border-radius);
  display: inline-block;
  height: 32px;
}
app-matching-suggested .row-item {
  min-height: 64px;
  font-size: 13px;
  display: flex;
  align-items: flex-start;
  padding: 10px 0;
}
app-matching-suggested .row-item.row-item_selected {
  background: var(--ultra-light-blue3);
  border-radius: inherit;
}
app-matching-suggested .link {
  width: 60%;
}
app-matching-suggested .left-part-header {
  width: 50%;
  display: flex;
  font-weight: 500;
}
app-matching-suggested .left-part-header .ref-number {
  width: 16%;
  padding: 9px 5px 9px 15px;
  text-overflow: ellipsis;
  overflow: hidden;
}
app-matching-suggested .left-part-header .description {
  width: 39%;
  text-align: left;
}
app-matching-suggested .left-part-header .amount-header {
  width: 25%;
  text-align: right;
  padding: 0 15px !important;
}
app-matching-suggested .left-part-header .date {
  width: 20%;
  text-align: left;
}
app-matching-suggested .left-part-header .item-header {
  width: 85%;
  display: flex;
  text-transform: capitalize;
}
app-matching-suggested .left-part-header .button-section {
  width: 15%;
}
app-matching-suggested .right-part-header {
  width: 50%;
  position: relative;
  align-items: center;
  display: flex;
  justify-content: space-between;
  font-weight: 500;
}
app-matching-suggested .right-part-header .select {
  width: 10%;
}
app-matching-suggested .right-part-header .account {
  width: 20%;
}
app-matching-suggested .right-part-header .description {
  width: 35%;
}
app-matching-suggested .right-part-header .date {
  width: 20%;
}
app-matching-suggested .right-part-header .amount-header {
  width: 15%;
  text-align: right;
  padding: 0 15px !important;
}
app-matching-suggested .select {
  display: flex;
  justify-content: center;
}
app-matching-suggested .disabled {
  opacity: 0.5;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-manual-search app-datepicker {
  width: 100% !important;
}
app-manual-search ui-plug {
  padding: 0 25px;
}
app-manual-search .clicks {
  display: flex;
  align-items: center;
  padding: 25px 0 5px 0;
  justify-content: space-between;
}
app-manual-search .clicks .header-toggle-link {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: flex-end;
}
app-manual-search .header-title {
  width: 100%;
  display: flex;
  z-index: 3;
  background: var(--ultra-light-blue1);
}
app-manual-search .header-title .title-item {
  width: 50%;
  font-weight: 500;
  font-size: 14px;
}
app-manual-search ui-plug .plugInfo {
  margin: 0 !important;
}
app-manual-search .search-form {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin: 10px 0;
  z-index: 3;
  background: var(--ultra-light-blue1);
}
app-manual-search .search-form .filter-btn-wrapper:first-child {
  width: 50%;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .left-part {
  width: 85%;
  display: flex;
  gap: 5px;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .left-part .filter-input-wrapper {
  height: 35px;
  position: relative;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .left-part .filter-input-wrapper:first-child {
  width: 70px;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .left-part .filter-input-wrapper:nth-child(2) {
  width: 30%;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .left-part .filter-input-wrapper:nth-child(3) {
  width: 30%;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .left-part .filter-input-wrapper:last-child {
  width: 30%;
}
app-manual-search .search-form .filter-btn-wrapper:first-child .connect-part {
  width: 15%;
}
app-manual-search .search-form .filter-btn-wrapper:last-child {
  width: 50%;
  display: flex;
  min-height: 35px;
  gap: 5px;
}
app-manual-search .search-form .filter-btn-wrapper:last-child .item {
  position: relative;
}
app-manual-search .search-form .filter-btn-wrapper:last-child .item:first-child, app-manual-search .search-form .filter-btn-wrapper:last-child .item:nth-child(2) {
  flex: 1;
}
app-manual-search .search-form .filter-btn-wrapper:last-child .item:last-child {
  min-width: 40% !important;
}
app-manual-search .search-form .search-text {
  width: 100%;
  max-width: unset !important;
}
app-manual-search .search-form .text-boxes {
  padding-right: 25px;
  border: none;
  background: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color5);
}
app-manual-search .search-form .filter-btn-wrapper {
  display: flex;
  flex-wrap: wrap;
}
app-manual-search .search-form .reset {
  text-align: right;
  padding-bottom: 20px;
}
app-manual-search .search-form .reset a {
  font-weight: 500;
  font-size: 11px;
  color: var(--blue-color3);
}
app-manual-search app-datepicker {
  background: none;
  border: none;
}
app-manual-search .input-text {
  width: 100% !important;
  margin: 0 !important;
  border: none;
  background: var(--gray-color13);
  border-radius: 20px;
  color: var(--gray-color15);
}
app-manual-search .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 10;
}
app-manual-search .pagination {
  display: flex;
  justify-content: center;
  margin: 20px 0;
}
app-manual-search .body-header {
  display: flex;
  padding-top: 15px;
  padding-bottom: 15px;
  background: transparent;
  margin-bottom: 1px;
}
app-manual-search .body-header.stick-header {
  top: 73px;
}
app-manual-search .body-content {
  max-width: calc(100% - 50px);
  width: 1400px;
  padding: 0 25px;
}
app-manual-search .body-content .body-row {
  display: flex;
}
app-manual-search .body-content .left-part {
  width: 50%;
  position: relative;
}
app-manual-search .body-content .left-part.paddingRight {
  padding-right: 25px;
}
app-manual-search .body-content .left-part ui-plug {
  padding: 0;
}
app-manual-search .body-content .left-part .no-new-transactions {
  width: 85%;
}
app-manual-search .body-content .left-part .connect-part {
  width: 15%;
}
app-manual-search .body-content .left-part .select {
  width: 10%;
}
app-manual-search .body-content .left-part .ref-number {
  width: 16%;
  text-align: left;
  padding: 19px 10px 19px 0;
  text-overflow: ellipsis;
  overflow: hidden;
}
app-manual-search .body-content .left-part .description {
  width: 34%;
  text-align: left;
  padding: 19px 10px;
}
app-manual-search .body-content .left-part .amount {
  width: 20%;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  padding: 19px 15px !important;
}
app-manual-search .body-content .left-part .date {
  width: 20%;
  text-align: left;
  min-width: 85px;
  padding: 19px 10px;
}
app-manual-search .body-content .right-part {
  width: 50%;
  align-items: center;
  justify-content: space-between;
}
app-manual-search .body-content .right-part ui-plug {
  padding: 0;
}
app-manual-search .body-content .right-part .select {
  width: 10%;
}
app-manual-search .body-content .right-part .account {
  width: 20%;
  padding: 19px 10px;
}
app-manual-search .body-content .right-part .description {
  width: 35%;
  padding: 19px 10px;
}
app-manual-search .body-content .right-part .date {
  width: 20%;
  padding: 19px 10px;
}
app-manual-search .body-content .right-part .amount {
  width: 15%;
  padding: 19px 15px 19px 0;
  font-weight: 500;
  text-align: right;
}
app-manual-search .left-part .no-new-transactions, app-manual-search .right-part .no-new-transactions {
  margin: 0;
}
app-manual-search .left-part .row-item.row-item_selected, app-manual-search .right-part .row-item.row-item_selected {
  background: var(--ultra-light-blue3);
}
app-manual-search .item-name {
  text-overflow: ellipsis;
  width: 100%;
  overflow: hidden;
  display: inline-block;
}
app-manual-search .item-wrapper {
  display: flex;
}
app-manual-search .item-wrapper .row-item {
  width: 85%;
}
app-manual-search .item-wrapper .button-section {
  width: 15%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
app-manual-search .item-wrapper .button-section .button {
  padding: 5px 18px;
  position: relative;
}
app-manual-search .item-wrapper .button-section .button:hover .tooltip {
  display: block;
  bottom: calc(100% + 5px);
  left: 0;
}
app-manual-search .item-wrapper .button-section .button:hover .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  top: auto;
  left: 19px;
  transform: rotate(180deg);
}
app-manual-search .item-wrapper .button-section .button.disabled .icon {
  color: var(--gray-color14);
}
app-manual-search .item-wrapper .button-section .button.btnLoad {
  border: none;
}
app-manual-search .item-wrapper .button-section .icon {
  font-size: 18px;
}
app-manual-search .item-wrapper .button-section .link {
  cursor: pointer;
  border: 1px solid var(--blue-color4);
  color: var(--blue-color4);
  padding: 5px 18px;
  line-height: 1;
  border-radius: var(--border-radius);
}
app-manual-search .description .item-name {
  text-overflow: ellipsis;
  width: 100%;
  overflow: hidden;
  display: inline-block;
  font-weight: 500;
  color: var(--link-color-active);
}
app-manual-search .titleDesc {
  text-overflow: ellipsis;
  overflow: hidden;
}
app-manual-search .row-item {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  align-items: flex-start;
  font-size: 13px;
  margin-bottom: 8px;
  display: flex;
}
app-manual-search .row-item .select {
  padding: 19px 0;
}
app-manual-search .left-part-header {
  width: 50%;
  font-weight: 500;
  display: flex;
}
app-manual-search .left-part-header .select {
  width: 10%;
}
app-manual-search .left-part-header .ref-number {
  width: 16%;
  padding-right: 10px;
  text-align: left;
}
app-manual-search .left-part-header .description {
  width: 34%;
  padding: 0 10px;
  text-align: left;
}
app-manual-search .left-part-header .amount-header {
  width: 20%;
  padding: 0 15px 0 10px;
  text-align: right;
}
app-manual-search .left-part-header .date {
  width: 20%;
  padding: 0 10px;
  text-align: left;
}
app-manual-search .left-part-header .item-header {
  width: 85%;
  display: flex;
}
app-manual-search .left-part-header .button-section {
  width: 15%;
}
app-manual-search .right-part-header {
  font-weight: 500;
  width: 50%;
  position: relative;
  align-items: center;
  display: flex;
  justify-content: space-between;
}
app-manual-search .right-part-header .select {
  width: 10%;
}
app-manual-search .right-part-header .account {
  width: 20%;
  padding: 0 10px;
}
app-manual-search .right-part-header .description {
  width: 35%;
  padding: 0 10px;
}
app-manual-search .right-part-header .date {
  width: 20%;
  padding: 0 10px;
}
app-manual-search .right-part-header .amount-header {
  width: 15%;
  padding: 0 15px;
  text-align: right;
}
app-manual-search .select {
  display: flex;
  justify-content: center;
}
app-manual-search .disabled {
  opacity: 0.5;
}

.manual-search__header-top {
  max-width: calc(100% - 50px);
  width: 1400px;
  padding: 0 25px;
}
.manual-search__header-sticky {
  max-width: calc(100% - 50px);
  width: 1400px;
  padding: 0 25px;
}
.manual-search__header-sticky__box {
  position: sticky;
  z-index: 4;
  padding-top: 20px;
  top: 0;
}
.manual-search__header-sticky__box.stuck {
  background: var(--ultra-light-blue1);
  box-shadow: 0 4px 10px -4px var(--shadow-color1);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
setup-company-info {
  display: block;
}
setup-company-info .hasNote {
  margin-bottom: 0 !important;
}
setup-company-info .logo {
  height: 188px;
  width: 188px;
  margin: 20px;
  display: flex;
  align-items: center;
  background-size: contain;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: center;
  border: 1px dashed var(--gray-color18);
}
setup-company-info .content-container {
  display: flex;
  margin-top: 15px;
}
setup-company-info .uploader {
  padding-left: 20px;
  width: 210px;
}
setup-company-info .fields-wrapper {
  flex-grow: 1;
}
setup-company-info .fields-wrapper ui-text-box, setup-company-info .fields-wrapper ui-dropdown {
  display: block;
}
setup-company-info .setup-wrapper {
  padding: 0 7px 0 17px;
}
setup-company-info .setup-wrapper .item {
  display: inline-block;
  vertical-align: top;
  width: calc(50% - 28px);
  margin: 0 13px 17px;
}
setup-company-info .buttons-wrapper .btn-save {
  margin-left: auto;
}
setup-company-info .item-toggle {
  display: flex !important;
}
setup-company-info .item-toggle .toggle {
  margin-top: auto;
}
setup-company-info .item-toggle ui-icon-hint {
  margin-bottom: auto;
}
setup-company-info .form-label {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 3px;
  margin-right: 5px;
  color: var(--gray-color1);
}
setup-company-info .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
setup-company-info .error-summary {
  background: var(--orange-color2);
  padding: 5px;
}
setup-company-info .error-message {
  color: var(--orange-color1);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
setup-connected-accounts .card-header {
  display: flex;
  flex-direction: row !important;
  justify-content: space-between;
  align-items: center;
}
setup-connected-accounts .connected-accounts-table-wrapper {
  clear: both;
  padding: 15px 15px 40px;
}
setup-connected-accounts .connected-accounts-table-wrapper tr td {
  vertical-align: top;
}
setup-connected-accounts ui-plug {
  margin: 0 20px;
}
setup-connected-accounts .card-title {
  margin-bottom: 0 !important;
}
setup-connected-accounts .default-table {
  color: var(--black-color0);
  width: 100%;
}
setup-connected-accounts .default-table td.balance {
  min-width: 180px;
  max-width: 180px;
}
setup-connected-accounts .default-table td:last-child {
  padding: 10px 0;
}
setup-connected-accounts .default-table td span {
  overflow-wrap: anywhere;
}
setup-connected-accounts .default-table .nowrap {
  white-space: nowrap;
}
setup-connected-accounts .default-table .col-allies {
  min-width: 170px;
  max-width: 200px;
}
setup-connected-accounts .default-table .col-allies .justify {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
setup-connected-accounts .default-table .col-allies .justify span {
  word-break: break-all;
}
setup-connected-accounts .default-table .col-allies .justify .icon-wrapper {
  justify-content: flex-end;
  width: 50px;
}
setup-connected-accounts .default-table .account-actions {
  text-align: right;
}
setup-connected-accounts .default-table .account-actions .wrapper {
  align-items: center;
  justify-content: flex-start;
}
setup-connected-accounts .default-table .bank-name {
  font-weight: 500;
}
setup-connected-accounts .default-table .upcase-l, setup-connected-accounts .default-table .popover-title .text, .popover-title setup-connected-accounts .default-table .text, setup-connected-accounts .default-table app-settings-bank-accounts .sub-block-title, app-settings-bank-accounts setup-connected-accounts .default-table .sub-block-title, setup-connected-accounts .default-table app-settings-bank-accounts .accounts-sub-tile, app-settings-bank-accounts setup-connected-accounts .default-table .accounts-sub-tile {
  font-weight: 500;
}
setup-connected-accounts .default-table .upcase-l.edit-col, setup-connected-accounts .default-table .popover-title .edit-col.text, .popover-title setup-connected-accounts .default-table .edit-col.text, setup-connected-accounts .default-table app-settings-bank-accounts .edit-col.sub-block-title, app-settings-bank-accounts setup-connected-accounts .default-table .edit-col.sub-block-title, setup-connected-accounts .default-table app-settings-bank-accounts .edit-col.accounts-sub-tile, app-settings-bank-accounts setup-connected-accounts .default-table .edit-col.accounts-sub-tile {
  text-align: right;
}
setup-connected-accounts .default-table .bic {
  color: var(--gray-color20);
}
setup-connected-accounts .default-table tr:first-child {
  font-weight: 500;
  font-size: 13px;
  text-transform: capitalize;
  color: var(--menu-link-color);
  border-bottom: var(--default-border-header);
}
setup-connected-accounts .default-table td {
  padding: 15px 10px;
  text-align: left;
  word-wrap: break-word;
}
setup-connected-accounts .default-table td:first-child {
  padding-left: 20px;
}
setup-connected-accounts .default-table .account-content {
  display: flex;
}
setup-connected-accounts .default-table .icon-wrapper {
  display: flex;
}
setup-connected-accounts .default-table .bank-name div {
  max-width: 20vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
setup-connected-accounts .default-table .account-type span {
  padding-left: 2px;
}
setup-connected-accounts .default-table .edit-account {
  color: var(--gray-color2);
  font-size: 20px;
  cursor: pointer;
  padding-right: 10px;
}
setup-connected-accounts .default-table .edit-account.disabled {
  opacity: 0.2;
}
setup-connected-accounts .default-table .account-actions {
  width: 50px !important;
}
setup-connected-accounts .default-table .basket {
  color: var(--orange-color6);
  font-size: 20px;
  cursor: pointer;
  line-height: 1;
}
setup-connected-accounts .default-table .basket.disabled {
  opacity: 0.2;
}
setup-connected-accounts .default-table .hide1-inf {
  display: none;
}
setup-connected-accounts .default-table .copy__field {
  position: relative;
}
setup-connected-accounts .no-new-accounts {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
}
setup-connected-accounts .setting-container {
  position: relative;
  margin-right: auto;
}
setup-connected-accounts .setting-container .btn-edit-plan {
  border: 0;
  background: transparent;
  padding: 0 10px 0 0;
  font-size: 20px;
  line-height: 1;
}
setup-connected-accounts .wrapper-tooltip {
  display: block;
  position: relative;
}
setup-connected-accounts .wrapper-tooltip .tooltip {
  top: 28px;
  right: -5px;
}
setup-connected-accounts .wrapper-tooltip .tooltip:after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: 10px;
}
setup-connected-accounts .wrapper-tooltip:hover .tooltip {
  display: block;
}
setup-connected-accounts .add-checking {
  text-align: right !important;
  padding: 10px 5px !important;
}
setup-connected-accounts .add-checking .wrapper {
  justify-content: space-between;
}
setup-connected-accounts .add-checking .wrapper .basket {
  padding-right: 5px;
}
setup-connected-accounts .subtitle-gray {
  font-weight: 400;
  color: var(--gray-color1);
  font-size: 13px;
}
setup-connected-accounts .btn-wrapper {
  display: flex;
  justify-content: flex-start;
}
setup-connected-accounts .btn-wrapper .loader {
  color: var(--white-color);
  height: 18px;
  width: 18px;
  margin-right: 0;
}
setup-connected-accounts .btn-wrapper .loader .image-load {
  margin: -9px 0 0 -9px;
  width: 18px;
}
setup-connected-accounts .btn-wrapper .btn-map-account {
  margin: 2px;
}
setup-connected-accounts .wrapper {
  display: flex;
}
setup-connected-accounts .modal {
  background-color: var(--white-color);
  z-index: 2;
  width: 500px;
  position: absolute;
  left: 33%;
  top: 33%;
}
setup-connected-accounts .modal .title__delete {
  font-weight: 500;
}
setup-connected-accounts .modal .title .title__cancel {
  cursor: pointer;
  font-size: 13px;
  color: var(--gray-color22);
  float: right;
  padding-right: 10px;
}
setup-connected-accounts .modal .warning .warning__warning-message {
  padding-left: 8px;
  padding-right: 8px;
  text-align: center;
  width: 100%;
  color: var(--gray-color20);
  font-size: 12px;
  padding-top: 28px;
  font-weight: 500;
  font-family: "Rubik", sans-serif;
}
setup-connected-accounts .modal .warning .warning__delete-message {
  font-weight: 500;
  text-align: center;
  width: 100%;
  color: var(--orange-color1);
  font-size: 12px;
  font-family: "Rubik", sans-serif;
  padding-top: 15px;
}
setup-connected-accounts .modal .buttons {
  padding-bottom: 27px;
  text-align: center;
}
setup-connected-accounts .modal .buttons .buttons__cancel {
  transition: all linear 0.2s;
  width: 100px;
  background-color: var(--gray-color6);
  border: 1px solid var(--gray-color16);
  border-radius: 4px;
  color: var(--gray-color23);
  font-size: 11px;
  cursor: pointer;
  font-weight: 500;
  padding-top: 9px;
  padding-bottom: 9px;
}
setup-connected-accounts .modal .buttons .buttons__cancel:hover {
  background-color: var(--btn-gray-hover-bg);
  border-color: var(--btn-gray-border-hover-color);
}
setup-connected-accounts .modal .buttons .buttons__delete {
  transition: all linear 0.2s;
  width: 100px;
  background-color: var(--green-color1);
  border: 1px solid var(--green-color8);
  border-radius: 4px;
  color: var(--white-color);
  font-size: 11px;
  cursor: pointer;
  font-weight: 500;
  padding-top: 9px;
  padding-bottom: 9px;
}
setup-connected-accounts .modal .buttons .buttons__delete:hover {
  background-color: var(--btn-green-hover-bg);
  border-color: var(--btn-green-border-hover-color);
}
setup-connected-accounts .transaction-status {
  text-transform: capitalize;
  display: flex;
  align-items: center;
}
setup-connected-accounts .transaction-status span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 10px;
}
setup-connected-accounts .transactions-failed {
  color: var(--orange-color1);
}
setup-connected-accounts .transactions-failed span {
  background: var(--orange-color1);
}
setup-connected-accounts .transactions-ok {
  color: var(--green-color2);
}
setup-connected-accounts .transactions-ok span {
  background: var(--green-color2);
}
setup-connected-accounts .transactions-disconnected {
  color: var(--orange-color1);
}
setup-connected-accounts .transactions-disconnected span {
  background: var(--orange-color1);
}
setup-connected-accounts .transactions-offline {
  color: var(--blue-color6);
}
setup-connected-accounts .transactions-offline span {
  background: var(--blue-color6);
}
setup-connected-accounts .table-buttons-wrapper {
  text-align: right;
}
setup-connected-accounts .connected-account-button {
  display: flex;
  justify-content: space-between;
}
setup-connected-accounts .connected-account-button .error {
  color: var(--orange-color1);
  background: var(--orange-color2);
  margin-left: 15px;
  display: inline-block;
}
setup-connected-accounts .error-message {
  color: var(--orange-color1);
  background: var(--orange-color2);
  padding: 5px 20px;
}
setup-connected-accounts .page-loader {
  height: 200px;
  width: 100%;
}
setup-connected-accounts .no-company {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
}
setup-connected-accounts .empty-text {
  text-transform: lowercase;
  font-weight: 400;
}
setup-connected-accounts .blue-text, setup-connected-accounts .text-tag, setup-connected-accounts planning-manage-budget .notifications .notification-item.info-message .icon, planning-manage-budget .notifications .notification-item.info-message setup-connected-accounts .icon {
  color: var(--link-color);
  cursor: pointer;
}
setup-connected-accounts .overdraft-input {
  min-width: 80px;
}

@media screen and (max-width: 1480px) {
  .btn-wrapper {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 1280px) {
  .hide2-inf {
    display: none;
  }
  .hide1-inf {
    display: inline !important;
  }
  .upcase-l.edit-col, .popover-title .edit-col.text, app-settings-bank-accounts .edit-col.sub-block-title, app-settings-bank-accounts .edit-col.accounts-sub-tile {
    width: 30%;
  }
}
.loader {
  width: 30px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
setup-team {
  display: block;
}
setup-team .card-table {
  min-width: 300px;
  padding: 15px 15px 40px 15px;
}
setup-team ui-plug {
  padding: 0 15px;
}
setup-team tr.support {
  background: var(--white-color9);
  border: 1px solid var(--white-color15);
  position: relative;
}
setup-team tr.support td {
  position: relative;
}
setup-team tr.support td:before {
  top: 0;
}
setup-team tr.support td:after {
  bottom: 0;
}
setup-team tr.support td:before, setup-team tr.support td:after {
  left: 0;
  content: " ";
  position: absolute;
  background: var(--white-color15);
  width: 100%;
  padding: 0.5px;
}
setup-team .default-table tr {
  height: 55px;
}
setup-team .default-table .table-header td {
  font-weight: 500;
  font-size: 13px;
  color: var(--gray-color5);
  border-bottom: var(--default-border-header);
}
setup-team .default-table td {
  vertical-align: top;
  padding: 10px 10px;
}
setup-team .default-table td:last-child {
  padding-top: 5px;
}
setup-team .default-table td:first-child {
  padding-left: 10px;
}
setup-team .default-table .icons {
  width: 70px;
  padding: 10px 0;
  text-align: right;
}
setup-team .default-table .icons ui-button {
  display: inline-block;
}
setup-team .default-table .column {
  width: 15%;
}
setup-team .default-table .column.mfa {
  width: 20px !important;
}
setup-team .default-table .column.mfa .mfa-inner {
  display: flex;
}
setup-team .default-table .column.column-email {
  min-width: 200px;
  width: auto;
}
setup-team .default-table .email-column {
  width: 25%;
}
setup-team .default-table .role-column {
  width: 1%;
  min-width: 195px;
  padding: 10px 0px;
}
setup-team .default-table .actions-spacer {
  width: 70px;
}
setup-team .default-table .role-spacer {
  width: 100px;
}
setup-team .default-table .name {
  color: var(--black-color0);
  font-weight: 500;
}
setup-team .default-table .invalid {
  border: 1px solid var(--orange-color1);
}
setup-team .default-table .icon {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: auto 5px auto 0;
}
setup-team .default-table .icon.active {
  background-color: var(--green-color2);
}
setup-team .default-table .icon.inactive {
  background-color: var(--orange-color1);
}
setup-team .no-team-member {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
}
setup-team .header {
  display: block;
  background: var(--gray-color7);
}
setup-team .header .btn-add-team-member {
  display: flex;
  width: 150px;
  margin-left: auto;
  margin-right: 15px;
}
setup-team .row {
  display: flex;
  justify-content: space-between;
  width: 130px;
  height: 52px;
  padding: 10px 20px;
}
setup-team .item {
  display: block;
  vertical-align: top;
  width: 100%;
}
setup-team .item .success-summary {
  margin-top: 10px;
  background: var(--green-color3);
  padding: 5px 0 5px 20px;
  color: var(--green-color1);
}
setup-team .item .error-summary {
  background: var(--orange-color2);
  padding: 5px 0 5px 20px;
  margin: 10px 0 0;
  border-radius: 5px;
}
setup-team .item .error-summary .error-message {
  color: var(--orange-color1);
}
setup-team .loader {
  height: 200px;
  width: 100%;
}
setup-team .card-title {
  height: 30px;
}
setup-team .card-title ui-button {
  margin-left: 10px;
}
setup-team .loader-for-row-height {
  display: inline-block;
}
setup-team .loader-for-row-height .loader {
  width: 40px;
  margin: 0 0 0 auto;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
setup-integrations {
  display: block;
}
setup-integrations ui-plug {
  padding: 0 20px;
}
setup-integrations company-integration-item {
  margin-bottom: 15px;
  display: block;
}
setup-integrations company-integration-item:last-child {
  margin-bottom: 0;
}
setup-integrations .row {
  display: flex;
  margin-bottom: 15px;
  border: var(--default-border);
  position: relative;
}
setup-integrations .row:last-child {
  margin-bottom: 0;
}
setup-integrations .row .badge-top-right {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  line-height: 1.2;
  padding: 4px 8px;
  border-radius: 12px;
  font-weight: 600;
  white-space: nowrap;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  /* Ensure sufficient color contrast (WCAG AA) */
  /* Light mode: #CBD9E3 bg with #000000 text = ~9.5:1 contrast ratio */
  /* Dark mode: #292F3F bg with #F0F1F5 text = ~12:1 contrast ratio */
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 1;
  background: var(--gray-color14);
  color: var(--black-color0);
}
setup-integrations .row .badge-top-right:focus-visible {
  outline: 2px solid var(--blue-color3);
  outline-offset: 2px;
}
setup-integrations .row .badge-top-right.badge-orange {
  background: var(--orange-color4);
  color: #FFFFFF;
  color: #FFFFFF !important;
}
setup-integrations .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
setup-integrations .card-content {
  padding: 0 20px 20px 20px;
}
setup-integrations .card-subtitle {
  margin-bottom: 20px;
}
setup-integrations .group-type {
  margin-top: 10px;
  color: var(--black-color0);
}
setup-integrations .connect-form {
  padding: 10px 20px;
  height: 90%;
  display: flex;
  align-items: stretch;
  flex-direction: column;
}
setup-integrations .connect-form .img-panel-align {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
setup-integrations .connect-form .img-panel {
  height: auto;
  min-height: 100px;
  display: flex;
  align-items: center;
}
setup-integrations .connect-form .documents-section {
  column-count: 2;
  column-gap: 40px;
}
setup-integrations .connect-form .documents-section > div {
  padding-top: 2px;
  break-inside: avoid;
}
setup-integrations .connect-form .doc-type {
  margin-bottom: 10px;
  margin-top: 10px;
  display: flex;
  align-items: center;
}
setup-integrations .connect-form .step-title {
  font-weight: 500;
  font-size: 16px;
  padding: 0px 0px 20px 0px;
  color: var(--black-color0);
}
setup-integrations .connect-form .sub-block-title__box {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
setup-integrations .connect-form .sub-block-title__box__column {
  flex: 1;
}
setup-integrations .connect-form .factoring-rate {
  margin-bottom: 10px;
}
setup-integrations .connect-form .factoring-rate .text-boxes {
  width: 65px;
  margin-right: 5px;
}
setup-integrations .connect-form .email-with-domain {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
setup-integrations .connect-form .email-with-domain .input-block {
  width: 100%;
}
setup-integrations .connect-form .email-with-domain span {
  padding: 0 5px;
  margin-top: 10px;
}
setup-integrations .connect-form .contracts {
  overflow-y: auto;
  max-height: 70vh;
}
setup-integrations .connect-form .contract {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  setup-integrations .connect-form .contract { /* For Firefox */
    scrollbar-width: thin;
  }
}
setup-integrations .connect-form .contract::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
setup-integrations .connect-form .contract::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
setup-integrations .connect-form .contract::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
setup-integrations .connect-form .account_name {
  margin-bottom: 20px;
}
setup-integrations .connect-form .account_name .label {
  font-weight: 500;
  font-size: 16px;
  color: var(--black-color0);
}
setup-integrations .connect-form .account_name ui-text-box {
  width: 100%;
}
setup-integrations .connect-form input[type=checkbox] {
  left: -9999px;
  position: absolute;
  top: -9999px;
  visibility: hidden;
}
setup-integrations .connect-form input[type=checkbox] + label {
  cursor: pointer;
  position: relative;
  padding-left: 25px;
  display: inline-block;
  vertical-align: top;
  color: var(--black-color0);
}
setup-integrations .connect-form input[type=checkbox] + label:before {
  content: " ";
  position: absolute;
  top: -1px;
  left: 0;
  width: 19px;
  height: 19px;
  border: 1px solid var(--gray-color21);
  background: var(--white-color);
  border-radius: 3px;
}
setup-integrations .connect-form input[type=checkbox]:checked + label:after {
  content: "";
  background: url(/assets/images/checkmark.png);
  width: 15px;
  height: 14px;
  position: absolute;
  top: 1px;
  left: 2px;
  display: inline-block;
}
setup-integrations .connect-form .button-wrapper {
  display: flex;
  justify-content: flex-end;
  margin-top: 40px;
  gap: 16px;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
}
setup-integrations .beta {
  padding-left: 15px;
}
setup-integrations .no-integrations {
  width: 100%;
  padding: 20px;
  background: var(--green-color3);
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: var(--green-color2);
  margin-top: 40px;
}
setup-integrations #setup-integrations .card-header {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  margin-bottom: 20px;
}
setup-integrations #setup-integrations .card-header .card-title {
  width: auto;
  margin: 0;
}
setup-integrations #setup-integrations .blue-border-button {
  padding: 10px;
  min-width: 70px;
  border-radius: 20px;
  color: var(--blue-color6);
  background-color: var(--white-color);
  text-transform: capitalize;
  font: 500 11px "Rubik";
  border: 2px solid var(--blue-color6);
  transition: linear 0.2s;
  cursor: pointer;
}
setup-integrations #setup-integrations .blue-border-button:hover {
  background: var(--blue-color6);
  color: var(--white-color);
}
setup-integrations .integrated {
  margin-right: 10px;
  border: 1px solid var(--green-color1);
  border-radius: 20px;
  height: 32px;
  cursor: pointer;
  padding: 0 10px;
  line-height: 1;
  align-items: center;
  display: flex;
  color: var(--green-color1);
  font-size: 13px;
  font-weight: 400;
}
setup-integrations .integrated img {
  width: 20px;
  margin-right: 10px;
}
setup-integrations .wrapper-item {
  flex-grow: 2;
  padding: 25px 10px;
}
setup-integrations .wrapper-item.item-billomat {
  display: flex;
  width: 100%;
  justify-content: space-between;
}
setup-integrations .wrapper-item .service-item {
  width: 100%;
  display: flex;
  flex-direction: column;
}
setup-integrations .wrapper-item .service-item div {
  margin-bottom: 10px;
}
setup-integrations .wrapper-item .service-item.text-width {
  margin-right: auto;
}
setup-integrations .wrapper-item .service-item.public-api-info {
  max-width: 600px;
}
setup-integrations .wrapper-item .service-item .monite-info {
  max-width: 600px;
}
setup-integrations .wrapper-item .service-item .monite-info__block {
  width: calc(100% - 40px);
  display: flex;
  align-items: center;
  gap: 16px;
  background-color: var(--panel-widget-bg);
  padding: 8px;
}
setup-integrations .wrapper-item .service-item .monite-info__block div {
  margin-bottom: 0px !important;
}
setup-integrations .wrapper-item .service-item .monite-info__block__info-subtitle {
  font-weight: 600;
  color: var(--gray-color5);
  display: flex;
}
setup-integrations .wrapper-item .service-item .monite-info__block__info-subtitle__integrated {
  position: relative;
  margin-left: 40px;
  line-height: 16px;
  align-items: center;
  color: #84C612;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 700;
}
setup-integrations .wrapper-item .service-item .monite-info__block__info-subtitle__integrated:before {
  content: "";
  position: absolute;
  background: url(/assets/images/icons/completed.svg) no-repeat 0 0/cover;
  width: 16px;
  height: 16px;
  border-radius: 16px;
  margin-left: -20px;
}
setup-integrations .wrapper-item .service-item .monite-info__block__link {
  color: var(--link-color);
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
}
setup-integrations .wrapper-item .service-item .monite-info__block__link .iconsax {
  --Iconsax-Size: 16px !important;
}
setup-integrations .wrapper-item .service-item .banking-info {
  max-width: 600px;
  font-size: 13px;
}
setup-integrations .wrapper-item .service-item .banking-info__block {
  width: calc(100% - 40px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background-color: var(--panel-widget-bg);
  padding: 8px;
}
setup-integrations .wrapper-item .service-item .banking-info__block div {
  margin-bottom: 0px !important;
}
setup-integrations .wrapper-item .service-item .banking-info__block__info-text {
  color: var(--gray-color1);
  display: flex;
}
setup-integrations .wrapper-item .service-item .banking-info__block__link {
  color: var(--link-color);
  display: inline-flex;
  align-items: center;
}
setup-integrations .wrapper-item .service-item .banking-info__block__link .iconsax {
  --Iconsax-Size: 16px !important;
  --Iconsax-Color: var(--link-color) !important;
  margin-left: 3px;
}
setup-integrations .wrapper-item .service-item .copy__field {
  position: relative;
}
setup-integrations .wrapper-item .service-item .copy__field ui-text-box {
  width: calc(100% - 40px);
}
setup-integrations .wrapper-item .service-item .service-item-button__link {
  color: var(--link-color);
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
}
setup-integrations .wrapper-item .service-item .exporter-info div {
  margin-bottom: 0px !important;
}
setup-integrations .wrapper-item .service-item .exporter-info__document {
  margin-left: 5px;
  padding: 6px 12px;
  border-radius: 16px;
  font-size: 11px;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
setup-integrations .img-wrapper {
  width: 100%;
  max-width: 100px;
  border-right: var(--default-border);
}
setup-integrations .img-wrapper-align {
  padding: 25px 10px;
  min-height: 210px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
  min-width: 250px;
}
setup-integrations .img-wrapper-align .img-align {
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}
setup-integrations .non-ksv-title {
  font-weight: 600;
  font-size: 13px;
  color: var(--gray-color1);
  line-height: 20px;
  display: flex;
  margin-bottom: 20px;
}
setup-integrations .non-ksv-title ui-icon-hint {
  margin: 0 0 0 10px;
}
setup-integrations .non-ksv-title ui-icon-hint .tooltip {
  bottom: -40px;
  left: -10px;
}
setup-integrations .non-ksv-title ui-icon-hint .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 15px;
}
setup-integrations .non-ksv-title span {
  text-align: center;
}
setup-integrations .non-ksv-title .beta {
  padding-left: 5px !important;
}
setup-integrations .account-name {
  margin-bottom: 20px;
  overflow-wrap: anywhere;
}
setup-integrations .text {
  font-weight: 400;
  font-size: 13px;
  color: var(--gray-color1);
  line-height: 16px;
  margin-left: 10px;
}
setup-integrations .text-width {
  margin-bottom: 14px;
  line-height: 20px;
}
setup-integrations .text.with-line-space {
  margin-bottom: 14px;
  line-height: 1.4;
}
setup-integrations .global-page-loader {
  margin-top: 20px !important;
  position: relative !important;
}
setup-integrations .billomat-loader .image-load {
  width: 70px;
  margin-top: 80px;
}
setup-integrations .link {
  font-weight: 600;
  text-decoration: underline;
}
setup-integrations .connect-form {
  display: flex;
  flex-direction: column;
  width: 100%;
}
setup-integrations .connect-form .input-block {
  margin-top: 10px;
}
setup-integrations .integration-banking-status {
  font-size: 13px;
  line-height: 20px;
  font-weight: bold;
}
setup-integrations .integration-banking-error {
  color: var(--orange-color1);
}
setup-integrations .button-wrapper {
  display: flex;
  gap: 5px;
}
setup-integrations .button-wrapper ui-button button {
  min-height: 32px !important;
}
setup-integrations .button-wrapper .btn-map {
  width: 80px;
  margin: 10px 0;
}
setup-integrations .button-wrapper .btn-map:first-child {
  margin-right: 10px;
}
setup-integrations .ksv-title {
  display: flex;
  align-items: center;
}
setup-integrations .credit-wrapper.warning {
  padding-bottom: 40px;
}
setup-integrations .credit-wrapper .text-width {
  margin-bottom: 2px;
}
setup-integrations .credit-wrapper .txt-search {
  margin-bottom: 20px;
  width: 100%;
  max-width: 310px;
}
setup-integrations .credit-wrapper .txt-search input {
  border-radius: 20px;
  padding-left: 40px;
}
setup-integrations .credit-wrapper .txt-search span.icon {
  left: 15px;
}
setup-integrations .credit-wrapper .credit-list {
  margin: 20px 162px 0 162px;
  border-bottom: var(--default-border);
}
setup-integrations .credit-wrapper .item {
  padding: 0 10px;
  height: 45px;
  line-height: 45px;
  overflow: hidden;
  border: 1px solid var(--white-color);
  transition: linear 0.2s;
  border-top: var(--default-border);
  align-items: center;
  font-weight: 500;
  font-size: 13px;
  color: var(--gray-color1);
}
setup-integrations .credit-wrapper .item:hover, setup-integrations .credit-wrapper .item.active {
  background: var(--green-color3);
  border-bottom: 1px solid var(--green-color3);
}
setup-integrations .list-item .button {
  margin-left: 162px;
}
setup-integrations .billomat-loader {
  width: 100% !important;
}
setup-integrations .credit-loader {
  width: 100%;
  margin: 30px 0;
  height: 50px;
}
setup-integrations .view-not-allowed {
  background-color: transparent !important;
  text-align: left !important;
  padding: 0 !important;
}
setup-integrations .success-block {
  background-color: var(--green-color3);
  color: var(--green-color2);
  padding: 10px;
}
setup-integrations .error-block {
  background: var(--orange-color2);
  color: var(--orange-color1);
  padding: 10px;
}
setup-integrations .credit-error {
  background: var(--orange-color2);
  color: var(--orange-color1);
  padding: 10px;
  margin: 20px 162px 0 162px;
}
setup-integrations .credit-error + .credit-error {
  margin-top: 8px;
}

.delete-confirm {
  padding: 20px 35px;
  text-align: left;
}

.public-api .title, .zapier .title, .email .title {
  font-size: 16px;
  font-weight: 500;
  color: var(--black-color0);
}
.public-api .item, .public-api .copy-field, .zapier .item, .zapier .copy-field, .email .item, .email .copy-field {
  margin: 20px 0;
  display: flex;
  flex-direction: row;
}
.public-api .item .info, .public-api .copy-field .info, .zapier .item .info, .zapier .copy-field .info, .email .item .info, .email .copy-field .info {
  color: var(--black-color0);
  word-break: break-all;
}
.public-api .item .label, .public-api .copy-field .label, .zapier .item .label, .zapier .copy-field .label, .email .item .label, .email .copy-field .label {
  width: 110px;
  color: var(--gray-color1);
}
.public-api .item .link-default, .public-api .item a, .public-api .copy-field .link-default, .public-api .copy-field a, .zapier .item .link-default, .zapier .item a, .zapier .copy-field .link-default, .zapier .copy-field a, .email .item .link-default, .email .item a, .email .copy-field .link-default, .email .copy-field a {
  margin-left: 10px;
  margin-top: auto;
  text-transform: capitalize;
}

.public-api .copy-field, .email .copy-field {
  margin: auto 0;
  padding-bottom: 10px;
}
.public-api .copy-field .label, .email .copy-field .label {
  margin: auto 0;
}
.public-api .copy-field .text-boxes, .email .copy-field .text-boxes {
  width: 305px;
  color: var(--black-color0) !important;
  opacity: 1 !important;
}
.public-api .copy-field .link-default, .email .copy-field .link-default {
  margin: auto 0 auto 10px;
}

.zapier .wrapper-item {
  display: flex;
}
.zapier .section {
  display: flex;
  flex-direction: column;
}

.doc-types {
  width: 25%;
  margin-right: 20px;
}
.doc-types.currencies {
  width: 15% !important;
}
.doc-types .doc-type {
  margin-bottom: 10px;
  margin-top: 10px;
}
.doc-types input[type=checkbox] {
  left: -9999px;
  position: absolute;
  top: -9999px;
  visibility: hidden;
}
.doc-types input[type=checkbox] + label {
  position: relative;
  padding-left: 25px;
  display: inline-block;
  vertical-align: top;
  color: var(--black-color0);
}
.doc-types input[type=checkbox] + label:before {
  content: " ";
  position: absolute;
  top: -1px;
  left: 0;
  width: 19px;
  height: 19px;
  border: 1px solid var(--gray-color21);
  background: var(--white-color);
  border-radius: var(--border-radius);
}
.doc-types input[type=checkbox]:checked + label:after {
  content: "";
  background: url(/assets/images/checkmark.png);
  width: 15px;
  height: 14px;
  position: absolute;
  top: 1px;
  left: 2px;
  display: inline-block;
}
.doc-types .disabled {
  opacity: 0.5;
}

.columns {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
  list-style: none;
  margin: 0;
  padding: 0;
}
.columns.row-4, .columns.row-5, .columns.row-6 {
  margin-bottom: 20px;
}
.columns.row-4 {
  height: 160px;
}
.columns.row-5 {
  height: 200px;
}
.columns.row-6 {
  height: 240px;
}
.columns li {
  margin-right: auto;
  width: 33%;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-th-sortable {
  vertical-align: middle;
  cursor: pointer;
  display: table-cell;
  align-items: center;
}
app-th-sortable.sortable-align-right .sort-wrapper {
  display: flex;
  justify-content: flex-end;
}
app-th-sortable .table-title {
  text-align: left;
  font-size: 13px;
  padding: 0 10px;
  color: var(--link-color-active);
  position: relative;
  align-items: center;
  display: flex;
  font-weight: 500;
}
app-th-sortable .arrows {
  display: flex;
  color: var(--blue-color3);
  margin-left: 5px;
  position: relative;
}
app-th-sortable .arrows.top .arrow {
  --Iconsax-Color: var(--sorting-arrow-color);
}
app-th-sortable .arrows.top .arrow-rotated {
  --Iconsax-Color: var(--gray-color1);
}
app-th-sortable .arrows.bottom .arrow {
  --Iconsax-Color: var(--gray-color1);
}
app-th-sortable .arrows.bottom .arrow-rotated {
  --Iconsax-Color: var(--sorting-arrow-color);
}
app-th-sortable .arrow-rotated {
  transform: rotate(180deg);
  position: absolute;
}

.custom-switch {
  line-height: 12px;
}
.custom-switch .custom-switch-input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.custom-switch .custom-switch-input, .custom-switch .custom-switch-input:after, .custom-switch .custom-switch-input:before, .custom-switch .custom-switch-input *, .custom-switch .custom-switch-input *:after, .custom-switch .custom-switch-input *:before, .custom-switch .custom-switch-input + .custom-switch-btn {
  box-sizing: border-box;
}
.custom-switch .custom-switch-input:selection, .custom-switch .custom-switch-input:after:selection, .custom-switch .custom-switch-input:before:selection, .custom-switch .custom-switch-input *:selection, .custom-switch .custom-switch-input *:after:selection, .custom-switch .custom-switch-input *:before:selection, .custom-switch .custom-switch-input + .custom-switch-btn:selection {
  background: none;
}
.custom-switch .custom-switch-input + .custom-switch-btn {
  outline: 0;
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
          user-select: none;
  cursor: pointer;
  width: 68px;
  height: 38px;
  margin: 0;
  padding: 4px;
  background: var(--blue-color-switch);
  border-radius: 76px;
  transition: all 150ms ease;
}
.custom-switch .custom-switch-input + .custom-switch-btn:after, .custom-switch .custom-switch-input + .custom-switch-btn:before {
  position: relative;
  display: block;
  content: "";
  width: 29px;
  height: 29px;
}
.custom-switch .custom-switch-input + .custom-switch-btn:after {
  left: 2px;
  border-radius: 50%;
  background: var(--white-color);
  transition: all 150ms ease;
}
.custom-switch .custom-switch-input + .custom-switch-btn:before {
  display: none;
}
.custom-switch .custom-switch-input + .custom-switch-btn.text-hide {
  top: -0.8rem;
}
.custom-switch .custom-switch-input:checked + .custom-switch-btn {
  background: var(--green-color1);
}
.custom-switch .custom-switch-input:checked + .custom-switch-btn:after {
  left: 30px;
}
.custom-switch .custom-switch-input:checked + .custom-switch-btn ~ .custom-switch-content-checked {
  opacity: 1;
  height: auto;
}
.custom-switch .custom-switch-input:checked + .custom-switch-btn ~ .custom-switch-content-unchecked {
  display: none;
  opacity: 0;
  height: 0;
}
.custom-switch .custom-switch-input:not(:checked) + .custom-switch-btn ~ .custom-switch-content-checked {
  display: none;
  opacity: 0;
  height: 0;
}
.custom-switch .custom-switch-input:not(:checked) + .custom-switch-btn ~ .custom-switch-content-unchecked {
  opacity: 1;
  height: auto;
}
.custom-switch .custom-switch-input[disabled] + .custom-switch-btn {
  background: rgba(var(--blue-color-switch), 0.6);
  cursor: default;
}
.custom-switch .custom-switch-input[disabled]:checked + .custom-switch-btn {
  background: rgba(var(--green-color1), 0.4);
}
.custom-switch .custom-switch-input[required] ~ .custom-switch-btn {
  box-shadow: inset 0 1px 1px var(--black-color5), 0 0 0 0.125rem rgba(var(--orange-color6), 0.5);
}
.custom-switch .custom-switch-form-text {
  display: inline-block;
  height: 38px;
  margin-left: 0.5rem;
  line-height: 38px;
  vertical-align: top;
}
.custom-switch.custom-switch-label-io .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='38'><text x='42.5' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>O</text></svg>");
}
.custom-switch.custom-switch-label-io .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='38'><text x='18.1333333333' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>I</text></svg>");
}
.custom-switch.custom-switch-label-onoff .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='38'><text x='38.8571428571' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>Off</text></svg>");
}
.custom-switch.custom-switch-label-onoff .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='38'><text x='9.7142857143' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>On</text></svg>");
}
.custom-switch.custom-switch-label-yesno .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='38'><text x='38.8571428571' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>No</text></svg>");
}
.custom-switch.custom-switch-label-yesno .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='38'><text x='9.7142857143' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>Yes</text></svg>");
}
.custom-switch.custom-switch-label-status .custom-switch-input + .custom-switch-btn {
  width: 96px;
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='96' height='38'><text x='38.8571428571' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>Disabled</text></svg>");
}
.custom-switch.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='96' height='38'><text x='9.7142857143' y='23.75' font-size='12px' font-family='Rubik, sans-serif' fill='var(--white-color)'>Enabled</text></svg>");
}
.custom-switch.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn:after {
  left: 58px;
}

.custom-switch-sm {
  line-height: 11px;
}
.custom-switch-sm .custom-switch-input + .custom-switch-btn {
  width: 60px;
  height: 31px;
  padding: 3px;
  border-radius: 62px;
}
.custom-switch-sm .custom-switch-input + .custom-switch-btn:after, .custom-switch-sm .custom-switch-input + .custom-switch-btn:before {
  width: 23px;
  height: 23px;
}
.custom-switch-sm .custom-switch-input + .custom-switch-btn:after {
  left: 2px;
}
.custom-switch-sm .custom-switch-input:checked + .custom-switch-btn:after {
  left: 29px;
}
.custom-switch-sm .custom-switch-form-text {
  height: 31px;
  margin-left: 0.5rem;
  line-height: 31px;
}
.custom-switch-sm.custom-switch-label-io .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='60' height='31'><text x='37.5' y='19.375' font-size='11px' font-family='Rubik, sans-serif' fill='white'>O</text></svg>");
}
.custom-switch-sm.custom-switch-label-io .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='60' height='31'><text x='16' y='19.375' font-size='11px' font-family='Rubik, sans-serif' fill='white'>I</text></svg>");
}
.custom-switch-sm.custom-switch-label-onoff .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='60' height='31'><text x='32.8767123288' y='19.375' font-size='11px' font-family='Rubik, sans-serif' fill='white'>Off</text></svg>");
}
.custom-switch-sm.custom-switch-label-onoff .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='60' height='31'><text x='8.5714285714' y='19.375' font-size='11px' font-family='Rubik, sans-serif' fill='white'>On</text></svg>");
}
.custom-switch-sm.custom-switch-label-yesno .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='60' height='31'><text x='32.8767123288' y='19.375' font-size='11px' font-family='Rubik, sans-serif' fill='white'>No</text></svg>");
}
.custom-switch-sm.custom-switch-label-yesno .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='60' height='31'><text x='8.5714285714' y='19.375' font-size='11px' font-family='Rubik, sans-serif' fill='white'>Yes</text></svg>");
}
.custom-switch-sm.custom-switch-label-status .custom-switch-input + .custom-switch-btn {
  width: 88px;
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='88' height='31'><text x='32.8767123288' y='37.5' font-size='11px' font-family='Rubik, sans-serif' fill='white'>Disabled</text></svg>");
}
.custom-switch-sm.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='88' height='31'><text x='8.5714285714' y='37.5' font-size='11px' font-family='Rubik, sans-serif' fill='white'>Enabled</text></svg>");
}
.custom-switch-sm.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn:after {
  left: 57px;
}

.custom-switch-xs {
  line-height: 10px;
}
.custom-switch-xs .custom-switch-input + .custom-switch-btn {
  width: 36px;
  height: 20px;
  padding: 2px;
  border-radius: 40px;
}
.custom-switch-xs .custom-switch-input + .custom-switch-btn:after, .custom-switch-xs .custom-switch-input + .custom-switch-btn:before {
  width: 15px;
  height: 15px;
}
.custom-switch-xs .custom-switch-input + .custom-switch-btn:after {
  left: 1px;
}
.custom-switch-xs .custom-switch-input:checked + .custom-switch-btn:after {
  left: 16px;
}
.custom-switch-xs .custom-switch-form-text {
  height: 20px;
  margin-left: 0.5rem;
  line-height: 20px;
}
.custom-switch-xs.custom-switch-label-io .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='36' height='20'><text x='20.5714285714' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>O</text></svg>");
}
.custom-switch-xs.custom-switch-label-io .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='36' height='20'><text x='9.6' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>I</text></svg>");
}
.custom-switch-xs.custom-switch-label-onoff .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='36' height='20'><text x='19.2' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>Off</text></svg>");
}
.custom-switch-xs.custom-switch-label-onoff .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='36' height='20'><text x='5.1428571429' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>On</text></svg>");
}
.custom-switch-xs.custom-switch-label-yesno .custom-switch-input + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='36' height='20'><text x='19.2' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>No</text></svg>");
}
.custom-switch-xs.custom-switch-label-yesno .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='36' height='20'><text x='5.1428571429' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>Yes</text></svg>");
}
.custom-switch-xs.custom-switch-label-status .custom-switch-input + .custom-switch-btn {
  width: 68px;
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='20'><text x='19.2' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>Disabled</text></svg>");
}
.custom-switch-xs.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn {
  background-image: svg-uri("<svg xmlns='http://www.w3.org/2000/svg' width='68' height='20'><text x='5.1428571429' y='12.5' font-size='10px' font-family='Rubik, sans-serif' fill='white'>Enabled</text></svg>");
}
.custom-switch-xs.custom-switch-label-status .custom-switch-input:checked + .custom-switch-btn:after {
  left: 48px;
}

.is-invalid .custom-switch .custom-switch-input ~ .custom-switch-btn,
.was-validated .custom-switch:invalid .custom-switch-input ~ .custom-switch-btn {
  box-shadow: inset 0 1px 1px var(--black-color5), 0 0 0 0.25rem rgba(var(--orange-color6), 1);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-insights {
  position: relative;
}
page-insights .tab-container {
  margin: 25px;
}
page-insights .content .header-link-wrapper {
  padding-bottom: 20px;
}
page-insights .content .filter {
  display: flex;
  flex-direction: row;
  align-items: center;
}
page-insights .content .filter .category, page-insights .content .filter .entities {
  width: 255px;
  background: var(--white-color);
  margin-right: 5px;
}
page-insights .content .filter .category .dropdown, page-insights .content .filter .entities .dropdown {
  width: 100%;
}
page-insights .content .filter .entities {
  margin-left: 5px;
  width: 255px;
}
page-insights .content .filter .entities .dropdown {
  width: 100%;
}
page-insights .content .filter .reset {
  text-align: left;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: 10px;
}
page-insights .content .filter .reset a {
  font-size: 13px;
  color: var(--blue-color3);
  display: flex;
  align-items: center;
}
page-insights .modal .content {
  padding: 0 !important;
}
page-insights .datepicker {
  margin-top: auto;
  margin-bottom: auto;
  margin-left: 10px;
}
page-insights .datepicker .mat-form-field-wrapper {
  padding-bottom: 0 !important;
}
page-insights .expansion-panel__body {
  margin: 0 !important;
  background-color: var(--gray-color7);
}
page-insights .expansion-panel__toggle-icon {
  display: none !important;
}
page-insights .mat-form-field-underline {
  height: 0 !important;
}
page-insights .mat-form-field-ripple {
  background-color: var(--gray-color6) !important;
}
page-insights .mat-select-value {
  width: 83% !important;
}
page-insights .mat-form-field-appearance-fill .mat-form-field-flex {
  padding: 0 !important;
  background-color: var(--white-color) !important;
  border-radius: var(--border-radius);
  border: var(--default-border);
  display: flex;
  height: 32px;
  align-items: center;
}
page-insights .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-suffix .mat-icon-button {
  width: 25px;
  height: 25px;
}
page-insights .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix {
  height: 30px;
  width: 170px;
  margin: auto;
  border: none;
  display: flex;
  align-items: center;
}
page-insights .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner {
  color: var(--black-color1);
  font-family: var(--default-font);
}
page-insights .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner.ng-invalid {
  color: var(--orange-color6) !important;
}
page-insights .mat-form-field-appearance-fill .mat-form-field-flex .mat-form-field-infix .mat-date-range-input-inner::placeholder {
  font-style: italic;
  color: var(--default-input-placeholder-color);
  opacity: 1;
}
page-insights .mat-form-field-appearance-fill .mat-form-field-underline {
  display: none;
}
page-insights .form-line-chips .mat-form-field-infix, page-insights .form-line-chips .mat-form-field-flex, page-insights .tags .mat-form-field-infix, page-insights .tags .mat-form-field-flex {
  height: unset !important;
}
page-insights .popover-datepicker {
  position: absolute;
  top: 10px;
  left: 0;
  width: 270px;
  background-color: var(--white-color);
  z-index: 5;
  padding: 0 20px 20px;
  border: var(--default-border);
}
page-insights .popover-datepicker .datepicker__wrapper {
  display: flex;
  justify-content: space-between;
}
page-insights .popover-datepicker .mat-calendar-body-label {
  display: none !important;
}
page-insights .mat-calendar-period-button {
  pointer-events: none;
}
page-insights .mat-button-wrapper {
  pointer-events: none;
}
page-insights .mat-button-wrapper .mat-calendar-arrow {
  display: none;
}
page-insights .table-row .dropdown.colored {
  width: 104px !important;
  min-width: 104px !important;
}

today-chart ui-plug > div, today-overview-chart ui-plug > div {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
today-chart .bar-chart .highcharts-grid-line, today-overview-chart .bar-chart .highcharts-grid-line {
  stroke: var(--white-color6);
}
today-chart .bar-chart .highcharts-axis-line, today-overview-chart .bar-chart .highcharts-axis-line {
  stroke: var(--white-color16);
}
today-chart .bar-chart .series-point, today-overview-chart .bar-chart .series-point {
  display: flex;
}
today-chart .bar-chart .series-point span, today-chart .bar-chart .series-point div, today-overview-chart .bar-chart .series-point span, today-overview-chart .bar-chart .series-point div {
  margin-top: auto;
}
today-chart .bar-chart .series-point .name, today-overview-chart .bar-chart .series-point .name {
  margin-right: auto;
  display: flex;
}
today-chart .bar-chart .series-point .symbol, today-overview-chart .bar-chart .series-point .symbol {
  width: 15px;
}
today-chart .bar-chart .series-point .accountCurrency, today-overview-chart .bar-chart .series-point .accountCurrency {
  margin-right: 5px;
  margin-left: 5px;
}
today-chart .bar-chart .series-point .tooltip-amount, today-chart .bar-chart .series-point .tooltip-amount-positive, today-chart .bar-chart .series-point .tooltip-amount-negative, today-overview-chart .bar-chart .series-point .tooltip-amount, today-overview-chart .bar-chart .series-point .tooltip-amount-positive, today-overview-chart .bar-chart .series-point .tooltip-amount-negative {
  line-height: 13px;
  font-size: 13px;
}
today-chart .bar-chart .series-point.strikethrough, today-overview-chart .bar-chart .series-point.strikethrough {
  color: var(--red-color) !important;
}
today-chart .bar-chart .series-point.strikethrough .accountCurrency, today-overview-chart .bar-chart .series-point.strikethrough .accountCurrency {
  text-decoration: line-through;
  color: var(--red-color) !important;
}
today-chart .forecast-balance-chart, today-overview-chart .forecast-balance-chart {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  background: var(--white-color);
  margin-bottom: 25px;
}
today-chart .forecast-balance-chart .comparing-panel, today-chart .forecast-balance-chart .empty, today-overview-chart .forecast-balance-chart .comparing-panel, today-overview-chart .forecast-balance-chart .empty {
  width: 33%;
}
today-chart .forecast-balance-chart .upload, today-overview-chart .forecast-balance-chart .upload {
  position: relative;
}
today-chart .forecast-balance-chart .upload:hover .tooltip, today-overview-chart .forecast-balance-chart .upload:hover .tooltip {
  display: block;
  bottom: calc(-100% - 10px);
  right: 0;
}
today-chart .forecast-balance-chart .upload:hover .tooltip:after, today-overview-chart .forecast-balance-chart .upload:hover .tooltip:after {
  content: "";
  position: absolute;
  left: calc(100% - 20px);
}
today-chart .forecast-balance-chart .upload, today-overview-chart .forecast-balance-chart .upload {
  margin-left: 5px;
}
today-chart .forecast-balance-chart cash-flow-bar-chart, today-overview-chart .forecast-balance-chart cash-flow-bar-chart {
  padding: 0 5px;
}
today-chart .forecast-balance-chart cash-flow-bar-chart .content, today-overview-chart .forecast-balance-chart cash-flow-bar-chart .content {
  display: block;
  padding: 0 0 20px 0 !important;
}
today-chart .forecast-balance-chart .chart-wrapper, today-overview-chart .forecast-balance-chart .chart-wrapper {
  padding: 0;
}
today-chart .forecast-balance-chart .chart-header, today-overview-chart .forecast-balance-chart .chart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
today-chart .forecast-balance-chart .comparing-panel, today-overview-chart .forecast-balance-chart .comparing-panel {
  display: inline-flex;
}
today-chart .forecast-balance-chart .header-panel, today-overview-chart .forecast-balance-chart .header-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 30px);
  margin: 0 15px;
  padding: 15px 0;
}
today-chart .date-switcher-container, today-overview-chart .date-switcher-container {
  display: flex;
}
today-chart .date-switcher-container .date-switcher, today-overview-chart .date-switcher-container .date-switcher {
  display: flex;
}
today-chart .date-switcher-container .date-switcher span, today-overview-chart .date-switcher-container .date-switcher span {
  margin: auto 5px;
  font-size: 14px;
}
today-chart .date-switcher-container .date-switcher .link, today-overview-chart .date-switcher-container .date-switcher .link {
  background: var(--ultra-light-blue2);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blue-color6);
  cursor: pointer;
  text-transform: capitalize;
  text-decoration: none;
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
}
today-chart .date-switcher-container .date-switcher .link.point, today-overview-chart .date-switcher-container .date-switcher .link.point {
  height: 10px;
  width: 10px;
  background-color: var(--blue-color3);
  border-radius: 50%;
  display: inline-block;
  margin: auto;
}
today-chart .date-switcher-container .date-switcher .link.disabled, today-overview-chart .date-switcher-container .date-switcher .link.disabled {
  pointer-events: none;
  cursor: default;
  color: var(--default-font-color);
  opacity: 0.5;
}
today-chart .date-switcher-container .date-switcher .link:hover, today-overview-chart .date-switcher-container .date-switcher .link:hover {
  color: var(--blue-color21);
}
today-chart .chart-container, today-overview-chart .chart-container {
  padding: 23px 0 0 0 !important;
  /*test*/
}
today-chart .chart-container .view-not-allowed, today-overview-chart .chart-container .view-not-allowed {
  margin-bottom: 10px;
}
today-chart .chart-container .sub-title, today-overview-chart .chart-container .sub-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--gray-color5);
  font-size: 16px;
  font-weight: 500;
  position: relative;
  display: flex;
}
today-chart .chart-container .chart-title, today-overview-chart .chart-container .chart-title {
  display: flex;
}
today-chart .chart-container .chart-title .date-switcher-container, today-overview-chart .chart-container .chart-title .date-switcher-container {
  margin-top: auto;
  display: flex;
  margin-left: auto;
  margin-right: auto;
}
today-chart .chart-container .period-title, today-overview-chart .chart-container .period-title {
  color: var(--black-color0);
  font-size: 13px;
  font-weight: 500;
  margin-top: 30px;
  margin-left: 20px;
}
today-chart .chart-container .body, today-overview-chart .chart-container .body {
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
today-chart .chart-container .chart-container-loader .loader, today-overview-chart .chart-container .chart-container-loader .loader {
  height: 434px !important;
}
today-chart .chart-container .chart-container-loader .loader .image-load, today-overview-chart .chart-container .chart-container-loader .loader .image-load {
  margin: -35px 0 0 -35px;
  width: 70px;
}
today-chart .chart-container .charts-wrapper, today-overview-chart .chart-container .charts-wrapper {
  display: flex;
  overflow: hidden;
}
today-chart .chart-container .charts-wrapper .chart-wrapper, today-overview-chart .chart-container .charts-wrapper .chart-wrapper {
  margin-right: 20px;
  margin-bottom: 20px;
}
today-chart .chart-container .charts-wrapper .summary-wrapper, today-overview-chart .chart-container .charts-wrapper .summary-wrapper {
  width: 300px;
  margin-left: 20px;
  margin-top: 10px;
  margin-bottom: 20px;
  border-radius: var(--border-radius);
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item {
  margin-left: 15px;
  margin-top: 19px;
  padding-bottom: 5px;
  padding-left: 5px;
  padding-top: 5px;
  width: 200px;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .widgets-amount, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .widgets-amount {
  color: var(--black-color0);
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.overdue, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.overdue {
  color: var(--red-color);
  border: 2px solid var(--red-color);
  border-radius: var(--border-radius);
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.overdue .widgets-amount, today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.overdue .title, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.overdue .widgets-amount, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.overdue .title {
  color: var(--red-color) !important;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.strikethrough, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.strikethrough {
  color: var(--red-color) !important;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.strikethrough .widgets-amount, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item.strikethrough .widgets-amount {
  text-decoration: line-through;
  color: var(--red-color) !important;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .currency, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .currency {
  font-size: 11px;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .amount, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .amount {
  font-weight: 500;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .title, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-item .title {
  margin-top: 3px;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-chart-wrapper, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-chart-wrapper {
  display: flex;
  margin-top: 20px;
  margin-bottom: 20px;
}
today-chart .chart-container .charts-wrapper .summary-wrapper .summary-chart-wrapper .data-wrapper, today-overview-chart .chart-container .charts-wrapper .summary-wrapper .summary-chart-wrapper .data-wrapper {
  margin-top: auto;
  margin-bottom: auto;
}
today-chart .chart-container .charts-wrapper .charts-wrapper, today-overview-chart .chart-container .charts-wrapper .charts-wrapper {
  margin-top: 10px;
}
today-chart .chart-container .buttons, today-overview-chart .chart-container .buttons {
  margin-left: auto;
  margin-right: 40px;
  color: var(--menu-link-color);
  display: flex;
  align-items: center;
}
today-chart .chart-container .buttons ui-button, today-overview-chart .chart-container .buttons ui-button {
  margin-left: 10px;
}
today-chart .btn-toggle-wrapper:hover .hint-tooltip, today-overview-chart .btn-toggle-wrapper:hover .hint-tooltip {
  display: block;
}
today-chart .btn-toggle-wrapper, today-overview-chart .btn-toggle-wrapper {
  height: 100%;
  display: flex;
  align-items: center;
  margin: 0 15px 0 auto;
}
today-chart .btn-toggle-wrapper .btn-toggle, today-overview-chart .btn-toggle-wrapper .btn-toggle {
  font-size: 20px;
  align-items: center;
  display: flex;
  text-align: center;
  width: 22px;
  height: 22px;
  cursor: pointer;
  background-image: url(/assets/images/icons/settings.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto 100%;
}
today-chart .btn-toggle-wrapper .btn-toggle:hover, today-chart .btn-toggle-wrapper .btn-toggle:active, today-overview-chart .btn-toggle-wrapper .btn-toggle:hover, today-overview-chart .btn-toggle-wrapper .btn-toggle:active {
  text-decoration: none;
}
today-chart .btn-toggle-wrapper .hint-tooltip, today-overview-chart .btn-toggle-wrapper .hint-tooltip {
  position: absolute;
  border-radius: var(--border-radius);
  display: none;
  z-index: 1;
  top: 45px;
  right: 20px;
  padding: 1px 20px;
  font-size: 12px;
  white-space: nowrap;
  opacity: 1;
}
today-chart .btn-toggle-wrapper .hint-tooltip:after, today-overview-chart .btn-toggle-wrapper .hint-tooltip:after {
  content: "";
  opacity: 1;
  position: absolute;
  bottom: 100%;
  right: 50px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent var(--tooltip-background) transparent;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
details-tab invoices-rules-dialog ui-side-dialog {
  z-index: 10 !important;
}
details-tab planning-edit-budget-dialog ui-confirm-dialog .dialog-inner {
  min-width: 540px;
  max-width: 540px;
}
details-tab planning-edit-budget-dialog .transaction {
  display: flex;
  align-items: center;
  height: 70px;
  border-bottom: var(--default-border);
  padding: 0 10px;
  width: 100%;
}
details-tab planning-edit-budget-dialog .transaction.disabled {
  background-color: var(--ultra-light-blue1);
}
details-tab planning-edit-budget-dialog .transaction:last-child {
  border-bottom: none;
}
details-tab planning-edit-budget-dialog .transaction .cell {
  color: var(--gray-color3);
}
details-tab planning-edit-budget-dialog .transaction .cell.date {
  width: 100px;
  max-width: 100px;
}
details-tab planning-edit-budget-dialog .transaction .cell.date .bdgDate {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  margin: auto 15px auto 0;
  white-space: nowrap;
}
details-tab planning-edit-budget-dialog .transaction .cell.account {
  padding-right: 10px;
  width: 75px;
  flex-wrap: wrap;
  font-weight: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
details-tab planning-edit-budget-dialog .transaction .cell.info {
  flex-grow: 1;
  width: 190px;
  padding: 0 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
details-tab planning-edit-budget-dialog .transaction .cell.info .tags {
  margin: 5px 0;
}
details-tab planning-edit-budget-dialog .transaction .cell.info .description, details-tab planning-edit-budget-dialog .transaction .cell.info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
details-tab planning-edit-budget-dialog .transaction .cell.status {
  width: 80px;
  padding: 5px 1px;
  text-align: center;
  margin-right: 15px;
  border-radius: var(--border-radius);
  cursor: pointer;
}
details-tab planning-edit-budget-dialog .transaction .cell.amount {
  color: var(--black-color0);
  flex-grow: 1;
  min-width: 80px;
  text-align: right;
  font-size: 13px;
  font-weight: 500;
  padding-right: 15px;
}
details-tab planning-edit-budget-dialog .transaction .cell.disabled {
  color: var(--gray-color3) !important;
}
details-tab planning-edit-budget-dialog .transaction .cell.category {
  flex-grow: 1;
  width: 30%;
  max-width: 255px;
  min-width: 200px;
  margin-left: 10px;
  margin-right: 10px;
  text-align: right;
}
details-tab planning-edit-budget-dialog .transaction .cell.category ui-dropdown {
  width: 100%;
}
details-tab planning-edit-budget-dialog .transaction .cell.category .drp-label {
  max-width: 255px;
  min-width: 200px;
  text-align: left;
}
details-tab planning-edit-budget-dialog .transaction .cell.category .drp-menu {
  text-align: left;
}
details-tab planning-edit-budget-dialog .transaction .cell.period {
  flex-grow: 1;
  display: flex;
  width: 30%;
  max-width: 215px;
  color: var(--blue-color3);
  font-weight: 500;
}
details-tab planning-edit-budget-dialog .transaction .cell.period div {
  display: flex;
  cursor: pointer;
  margin-left: auto;
  align-items: center;
}
details-tab planning-edit-budget-dialog .transaction .cell.period div:hover {
  color: var(--blue-color21);
}
details-tab planning-edit-budget-dialog .transaction .cell.period .text {
  margin: auto 10px;
}
details-tab planning-edit-budget-dialog .transaction .cell.period .text.text-uppercase {
  text-transform: uppercase !important;
}
details-tab planning-edit-budget-dialog .transaction .cell.period .disabled {
  cursor: default !important;
}
details-tab planning-edit-budget-dialog .transaction .cell.period .disabled .text {
  pointer-events: none;
  cursor: default !important;
  color: var(--default-font-color);
  opacity: 0.5;
}
details-tab planning-edit-budget-dialog .transaction .cell.period .period-link {
  min-width: 115px;
}
details-tab planning-edit-budget-dialog .transaction .cell.period .actions {
  width: 70px;
}
details-tab transaction-expected-dialog .form-line .dropdown {
  width: 100% !important;
}
details-tab .item-name {
  display: flex;
  align-items: center;
}
details-tab .item-name .touched-invoice {
  margin-left: 10px;
  width: 10px;
  height: 10px;
  background: var(--green-color8);
  border-radius: 50%;
}

today-common-filter .sub-title {
  color: var(--gray-color5);
  font-size: 16px;
  padding-bottom: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 21px;
}

today-common-table .table-header, today-overdue-invoices .table-header {
  position: sticky;
  top: 0;
  background: var(--white-color);
  z-index: 3;
}
today-common-table .header-toggle-link, today-overdue-invoices .header-toggle-link {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
}
today-common-table .download-wrapper, today-overdue-invoices .download-wrapper {
  margin-left: 10px;
  display: flex;
  margin-right: 20px;
}
today-common-table .download-wrapper ui-icon-button, today-overdue-invoices .download-wrapper ui-icon-button {
  background: var(--gray-color13);
  border: none;
  border-radius: 50%;
  width: 32px;
}
today-common-table .download-wrapper .add-budget, today-overdue-invoices .download-wrapper .add-budget {
  margin-right: 10px;
}
today-common-table .tooltip, today-overdue-invoices .tooltip {
  top: 100%;
  right: 0;
}
today-common-table .tooltip:after, today-overdue-invoices .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 20px);
}
today-common-table .today-transactions-table, today-overdue-invoices .today-transactions-table {
  padding: 23px 0 0 0 !important;
}
today-common-table .today-transactions-table .filter-input-wrapper, today-overdue-invoices .today-transactions-table .filter-input-wrapper {
  width: 320px;
  margin: 10px 0;
  position: relative;
}
today-common-table .today-transactions-table .filter-input-wrapper .search-text, today-overdue-invoices .today-transactions-table .filter-input-wrapper .search-text {
  width: 100%;
  border: none !important;
}
today-common-table .today-transactions-table .filter-input-wrapper input, today-overdue-invoices .today-transactions-table .filter-input-wrapper input {
  background: var(--gray-color13) !important;
  border-radius: 20px !important;
  border: none !important;
  height: 35px !important;
  color: var(--gray-color5) !important;
}
today-common-table .today-transactions-table .filter-input-wrapper .iconsax, today-overdue-invoices .today-transactions-table .filter-input-wrapper .iconsax {
  position: absolute;
  top: calc(50% - 12px);
  right: 10px;
}
today-common-table .today-transactions-table .filter-input-wrapper .search-button, today-overdue-invoices .today-transactions-table .filter-input-wrapper .search-button {
  position: absolute;
  font-size: 18px;
  right: 5px;
  text-align-last: center;
  top: 10px;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
today-common-table .today-transactions-table .body, today-overdue-invoices .today-transactions-table .body {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
}
today-common-table .today-transactions-table ui-plug, today-overdue-invoices .today-transactions-table ui-plug {
  padding: 0 15px;
}
today-common-table .today-transactions-table .ui-loader, today-overdue-invoices .today-transactions-table .ui-loader {
  margin: 20px auto;
  height: 60px;
}
today-common-table .today-transactions-table .title-wrapper, today-overdue-invoices .today-transactions-table .title-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin: 0 0px 10px 0px;
}
today-common-table .today-transactions-table .content-title, today-overdue-invoices .today-transactions-table .content-title {
  display: flex;
  align-items: center;
  height: 60px;
  transition: linear 0.2s;
  font-weight: 500;
  font-size: 12px;
  line-height: 14px;
  padding-right: 15px;
  color: var(--black-color0);
}
today-common-table .today-transactions-table .content-title .status-color-wrapper, today-overdue-invoices .today-transactions-table .content-title .status-color-wrapper {
  border-top-left-radius: 3px !important;
}
today-common-table .today-transactions-table .content-title .color-1, today-overdue-invoices .today-transactions-table .content-title .color-1 {
  border-left: 5px solid var(--orange-color1);
}
today-common-table .today-transactions-table .content-title.closed .status-color-wrapper, today-overdue-invoices .today-transactions-table .content-title.closed .status-color-wrapper {
  border-bottom-left-radius: 3px !important;
}
today-common-table .today-transactions-table .content-title.opened .chevron, today-overdue-invoices .today-transactions-table .content-title.opened .chevron {
  transform: rotate(0);
}
today-common-table .today-transactions-table .content-title.opened .title:hover, today-overdue-invoices .today-transactions-table .content-title.opened .title:hover {
  background: transparent;
}
today-common-table .today-transactions-table .content-title .chevron, today-overdue-invoices .today-transactions-table .content-title .chevron {
  transition: linear 0.2s;
  font-weight: 600;
  color: var(--gray-color10);
  font-size: 11px;
  margin-right: 10px;
}
today-common-table .today-transactions-table .content-title .content-title-wrapper, today-overdue-invoices .today-transactions-table .content-title .content-title-wrapper {
  display: flex;
  align-items: center;
  cursor: pointer;
}
today-common-table .today-transactions-table .content-title .total-price, today-overdue-invoices .today-transactions-table .content-title .total-price {
  width: calc((100% - 30px) / 100 * 10);
  margin-left: auto;
  text-align: right;
  padding: 15px 10px;
}
today-common-table .today-transactions-table .content-title .title-overdue, today-overdue-invoices .today-transactions-table .content-title .title-overdue {
  color: var(--orange-color1);
  width: calc((100% - 30px) / 100 * 12);
  padding: 15px 10px 15px 30px;
  margin-left: 2px;
}
today-common-table .today-transactions-table .content-title .actions-spacer, today-overdue-invoices .today-transactions-table .content-title .actions-spacer {
  width: calc((100% - 30px) / 100 * 5);
  padding: 15px 10px;
}
today-common-table .today-transactions-table .pagination, today-overdue-invoices .today-transactions-table .pagination {
  display: flex;
  justify-content: center;
  margin: 10px 0;
}
today-common-table .today-transactions-table .body, today-overdue-invoices .today-transactions-table .body {
  display: flex;
  flex-direction: column;
  background-color: var(--white-color);
}
today-common-table .today-transactions-table .body .filter, today-overdue-invoices .today-transactions-table .body .filter {
  display: flex;
  align-items: center;
  border-bottom: var(--default-border);
}
today-common-table .today-transactions-table .body .filter label, today-overdue-invoices .today-transactions-table .body .filter label {
  width: 5% !important;
  min-width: 80px;
  margin-left: 20px;
  color: var(--gray-color1);
}
today-common-table .today-transactions-table .body .filter .select, today-overdue-invoices .today-transactions-table .body .filter .select {
  padding-right: 20px;
  color: var(--black-color1);
}
today-common-table .today-transactions-table .body .more, today-overdue-invoices .today-transactions-table .body .more {
  display: flex;
  margin: auto;
  align-items: center;
}
today-common-table .today-transactions-table .body .cell, today-overdue-invoices .today-transactions-table .body .cell {
  width: 10%;
  padding: 19px 10px;
}
today-common-table .today-transactions-table .body .cell.date, today-overdue-invoices .today-transactions-table .body .cell.date {
  width: 5% !important;
  min-width: 80px;
  padding: 0 0 0 5px;
}
today-common-table .today-transactions-table .body .cell.name, today-overdue-invoices .today-transactions-table .body .cell.name {
  width: 18% !important;
}
today-common-table .today-transactions-table .body .cell.category, today-overdue-invoices .today-transactions-table .body .cell.category {
  flex-grow: 1;
  padding-right: 10px;
  width: 21%;
}
today-common-table .today-transactions-table .body .cell.status, today-overdue-invoices .today-transactions-table .body .cell.status {
  width: 12% !important;
  text-align: center !important;
  min-width: 120px !important;
}
today-common-table .today-transactions-table .body .cell.status .status-dropdown-wrapper, today-overdue-invoices .today-transactions-table .body .cell.status .status-dropdown-wrapper {
  width: 100% !important;
  justify-content: center;
  display: flex;
}
today-common-table .today-transactions-table .body .cell.status .status-dropdown-wrapper .drp-item, today-overdue-invoices .today-transactions-table .body .cell.status .status-dropdown-wrapper .drp-item {
  text-align: left !important;
}
today-common-table .today-transactions-table .body .cell .trx-actions, today-overdue-invoices .today-transactions-table .body .cell .trx-actions {
  flex-direction: row;
  display: flex;
}
today-common-table .today-transactions-table .body .cell.actions, today-overdue-invoices .today-transactions-table .body .cell.actions {
  min-width: 45px !important;
  width: 5%;
  text-align: right !important;
  padding: 12px 10px;
}
today-common-table .today-transactions-table .body .cell.actions .row-action, today-overdue-invoices .today-transactions-table .body .cell.actions .row-action {
  line-height: 38px;
  color: var(--blue-color3);
}
today-common-table .today-transactions-table .body .cell.actions span.cog, today-overdue-invoices .today-transactions-table .body .cell.actions span.cog {
  cursor: pointer;
}
today-common-table .today-transactions-table .body .cell.type, today-overdue-invoices .today-transactions-table .body .cell.type {
  width: 8%;
}
today-common-table .today-transactions-table .body .cell.amount, today-overdue-invoices .today-transactions-table .body .cell.amount {
  text-align: right !important;
}
today-common-table .today-transactions-table .body .cell.amount .amount, today-overdue-invoices .today-transactions-table .body .cell.amount .amount {
  font-weight: 500;
}
today-common-table .today-transactions-table .body .cell.date .link, today-overdue-invoices .today-transactions-table .body .cell.date .link {
  color: var(--blue-color3);
  cursor: pointer;
}
today-common-table .today-transactions-table .body .cell.date .link:hover, today-overdue-invoices .today-transactions-table .body .cell.date .link:hover {
  color: var(--blue-color21);
}
today-common-table .today-transactions-table .body .cell .amount-content, today-overdue-invoices .today-transactions-table .body .cell .amount-content {
  margin-top: 5px;
  height: 57px;
  align-items: center;
}
today-common-table .today-transactions-table .body .cell .amount-content .text-boxes, today-overdue-invoices .today-transactions-table .body .cell .amount-content .text-boxes {
  min-width: 80px;
  max-width: 100px;
}
today-common-table .today-transactions-table .body .cell .amount-content .amount, today-overdue-invoices .today-transactions-table .body .cell .amount-content .amount {
  font-weight: 500;
  font-size: 13px;
  line-height: 15px;
  margin: auto 0 auto auto;
}
today-common-table .today-transactions-table .body .cell .amount-content .icon-wrapper, today-overdue-invoices .today-transactions-table .body .cell .amount-content .icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
today-common-table .today-transactions-table .body .cell .amount-content .icon-wrapper .row-action, today-overdue-invoices .today-transactions-table .body .cell .amount-content .icon-wrapper .row-action {
  height: 25px;
  width: 25px;
  line-height: 25px !important;
}
today-common-table .today-transactions-table .body .status-color-wrapper, today-overdue-invoices .today-transactions-table .body .status-color-wrapper {
  width: 20px;
  height: 100%;
}
today-common-table .today-transactions-table .body .table-row, today-overdue-invoices .today-transactions-table .body .table-row {
  min-height: 56px;
  display: flex;
  align-items: flex-start;
}
today-common-table .today-transactions-table .body .table-row:last-child .status-color-wrapper, today-overdue-invoices .today-transactions-table .body .table-row:last-child .status-color-wrapper {
  border-bottom-left-radius: 3px !important;
}
today-common-table .today-transactions-table .body .table-row:nth-last-child(-n+5) .md-drppicker, today-overdue-invoices .today-transactions-table .body .table-row:nth-last-child(-n+5) .md-drppicker {
  top: -275px !important;
}
today-common-table .today-transactions-table .body .table-row .cell, today-overdue-invoices .today-transactions-table .body .table-row .cell {
  text-align: left;
}
today-common-table .today-transactions-table .body .table-row .cell.account, today-overdue-invoices .today-transactions-table .body .table-row .cell.account {
  padding-right: 10px;
  width: 75px;
  flex-wrap: wrap;
  font-weight: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
today-common-table .today-transactions-table .body .table-row .cell.date, today-overdue-invoices .today-transactions-table .body .table-row .cell.date {
  padding: 19px 0;
  color: var(--gray-color1);
}
today-common-table .today-transactions-table .body .table-row .cell.amount, today-overdue-invoices .today-transactions-table .body .table-row .cell.amount {
  color: var(--gray-color1);
}
today-common-table .today-transactions-table .body .table-row .cell.amount div, today-overdue-invoices .today-transactions-table .body .table-row .cell.amount div {
  width: 100%;
}
today-common-table .today-transactions-table .body .table-row .cell.amount div .amount, today-overdue-invoices .today-transactions-table .body .table-row .cell.amount div .amount {
  font-weight: 500;
}
today-common-table .today-transactions-table .body .table-row .cell .overflow, today-overdue-invoices .today-transactions-table .body .table-row .cell .overflow {
  width: 95%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
today-common-table .today-transactions-table .body .table-row .cell .counterpart-name, today-common-table .today-transactions-table .body .table-row .cell .name, today-overdue-invoices .today-transactions-table .body .table-row .cell .counterpart-name, today-overdue-invoices .today-transactions-table .body .table-row .cell .name {
  font-weight: 500;
}
today-common-table .today-transactions-table .body .table-row .cell.info, today-overdue-invoices .today-transactions-table .body .table-row .cell.info {
  flex-grow: 1;
  width: 240px;
  padding: 0 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
today-common-table .today-transactions-table .body .table-row .cell.info .tags, today-overdue-invoices .today-transactions-table .body .table-row .cell.info .tags {
  margin: 5px 0;
}
today-common-table .today-transactions-table .body .table-row .cell.info .description, today-common-table .today-transactions-table .body .table-row .cell.info .name, today-overdue-invoices .today-transactions-table .body .table-row .cell.info .description, today-overdue-invoices .today-transactions-table .body .table-row .cell.info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
today-common-table .today-transactions-table .body .table-row .cell.status, today-overdue-invoices .today-transactions-table .body .table-row .cell.status {
  margin-right: auto;
  display: flex;
}
today-common-table .today-transactions-table .body .table-row .cell.status .dropdown .drp-label, today-overdue-invoices .today-transactions-table .body .table-row .cell.status .dropdown .drp-label {
  text-align: left;
}
today-common-table .today-transactions-table .body .table-row .cell.category, today-overdue-invoices .today-transactions-table .body .table-row .cell.category {
  flex-grow: 1;
  padding: 10px 10px 10px 0;
}
today-common-table .today-transactions-table .body .table-row .cell.category .drp-category, today-overdue-invoices .today-transactions-table .body .table-row .cell.category .drp-category {
  flex-grow: 1;
  max-width: 255px;
  min-width: 200px;
}
today-common-table .today-transactions-table .body .table-row .cell.category .drp-category .dropdown, today-overdue-invoices .today-transactions-table .body .table-row .cell.category .drp-category .dropdown {
  width: 100%;
}
today-common-table .today-transactions-table .body .table-row .cell.type, today-overdue-invoices .today-transactions-table .body .table-row .cell.type {
  display: flex;
  align-items: center;
  color: var(--gray-color1);
  padding: 12px 10px;
}
today-common-table .today-transactions-table .body .table-row .cell.type > div, today-overdue-invoices .today-transactions-table .body .table-row .cell.type > div {
  line-height: 30px;
}
today-common-table .tag-wrapper, today-overdue-invoices .tag-wrapper {
  margin-top: 5px;
  display: flex;
}
today-common-table .tag, today-overdue-invoices .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  margin-right: 5px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
today-common-table .tag:not(:first-child), today-overdue-invoices .tag:not(:first-child) {
  margin-left: 5px;
}
today-common-table .tag.more-tag, today-overdue-invoices .tag.more-tag {
  min-width: unset;
  border: unset;
}
today-common-table .tag .tagName, today-overdue-invoices .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

today-overview-chart .details-link {
  margin-top: 10px;
}
today-overview-chart .chart-container {
  padding: unset !important;
}
today-overview-chart .chart-wrapper {
  padding: 0 15px 15px 15px;
  display: flex;
  flex-direction: column;
  width: 100%;
}
today-overview-chart .chart-wrapper .chart-header {
  position: sticky;
  top: 0;
  background-color: var(--white-color);
  z-index: 3;
}
today-overview-chart .chart-wrapper .chart-content {
  padding: 3px 0;
  flex-direction: row;
  display: flex;
}
today-overview-chart .chart-wrapper .chart-content .chart-data {
  width: 500px;
  border-bottom: var(--default-border);
}
today-overview-chart .chart-wrapper .chart-content .table-header {
  border-bottom: var(--default-border-header) !important;
  margin-top: 0 !important;
  display: flex;
}
today-overview-chart .chart-wrapper .chart-content .table-header .total-title {
  margin-top: auto;
  padding-bottom: 6px;
  color: var(--blue-color6);
  padding-left: 10px;
}
today-overview-chart .chart-wrapper .chart-content .table-header span {
  padding: 6px 15px 6px 0 !important;
  text-align: right;
}
today-overview-chart .chart-wrapper .chart-content .table-header span.comment {
  font-size: 11px;
  font-weight: 400;
}
today-overview-chart .chart-wrapper .chart-content .table-header span.total {
  margin-top: auto;
  color: var(--black-color0);
}
today-overview-chart .chart-wrapper .chart-content .table-header span.total.positiveTotal {
  color: var(--green-color1);
}
today-overview-chart .chart-wrapper .chart-content .table-header span.total.negativeTotal {
  color: var(--orange-color1);
}
today-overview-chart .chart-wrapper .chart-content .table-header .with-comments span {
  text-align: right;
}
today-overview-chart .chart-wrapper .chart-content .table-header .with-comments span.comment {
  font-size: 11px;
  padding: 0 15px 0 6px !important;
}
today-overview-chart .chart-wrapper .chart-content .table-data {
  width: calc(100% - 500px);
  display: flex;
  margin-top: 30px;
  border-bottom: var(--default-border);
}
today-overview-chart .chart-wrapper .chart-content .table-data div {
  align-items: flex-end;
  padding: 0 10px;
  display: flex;
  flex-direction: column;
}
today-overview-chart .chart-wrapper .chart-content .table-data div:first-child {
  width: 15%;
}
today-overview-chart .chart-wrapper .chart-content .table-data div:not(first-child) {
  width: 20%;
}
today-overview-chart .chart-wrapper .chart-content .table-data div.separate {
  width: 5%;
}
today-overview-chart .chart-wrapper .chart-content .table-data .negative {
  color: var(--orange-color1);
}
today-overview-chart .chart-wrapper .chart-content .table-data .positive {
  color: var(--green-color1);
}
today-overview-chart .chart-wrapper .chart-content .table-data span {
  padding: 6px 15px;
}
today-overview-chart .datepicker {
  margin-left: unset !important;
}
today-overview-chart .body {
  margin: 23px 0 0 0 !important;
}
today-overview-chart .sub-header {
  display: flex;
}
today-overview-chart .sub-header .sub-title:after {
  top: 25px !important;
}
today-overview-chart .sub-header .legend {
  margin-left: auto;
  display: flex;
}
today-overview-chart .sub-header .legend div {
  display: flex;
  margin-right: 20px;
}
today-overview-chart .sub-header .legend .dot {
  height: 15px;
  width: 15px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 10px;
}
today-overview-chart .sub-header .legend .line {
  height: 3px;
  width: 25px;
  display: inline-block;
  margin-right: 10px;
  margin-top: 6px;
  background-color: var(--blue-color12);
}
today-overview-chart .sub-header .legend.cash-in .actuals {
  background-color: var(--green-color1);
}
today-overview-chart .sub-header .legend.cash-in .expected {
  background-color: var(--green-color9);
}
today-overview-chart .sub-header .legend.cash-out .actuals {
  background-color: var(--orange-color1);
}
today-overview-chart .sub-header .legend.cash-out .expected {
  background-color: var(--orange-color7);
}
today-overview-chart .header-link-wrapper {
  margin-top: 20px;
  margin-left: 20px;
}
today-overview-chart .header-link-wrapper .label {
  margin-right: 20px;
  color: var(--gray-color1);
}
today-overview-chart .view-not-allowed {
  margin-top: 20px;
  margin-bottom: 0 !important;
}

@media screen and (max-width: 1450px) {
  today-common-table .today-transactions-table .cell.status, today-overdue-invoices .today-transactions-table .cell.status {
    padding-left: 10px !important;
  }
  today-common-table .title-overdue, today-overdue-invoices .title-overdue {
    padding-left: 10px !important;
  }
}
today-team-panel ui-side-dialog .side-panel-header {
  display: flex;
  align-items: center;
}
today-team-panel ui-side-dialog .dialog-inner {
  width: 850px !important;
}
today-team-panel ui-side-dialog .dialog-inner .content {
  padding: 0 23px 23px 23px !important;
}
today-team-panel ui-side-dialog .btn-add-team-member {
  margin-left: auto;
}
today-team-panel ui-side-dialog .loader {
  margin: 0 auto;
}
today-team-panel ui-side-dialog .no-team-member {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
}
today-team-panel ui-side-dialog .header {
  display: block;
  height: 27px;
}
today-team-panel ui-side-dialog .header .item {
  display: block;
  vertical-align: top;
  width: 100%;
}
today-team-panel ui-side-dialog .header .item .success-summary {
  margin-top: 0 !important;
  background: var(--green-color3);
  padding: 5px 0 5px 20px;
  color: var(--green-color1);
}
today-team-panel ui-side-dialog .header .item .error-summary {
  margin-top: 0 !important;
  background: var(--orange-color2);
  padding: 5px 0 5px 20px;
}
today-team-panel ui-side-dialog .header .item .error-summary .error-message {
  color: var(--orange-color1);
}
today-team-panel ui-side-dialog .default-table th {
  border-bottom: var(--default-border-header);
  vertical-align: middle;
  color: var(--gray-color3);
}
today-team-panel ui-side-dialog .default-table td, today-team-panel ui-side-dialog .default-table th {
  padding: 10px 10px;
}
today-team-panel ui-side-dialog .default-table td:first-child, today-team-panel ui-side-dialog .default-table th:first-child {
  padding-left: 10px;
}
today-team-panel ui-side-dialog .default-table .icons {
  width: 70px;
  padding: 10px 0;
}
today-team-panel ui-side-dialog .default-table .icons ui-button {
  display: inline-block;
}
today-team-panel ui-side-dialog .default-table .column {
  width: 15%;
  max-width: 100px;
  word-wrap: break-word;
}
today-team-panel ui-side-dialog .default-table .column.mfa {
  width: 20px !important;
}
today-team-panel ui-side-dialog .default-table .column.mfa .mfa-inner {
  display: flex;
}
today-team-panel ui-side-dialog .default-table .email-column {
  width: 25%;
}
today-team-panel ui-side-dialog .default-table .role-column {
  min-width: 155px;
  padding: 10px 0;
}
today-team-panel ui-side-dialog .default-table .actions-spacer {
  width: 70px;
}
today-team-panel ui-side-dialog .default-table .role-spacer {
  width: 100px;
}
today-team-panel ui-side-dialog .default-table .category {
  max-width: 255px;
  min-width: 255px;
}
today-team-panel ui-side-dialog .default-table .trunc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
today-team-panel ui-side-dialog .default-table .email {
  width: 20%;
}
today-team-panel ui-side-dialog .default-table .name {
  color: var(--black-color0);
  font-weight: 500;
}
today-team-panel ui-side-dialog .default-table .invalid {
  border: 1px solid var(--orange-color1);
}
today-team-panel ui-side-dialog .default-table .icon {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin: auto 5px auto 0;
}
today-team-panel ui-side-dialog .default-table .icon.active {
  background-color: var(--green-color2);
}
today-team-panel ui-side-dialog .default-table .icon.inactive {
  background-color: var(--orange-color1);
}
today-team-panel ui-side-dialog .loader-for-row-height .loader {
  width: 40px;
  margin: 0 0 0 auto;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-integration-global {
  position: relative;
}
page-integration-global .dialog-inner .input-label-title {
  font-size: 16px;
  margin-bottom: 10px;
  color: var(--gray-color1);
  line-height: 1.3076923077;
}
page-integration-global .dialog-inner .sub-block-title {
  margin-bottom: 5px;
  margin-top: 20px;
  display: flex;
}
page-integration-global .dialog-inner .sub-block-title span {
  color: var(--orange-color1);
}
page-integration-global .dialog-inner .sub-block-title__box {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
page-integration-global .dialog-inner .sub-block-title__box__column {
  flex: 1;
}
page-integration-global .dialog-inner .factoring-rate {
  display: flex;
  align-items: center;
}
page-integration-global .dialog-inner .factoring-rate .input-block {
  width: 65px;
}
page-integration-global .dialog-inner .factoring-rate span {
  padding: 0 5px;
}
page-integration-global .dialog-inner .email-with-domain {
  display: flex;
  align-items: center;
}
page-integration-global .dialog-inner .email-with-domain span {
  padding: 0 5px;
}
page-integration-global .dialog-inner ui-address-form {
  margin-top: 20px;
}
page-integration-global .dialog-inner .step-title {
  font-weight: 500;
  font-size: 16px;
  padding: 0px 0px 20px 0px;
  color: var(--black-color0);
}
page-integration-global .dialog-inner .contracts {
  overflow-y: auto;
  max-height: 70vh;
}
page-integration-global .dialog-inner .contracts {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  page-integration-global .dialog-inner .contracts { /* For Firefox */
    scrollbar-width: thin;
  }
}
page-integration-global .dialog-inner .contracts::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
page-integration-global .dialog-inner .contracts::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
page-integration-global .dialog-inner .contracts::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
page-integration-global .dialog-inner .documents-section {
  column-count: 2;
  column-gap: 40px;
}
page-integration-global .dialog-inner .documents-section > div {
  padding-top: 2px;
  break-inside: avoid;
}
page-integration-global .dialog-inner .doc-type {
  margin-bottom: 10px;
  margin-top: 10px;
  display: flex;
  align-items: center;
}
page-integration-global .dialog-inner .doc-type .text {
  margin-left: 10px;
}
page-integration-global .dialog-inner .group-type {
  margin-top: 10px;
  color: var(--black-color0);
}
page-integration-global .dialog-inner .columns {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
  list-style: none;
  margin: 0;
  padding: 0;
}
page-integration-global .dialog-inner .columns.row-4 {
  height: 160px;
}
page-integration-global .dialog-inner .columns.row-5 {
  height: 200px;
}
page-integration-global .dialog-inner .columns.row-6 {
  height: 240px;
}
page-integration-global .dialog-inner .columns li {
  margin-right: auto;
  width: 33%;
}
page-integration-global .dialog-inner app-datepicker {
  margin-left: 0 !important;
  margin-bottom: 5px;
}
page-integration-global .dialog-inner app-datepicker .input-text {
  margin-left: 0 !important;
}
page-integration-global .dialog-inner app-datepicker .link {
  font-weight: 500;
  color: var(--blue-color3);
  white-space: nowrap;
  cursor: pointer;
}
page-integration-global .dialog-inner .date .note-title {
  font-size: 10px;
  margin: 10px 0;
}
page-integration-global .dialog-inner .disabled {
  opacity: 0.5;
  cursor: unset !important;
}
page-integration-global .dialog-inner input[type=checkbox] {
  left: -9999px;
  position: absolute;
  top: -9999px;
  visibility: hidden;
}
page-integration-global .dialog-inner input[type=checkbox] + label {
  cursor: pointer;
  position: relative;
  padding-left: 25px;
  display: inline-block;
  vertical-align: top;
  color: var(--black-color0);
}
page-integration-global .dialog-inner input[type=checkbox] + label:before {
  content: " ";
  position: absolute;
  top: -1px;
  left: 0;
  width: 19px;
  height: 19px;
  border: 1px solid var(--gray-color21);
  background: var(--white-color);
  border-radius: var(--border-radius);
}
page-integration-global .dialog-inner input[type=checkbox]:checked + label:after {
  content: "";
  background: url(/assets/images/checkmark.png);
  width: 15px;
  height: 14px;
  position: absolute;
  top: 1px;
  left: 2px;
  display: inline-block;
}
page-integration-global .dialog-inner .button-wrapper {
  display: flex;
  justify-content: flex-end;
  margin-top: 40px;
  gap: 16px;
  position: sticky;
  bottom: 0;
  padding: 10px 20px;
  margin-left: -20px;
  margin-right: -20px;
  width: calc(100% + 40px);
  background: var(--white-color);
  z-index: 1; /* Ensure it stays above other content */
}
page-integration-global .dialog-inner .beta {
  padding-left: 15px;
}
page-integration-global .card {
  color: var(--black-color0);
}
page-integration-global .card .integrated-card {
  border: 2px solid var(--green-color1) !important;
}
page-integration-global .card .card-header {
  padding: 0px 25px 0px 25px;
}
page-integration-global .card .card-header .card-title-border {
  padding-left: 0;
  margin: 0;
}
page-integration-global .card .integrated {
  border: 1px solid var(--green-color1);
  border-radius: 20px;
  height: 32px;
  cursor: pointer;
  padding: 0 10px;
  line-height: 1;
  align-items: center;
  display: flex;
  color: var(--green-color1);
  font-size: 13px;
  font-weight: 400;
}
page-integration-global .card .integrated img {
  width: 20px;
  margin-right: 10px;
}
page-integration-global .card .button-wrapper {
  display: flex;
  justify-content: space-between;
}
page-integration-global .card .input-block,
page-integration-global .card .connect-form {
  width: 100%;
  margin-bottom: 10px;
}
page-integration-global .card .card-title {
  font-weight: bold;
  font-size: 18px;
}
page-integration-global .card .card-subtitle {
  font-weight: 500;
  font-size: 15px;
  padding: 25px 25px 0 25px;
}
page-integration-global .card .card-content {
  padding: 25px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 15px;
}
page-integration-global .card .card-content.card-content-integrations {
  grid-auto-rows: 215px;
}
page-integration-global .card .card-content.card-content-integrations .buttons {
  display: flex;
}
page-integration-global .card .card-content.card-content-integrations .buttons > * {
  margin: 0 5px;
}
page-integration-global .card .card-content-ksv {
  grid-template-columns: 1fr;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  background: var(--white-color);
  margin: 25px;
}
page-integration-global .card .card-content-ksv .img-wrapper {
  margin-top: 32px;
  justify-content: flex-start;
}
page-integration-global .card .integration-card {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  padding: 10px;
  background: var(--white-color);
  position: relative;
}
page-integration-global .card .integration-card .badge-top-right {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  line-height: 1.2;
  padding: 4px 8px;
  border-radius: 12px;
  font-weight: 600;
  white-space: nowrap;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  /* Ensure sufficient color contrast (WCAG AA) */
  /* Light mode: #CBD9E3 bg with #000000 text = ~9.5:1 contrast ratio */
  /* Dark mode: #292F3F bg with #F0F1F5 text = ~12:1 contrast ratio */
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 1;
  background: var(--gray-color14);
  color: var(--black-color0);
}
page-integration-global .card .integration-card .badge-top-right:focus-visible {
  outline: 2px solid var(--blue-color3);
  outline-offset: 2px;
}
page-integration-global .card .integration-card .badge-top-right.badge-orange {
  background: var(--orange-color4);
  color: #FFFFFF;
  color: #FFFFFF !important;
}
page-integration-global .card .integration-card .title {
  font-weight: 500;
  font-size: 13px;
  display: flex;
  align-items: center;
  line-height: 1;
  margin-bottom: 20px;
  text-align: center;
}
page-integration-global .card .integration-card .title.with-hint {
  margin-left: 15px;
}
page-integration-global .card .integration-card .title .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--gray-color14);
  color: var(--black-color0);
  font-size: 11px;
  line-height: 1;
  padding: 2px 6px;
  border-radius: 10px;
  margin-left: 8px;
  font-weight: 500;
  vertical-align: middle;
  white-space: nowrap;
  /* Ensure sufficient color contrast (WCAG AA) */
  /* Light mode: #CBD9E3 bg with #000000 text = ~9.5:1 contrast ratio */
  /* Dark mode: #292F3F bg with #F0F1F5 text = ~12:1 contrast ratio */
}
page-integration-global .card .integration-card .title .badge:focus-visible {
  outline: 2px solid var(--blue-color3);
  outline-offset: 2px;
}
page-integration-global .card .integration-card .title ui-icon-hint .tooltip {
  bottom: -40px;
  left: -10px;
}
page-integration-global .card .integration-card .title ui-icon-hint .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: 15px;
}
page-integration-global .card .integration-card .status {
  margin-top: 2px;
  margin-bottom: 10px;
  height: 20px;
}
page-integration-global .card .integration-card:hover {
  border: 1px solid var(--green-color1);
}
page-integration-global .card .integration-card.empty {
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
}
page-integration-global .card .img-wrapper-align {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
page-integration-global .card .img-wrapper {
  height: auto;
  min-height: 100px;
  display: flex;
  align-items: center;
}
page-integration-global .card .row {
  padding: 0 25px;
  display: flex;
}
page-integration-global .card .ksv-title {
  display: flex;
  align-items: center;
  margin-bottom: 25px;
}
page-integration-global .card .ksv-title ui-icon-hint {
  margin: 0 0 0 10px;
}
page-integration-global .card .wrapper-item {
  padding: 25px;
  font-size: 14px;
}
page-integration-global .card .credit-wrapper.warning {
  padding-bottom: 40px;
}
page-integration-global .card .credit-wrapper .text-width {
  margin-bottom: 2px;
}
page-integration-global .card .credit-wrapper .txt-search {
  margin-bottom: 20px;
  width: 100%;
  max-width: 310px;
}
page-integration-global .card .credit-wrapper .txt-search input {
  border-radius: 20px;
  padding-left: 40px;
}
page-integration-global .card .credit-wrapper .txt-search span.icon {
  left: 15px;
}
page-integration-global .card .credit-wrapper .credit-list {
  margin: 20px 0;
  border-bottom: var(--default-border);
}
page-integration-global .card .credit-wrapper .item {
  padding: 0 10px;
  height: 45px;
  line-height: 45px;
  overflow: hidden;
  border: 1px solid var(--white-color);
  transition: linear 0.2s;
  border-top: var(--default-border);
  align-items: center;
  font-weight: 500;
  font-size: 13px;
  color: var(--gray-color3);
  cursor: pointer;
}
page-integration-global .card .credit-wrapper .item:hover, page-integration-global .card .credit-wrapper .item.active {
  background: var(--green-color3);
  border-bottom: 1px solid var(--green-color3);
}
page-integration-global .card .credit-wrapper .title {
  margin-top: 40px;
  margin-bottom: 18px;
}
page-integration-global .card .credit-wrapper .button {
  margin: 20px 0;
}
page-integration-global .permissionError {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 300px;
  font-size: 24px;
}
page-integration-global .connect-form {
  padding: 10px 20px;
  display: flex;
  align-items: stretch;
  flex-direction: column;
}
page-integration-global .connect-form .no-data-popup {
  z-index: 2;
}
page-integration-global .connect-form .input-row {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}
page-integration-global .connect-form .input-row label {
  font-size: 16px;
  margin-bottom: 10px;
}
page-integration-global .connect-form .input-row .field {
  display: flex;
}
page-integration-global .connect-form .input-row .field .input-block {
  flex-grow: 2;
}
page-integration-global .connect-form .input-row .field .http {
  width: 68px;
  margin-right: 5px;
}
page-integration-global .connect-form .input-row .field .http input {
  border: none;
}
page-integration-global .connect-form .input-row .field .domain {
  width: 115px;
  margin-left: 5px;
}
page-integration-global .connect-form .input-row .field .domain input {
  border: none;
}
page-integration-global .connect-form .input-row .note-title {
  font-size: 10px;
  margin-top: 10px;
}
page-integration-global .connect-form .img-wrapper {
  height: auto;
  min-height: 100px;
  display: flex;
  align-items: center;
}
page-integration-global .modal {
  width: 400px;
}
page-integration-global .confirm-delete {
  position: relative;
  top: -20px;
  display: block;
}
page-integration-global .confirm-delete .text-boxes {
  text-align: left;
}
page-integration-global .picker {
  position: relative;
}
page-integration-global .integration-card ui-text-button.green {
  width: 80px;
}
page-integration-global .integration-card .upload-xls-loader {
  width: auto;
}
page-integration-global .integration-card .upload-xls-loader .loader {
  width: 20px;
  margin: 0;
}
page-integration-global .integration-card .upload-xls-loader .image-load {
  margin: -10px 0 0 -10px !important;
  width: 20px !important;
}
page-integration-global .with-promo {
  grid-auto-rows: unset !important;
}

.tabs-filter__box {
  padding-bottom: 20px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
app-comment-with-filter ui-plug {
  padding-top: 10px !important;
}
app-comment-with-filter .header-section {
  margin: 25px 20px 0px 268px;
}
app-comment-with-filter .header-section span {
  font-size: 20px;
  line-height: 24px;
  font-weight: 500;
  color: var(--gray-color5);
  margin-left: 16px;
}
app-comment-with-filter .content-section {
  display: flex;
}
app-comment-with-filter .left-panel {
  width: calc(100% - 268px);
  max-width: 1132px;
  min-width: 520px;
}
app-comment-with-filter .navigation-panel {
  width: 268px;
  padding: 10px 20px 20px 20px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
app-comment-with-filter .navigation-panel .nav-item-outer {
  display: flex;
}
app-comment-with-filter .navigation-panel .nav-item-outer .nav-item {
  line-height: 24px;
}
app-comment-with-filter .navigation-panel .nav-item-outer .nav-item.active {
  color: var(--black-color0);
  font-weight: 500;
  background: var(--gray-comment-feed-active);
}
app-comment-with-filter .navigation-panel .nav-item-outer .nav-item .notification-count {
  margin-right: 2px;
  margin-bottom: 5px;
}
app-comment-with-filter .filter-header {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 15px 30px 15px 0px;
}
app-comment-with-filter .filter-header .text {
  margin-left: 10px;
  color: var(--gray-color1);
  font-size: 16px;
  font-weight: 500;
}
app-comment-with-filter .filter-header .iconsax {
  --Iconsax-Color: var(--gray-color15);
  --Iconsax-Size: 20px;
  margin-left: auto;
}
app-comment-with-filter .filter-panel {
  width: 268px;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 24px;
}
app-comment-with-filter .filter-panel .filter-input-wrapper {
  position: relative;
  margin-right: 30px;
  width: 232px;
  height: 32px;
  flex-shrink: 0;
}
app-comment-with-filter .filter-panel .filter-input-wrapper .search-text {
  width: 100%;
  border: none !important;
}
app-comment-with-filter .filter-panel .filter-input-wrapper input {
  background: var(--gray-color13) !important;
  border-radius: 20px !important;
  border: none !important;
  height: 35px !important;
  color: var(--gray-color5) !important;
}
app-comment-with-filter .filter-panel .filter-input-wrapper .iconsax {
  position: absolute;
  top: calc(50% - 10px);
  right: 10px;
}
app-comment-with-filter .filter-panel .filter-input-wrapper .search-button {
  position: absolute;
  font-size: 18px;
  right: 5px;
  text-align-last: center;
  top: 10px;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
app-comment-with-filter .filter-panel .sub-filter {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
app-comment-with-filter .filter-panel .sub-filter .sub-header {
  margin-left: auto;
  padding-right: 30px;
}
app-comment-with-filter .filter-panel .sub-filter .users {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  place-content: flex-end;
  padding-right: 30px;
}
app-comment-with-filter .filter-panel .sub-filter .users .tweet__icon {
  cursor: pointer;
  min-width: 32px;
  width: 32px;
  height: 32px;
  line-height: 30px;
  font-size: 13px;
  border: 2px solid transparent;
  display: block !important;
}
app-comment-with-filter .filter-panel .sub-filter .users .tweet__icon.active {
  border: 2px solid var(--blue-color6) !important;
}
app-comment-with-filter .filter-panel .sub-filter .users .tooltip {
  margin-top: 10px;
}
app-comment-with-filter .filter-panel .sub-filter .users .tooltip:after {
  content: "";
  top: -9px;
  left: 12px;
  position: absolute;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent var(--tooltip-background) transparent;
}
app-comment-with-filter .filter-panel .sub-filter .links {
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  align-content: center;
  flex-wrap: wrap;
  padding-right: 14px;
}
app-comment-with-filter .filter-panel .sub-filter .links .linktab {
  display: flex;
  padding: 8px 16px 9px 16px;
  align-items: flex-start;
  gap: 10px;
  color: var(--blue-color6);
  text-decoration: none;
  line-height: 13px;
}
app-comment-with-filter .filter-panel .sub-filter .links .linktab.active {
  background-color: var(--button-blue-background);
  border-radius: 20px;
}
app-comment-with-filter .filter-panel .sub-filter.disabled .tweet__icon, app-comment-with-filter .filter-panel .sub-filter.disabled .linktab {
  opacity: 0.5;
  cursor: default;
}
app-comment-with-filter app-activity-aggregated-feed .show-more {
  margin-top: 10px;
}

app-comment-aggregated-feed ui-plug, app-activity-aggregated-feed ui-plug {
  padding-top: 0px !important;
}

app-comment-feed .loader, app-activity-feed .loader {
  width: 100%;
  margin-top: 20px;
}

app-activity-feed ui-plug {
  padding: 0px !important;
}
app-activity-feed .comments-item {
  box-shadow: unset !important;
  position: relative;
  background: unset !important;
}
app-activity-feed .comments-item:not(:last-child) .tweet__body:before {
  border-left: 1.7px dashed var(--gray-color14);
  content: "";
  position: relative;
  top: 42px;
  left: 21px;
}
app-activity-feed .tweet.comment {
  background: unset !important;
}

app-comment-feed :host, app-comment-aggregated-feed :host, app-comment-with-filter :host, app-activity-feed :host, app-activity-aggregated-feed :host {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
}
app-comment-feed .container, app-comment-aggregated-feed .container, app-comment-with-filter .container, app-activity-feed .container, app-activity-aggregated-feed .container {
  display: flex;
  justify-content: space-between;
}
app-comment-feed .container ui-text-button, app-comment-aggregated-feed .container ui-text-button, app-comment-with-filter .container ui-text-button, app-activity-feed .container ui-text-button, app-activity-aggregated-feed .container ui-text-button {
  margin-top: auto;
  margin-bottom: auto;
  padding-right: 30px;
  padding-left: 30px;
}
app-comment-feed .container .section-title, app-comment-aggregated-feed .container .section-title, app-comment-with-filter .container .section-title, app-activity-feed .container .section-title, app-activity-aggregated-feed .container .section-title {
  line-height: 15px;
  color: var(--black-color0);
  padding-top: 25px !important;
  padding-bottom: 10px !important;
  font-size: 15px;
  font-weight: 500;
}
app-comment-feed .container .text, app-comment-aggregated-feed .container .text, app-comment-with-filter .container .text, app-activity-feed .container .text, app-activity-aggregated-feed .container .text {
  color: var(--gray-color5);
  line-height: 17px;
  margin-bottom: 5px;
  font-size: 13px;
}
app-comment-feed .comments-item, app-comment-aggregated-feed .comments-item, app-comment-with-filter .comments-item, app-activity-feed .comments-item, app-activity-aggregated-feed .comments-item {
  margin: 10px 0px;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  background: var(--ultra-light-blue1);
}
app-comment-feed .comments-item .comment-line, app-comment-aggregated-feed .comments-item .comment-line, app-comment-with-filter .comments-item .comment-line, app-activity-feed .comments-item .comment-line, app-activity-aggregated-feed .comments-item .comment-line {
  display: flex;
}
app-comment-feed .comments-item.new, app-comment-aggregated-feed .comments-item.new, app-comment-with-filter .comments-item.new, app-activity-feed .comments-item.new, app-activity-aggregated-feed .comments-item.new {
  box-shadow: none;
  background: none;
}
app-comment-feed .comments-item .text-comment, app-comment-aggregated-feed .comments-item .text-comment, app-comment-with-filter .comments-item .text-comment, app-activity-feed .comments-item .text-comment, app-activity-aggregated-feed .comments-item .text-comment {
  color: var(--black-color1);
}
app-comment-feed .tweet:last-child, app-comment-feed .tweet:first-child, app-comment-aggregated-feed .tweet:last-child, app-comment-aggregated-feed .tweet:first-child, app-comment-with-filter .tweet:last-child, app-comment-with-filter .tweet:first-child, app-activity-feed .tweet:last-child, app-activity-feed .tweet:first-child, app-activity-aggregated-feed .tweet:last-child, app-activity-aggregated-feed .tweet:first-child {
  border-radius: 5px;
}
app-comment-feed .tweet, app-comment-aggregated-feed .tweet, app-comment-with-filter .tweet, app-activity-feed .tweet, app-activity-aggregated-feed .tweet {
  flex: 1;
  padding: 16px;
}
app-comment-feed .tweet .link, app-comment-aggregated-feed .tweet .link, app-comment-with-filter .tweet .link, app-activity-feed .tweet .link, app-activity-aggregated-feed .tweet .link {
  display: block;
  padding-bottom: 5px;
  text-decoration: none;
  width: 100%;
}
app-comment-feed .tweet__icon, app-comment-aggregated-feed .tweet__icon, app-comment-with-filter .tweet__icon, app-activity-feed .tweet__icon, app-activity-aggregated-feed .tweet__icon {
  line-height: 41px;
  width: 41px;
  min-width: 41px;
  height: 41px;
  border-radius: 50%;
  font-size: 15px;
  text-align: center;
  color: var(--white-color);
}
app-comment-feed .tweet.comment, app-comment-aggregated-feed .tweet.comment, app-comment-with-filter .tweet.comment, app-activity-feed .tweet.comment, app-activity-aggregated-feed .tweet.comment {
  background: var(--white-color);
}
app-comment-feed .tweet .liked, app-comment-aggregated-feed .tweet .liked, app-comment-with-filter .tweet .liked, app-activity-feed .tweet .liked, app-activity-aggregated-feed .tweet .liked {
  display: flex;
  margin-bottom: 10px;
}
app-comment-feed .tweet .liked span, app-comment-aggregated-feed .tweet .liked span, app-comment-with-filter .tweet .liked span, app-activity-feed .tweet .liked span, app-activity-aggregated-feed .tweet .liked span {
  margin-right: 10px;
  font-weight: bold;
}
app-comment-feed .tweet .link-default.deleted, app-comment-aggregated-feed .tweet .link-default.deleted, app-comment-with-filter .tweet .link-default.deleted, app-activity-feed .tweet .link-default.deleted, app-activity-aggregated-feed .tweet .link-default.deleted {
  text-decoration: line-through;
  opacity: 0.5;
}
app-comment-feed .tweet__body, app-comment-feed .tweet__info, app-comment-aggregated-feed .tweet__body, app-comment-aggregated-feed .tweet__info, app-comment-with-filter .tweet__body, app-comment-with-filter .tweet__info, app-activity-feed .tweet__body, app-activity-feed .tweet__info, app-activity-aggregated-feed .tweet__body, app-activity-aggregated-feed .tweet__info {
  display: flex;
}
app-comment-feed .tweet__info, app-comment-aggregated-feed .tweet__info, app-comment-with-filter .tweet__info, app-activity-feed .tweet__info, app-activity-aggregated-feed .tweet__info {
  flex-direction: column;
  margin-left: 16px;
  width: calc(100% - 55px);
  position: relative;
}
app-comment-feed .tweet__text, app-comment-aggregated-feed .tweet__text, app-comment-with-filter .tweet__text, app-activity-feed .tweet__text, app-activity-aggregated-feed .tweet__text {
  line-height: 20px;
  margin-top: 3px;
  width: 100%;
  color: var(--gray-color5);
  overflow-wrap: anywhere;
}
app-comment-feed .tweet__message, app-comment-aggregated-feed .tweet__message, app-comment-with-filter .tweet__message, app-activity-feed .tweet__message, app-activity-aggregated-feed .tweet__message {
  display: flex;
  position: relative;
}
app-comment-feed .tweet__message__textarea, app-comment-aggregated-feed .tweet__message__textarea, app-comment-with-filter .tweet__message__textarea, app-activity-feed .tweet__message__textarea, app-activity-aggregated-feed .tweet__message__textarea {
  margin: 5px auto 7px auto;
  width: 100%;
}
app-comment-feed .tweet__details, app-comment-aggregated-feed .tweet__details, app-comment-with-filter .tweet__details, app-activity-feed .tweet__details, app-activity-aggregated-feed .tweet__details {
  width: 100%;
}
app-comment-feed .tweet__actor, app-comment-aggregated-feed .tweet__actor, app-comment-with-filter .tweet__actor, app-activity-feed .tweet__actor, app-activity-aggregated-feed .tweet__actor {
  font-size: 11px;
  margin-bottom: 2px;
}
app-comment-feed .tweet__actor .line, app-comment-aggregated-feed .tweet__actor .line, app-comment-with-filter .tweet__actor .line, app-activity-feed .tweet__actor .line, app-activity-aggregated-feed .tweet__actor .line {
  margin: 0px 5px;
}
app-comment-feed .tweet__date, app-comment-aggregated-feed .tweet__date, app-comment-with-filter .tweet__date, app-activity-feed .tweet__date, app-activity-aggregated-feed .tweet__date {
  color: var(--gray-color1);
  position: relative;
  line-height: 13px;
}
app-comment-feed .tweet__action ui-button .text, app-comment-feed .tweet__breadcrumbs ui-button .text, app-comment-aggregated-feed .tweet__action ui-button .text, app-comment-aggregated-feed .tweet__breadcrumbs ui-button .text, app-comment-with-filter .tweet__action ui-button .text, app-comment-with-filter .tweet__breadcrumbs ui-button .text, app-activity-feed .tweet__action ui-button .text, app-activity-feed .tweet__breadcrumbs ui-button .text, app-activity-aggregated-feed .tweet__action ui-button .text, app-activity-aggregated-feed .tweet__breadcrumbs ui-button .text {
  padding: 0 !important;
}
app-comment-feed .tweet__action ui-button button, app-comment-feed .tweet__breadcrumbs ui-button button, app-comment-aggregated-feed .tweet__action ui-button button, app-comment-aggregated-feed .tweet__breadcrumbs ui-button button, app-comment-with-filter .tweet__action ui-button button, app-comment-with-filter .tweet__breadcrumbs ui-button button, app-activity-feed .tweet__action ui-button button, app-activity-feed .tweet__breadcrumbs ui-button button, app-activity-aggregated-feed .tweet__action ui-button button, app-activity-aggregated-feed .tweet__breadcrumbs ui-button button {
  min-height: 20px !important;
}
app-comment-feed .tweet__action .textx, app-comment-feed .tweet__breadcrumbs .textx, app-comment-aggregated-feed .tweet__action .textx, app-comment-aggregated-feed .tweet__breadcrumbs .textx, app-comment-with-filter .tweet__action .textx, app-comment-with-filter .tweet__breadcrumbs .textx, app-activity-feed .tweet__action .textx, app-activity-feed .tweet__breadcrumbs .textx, app-activity-aggregated-feed .tweet__action .textx, app-activity-aggregated-feed .tweet__breadcrumbs .textx {
  color: var(--gray-color1);
  font-size: 11px !important;
}
app-comment-feed .tweet__action .deleted, app-comment-feed .tweet__breadcrumbs .deleted, app-comment-aggregated-feed .tweet__action .deleted, app-comment-aggregated-feed .tweet__breadcrumbs .deleted, app-comment-with-filter .tweet__action .deleted, app-comment-with-filter .tweet__breadcrumbs .deleted, app-activity-feed .tweet__action .deleted, app-activity-feed .tweet__breadcrumbs .deleted, app-activity-aggregated-feed .tweet__action .deleted, app-activity-aggregated-feed .tweet__breadcrumbs .deleted {
  text-decoration: line-through;
  opacity: 0.5;
}
app-comment-feed .tweet .textarea, app-comment-aggregated-feed .tweet .textarea, app-comment-with-filter .tweet .textarea, app-activity-feed .tweet .textarea, app-activity-aggregated-feed .tweet .textarea {
  overflow-y: hidden;
  min-height: 18px !important;
  border: var(--default-border);
  border-radius: var(--border-radius);
  background: var(--white-input-background);
  resize: none;
  width: calc(100% - 31px);
  font: 13px/1.3 var(--default-font);
  color: var(--black-color1);
  padding: 6px 25px 6px 6px;
  box-sizing: content-box;
}
app-comment-feed .tweet .textarea:focus::placeholder, app-comment-aggregated-feed .tweet .textarea:focus::placeholder, app-comment-with-filter .tweet .textarea:focus::placeholder, app-activity-feed .tweet .textarea:focus::placeholder, app-activity-aggregated-feed .tweet .textarea:focus::placeholder {
  color: transparent;
}
app-comment-feed .tweet .textarea:focus::-webkit-input-placeholder, app-comment-aggregated-feed .tweet .textarea:focus::-webkit-input-placeholder, app-comment-with-filter .tweet .textarea:focus::-webkit-input-placeholder, app-activity-feed .tweet .textarea:focus::-webkit-input-placeholder, app-activity-aggregated-feed .tweet .textarea:focus::-webkit-input-placeholder {
  color: transparent;
}
app-comment-feed .tweet .textarea:focus:-moz-placeholder, app-comment-aggregated-feed .tweet .textarea:focus:-moz-placeholder, app-comment-with-filter .tweet .textarea:focus:-moz-placeholder, app-activity-feed .tweet .textarea:focus:-moz-placeholder, app-activity-aggregated-feed .tweet .textarea:focus:-moz-placeholder {
  color: transparent;
}
app-comment-feed .tweet .textarea:focus::-moz-placeholder, app-comment-aggregated-feed .tweet .textarea:focus::-moz-placeholder, app-comment-with-filter .tweet .textarea:focus::-moz-placeholder, app-activity-feed .tweet .textarea:focus::-moz-placeholder, app-activity-aggregated-feed .tweet .textarea:focus::-moz-placeholder {
  color: transparent;
}
app-comment-feed .tweet .textarea:focus:-ms-input-placeholder, app-comment-aggregated-feed .tweet .textarea:focus:-ms-input-placeholder, app-comment-with-filter .tweet .textarea:focus:-ms-input-placeholder, app-activity-feed .tweet .textarea:focus:-ms-input-placeholder, app-activity-aggregated-feed .tweet .textarea:focus:-ms-input-placeholder {
  color: transparent;
}
app-comment-feed .tweet .send, app-comment-aggregated-feed .tweet .send, app-comment-with-filter .tweet .send, app-activity-feed .tweet .send, app-activity-aggregated-feed .tweet .send {
  position: absolute;
  right: 2px;
  bottom: 12px;
}
app-comment-feed .tweet .cancel, app-comment-aggregated-feed .tweet .cancel, app-comment-with-filter .tweet .cancel, app-activity-feed .tweet .cancel, app-activity-aggregated-feed .tweet .cancel {
  position: absolute;
  right: -15px;
  top: -8px;
  border-radius: 50%;
  background-color: var(--white-color);
}
app-comment-feed .tweet .cancel button, app-comment-aggregated-feed .tweet .cancel button, app-comment-with-filter .tweet .cancel button, app-activity-feed .tweet .cancel button, app-activity-aggregated-feed .tweet .cancel button {
  width: 26px;
  height: 26px;
  min-height: unset !important;
}
app-comment-feed .tweet .cancel button i.iconsax, app-comment-aggregated-feed .tweet .cancel button i.iconsax, app-comment-with-filter .tweet .cancel button i.iconsax, app-activity-feed .tweet .cancel button i.iconsax, app-activity-aggregated-feed .tweet .cancel button i.iconsax {
  padding: 3px !important;
}
app-comment-feed .user-icon-owner, app-comment-aggregated-feed .user-icon-owner, app-comment-with-filter .user-icon-owner, app-activity-feed .user-icon-owner, app-activity-aggregated-feed .user-icon-owner {
  background: var(--green-color2);
}
app-comment-feed .user-icon-0, app-comment-aggregated-feed .user-icon-0, app-comment-with-filter .user-icon-0, app-activity-feed .user-icon-0, app-activity-aggregated-feed .user-icon-0 {
  background: var(--green-color13);
}
app-comment-feed .user-icon-1, app-comment-aggregated-feed .user-icon-1, app-comment-with-filter .user-icon-1, app-activity-feed .user-icon-1, app-activity-aggregated-feed .user-icon-1 {
  background: var(--green-color12);
}
app-comment-feed .user-icon-2, app-comment-aggregated-feed .user-icon-2, app-comment-with-filter .user-icon-2, app-activity-feed .user-icon-2, app-activity-aggregated-feed .user-icon-2 {
  background: var(--orange-color8);
}
app-comment-feed .user-icon-3, app-comment-aggregated-feed .user-icon-3, app-comment-with-filter .user-icon-3, app-activity-feed .user-icon-3, app-activity-aggregated-feed .user-icon-3 {
  background: var(--orange-color9);
}
app-comment-feed .user-icon-4, app-comment-aggregated-feed .user-icon-4, app-comment-with-filter .user-icon-4, app-activity-feed .user-icon-4, app-activity-aggregated-feed .user-icon-4 {
  background: var(--blue-color14);
}
app-comment-feed .user-icon-5, app-comment-aggregated-feed .user-icon-5, app-comment-with-filter .user-icon-5, app-activity-feed .user-icon-5, app-activity-aggregated-feed .user-icon-5 {
  background: var(--blue-color7);
}
app-comment-feed .user-icon-6, app-comment-aggregated-feed .user-icon-6, app-comment-with-filter .user-icon-6, app-activity-feed .user-icon-6, app-activity-aggregated-feed .user-icon-6 {
  background: var(--blue-color15);
}
app-comment-feed .user-icon-all, app-comment-aggregated-feed .user-icon-all, app-comment-with-filter .user-icon-all, app-activity-feed .user-icon-all, app-activity-aggregated-feed .user-icon-all {
  background: var(--ultra-light-blue2);
  color: var(--blue-color6);
}
app-comment-feed .user-icon-system, app-comment-aggregated-feed .user-icon-system, app-comment-with-filter .user-icon-system, app-activity-feed .user-icon-system, app-activity-aggregated-feed .user-icon-system {
  background: url(/assets/images/commitly_icon.png) no-repeat;
  background-size: contain;
}
app-comment-feed .user-icon-deleted, app-comment-aggregated-feed .user-icon-deleted, app-comment-with-filter .user-icon-deleted, app-activity-feed .user-icon-deleted, app-activity-aggregated-feed .user-icon-deleted {
  background: lightgrey;
}
app-comment-feed .user__name, app-comment-aggregated-feed .user__name, app-comment-with-filter .user__name, app-activity-feed .user__name, app-activity-aggregated-feed .user__name {
  color: var(--gray-color1);
  line-height: 13px;
}
app-comment-feed .user__name:hover, app-comment-aggregated-feed .user__name:hover, app-comment-with-filter .user__name:hover, app-activity-feed .user__name:hover, app-activity-aggregated-feed .user__name:hover {
  text-decoration: underline;
}
app-comment-feed .user__id, app-comment-aggregated-feed .user__id, app-comment-with-filter .user__id, app-activity-feed .user__id, app-activity-aggregated-feed .user__id {
  margin-left: 5px;
  color: var(--gray-color1);
}
app-comment-feed .mention, app-comment-feed .hashtag, app-comment-aggregated-feed .mention, app-comment-aggregated-feed .hashtag, app-comment-with-filter .mention, app-comment-with-filter .hashtag, app-activity-feed .mention, app-activity-feed .hashtag, app-activity-aggregated-feed .mention, app-activity-aggregated-feed .hashtag {
  color: var(--blue-color6);
}
app-comment-feed .more, app-comment-aggregated-feed .more, app-comment-with-filter .more, app-activity-feed .more, app-activity-aggregated-feed .more {
  display: flex;
  margin: auto;
  padding-bottom: 20px;
}
app-comment-feed .more .link-default, app-comment-aggregated-feed .more .link-default, app-comment-with-filter .more .link-default, app-activity-feed .more .link-default, app-activity-aggregated-feed .more .link-default {
  display: flex;
  margin: auto;
}
app-comment-feed .more .text, app-comment-aggregated-feed .more .text, app-comment-with-filter .more .text, app-activity-feed .more .text, app-activity-aggregated-feed .more .text {
  margin: auto;
}
app-comment-feed .more .iconsax, app-comment-aggregated-feed .more .iconsax, app-comment-with-filter .more .iconsax, app-activity-feed .more .iconsax, app-activity-aggregated-feed .more .iconsax {
  pointer-events: none;
  margin-right: 5px;
  margin-top: auto;
  margin-bottom: auto;
  font-weight: 600;
  --Iconsax-Color: var(--blue-color6);
  --Iconsax-Size: 20px;
}

app-activity-aggregated-feed .comments-item {
  box-shadow: unset !important;
  background: unset !important;
  border-radius: unset;
}
app-activity-aggregated-feed .comments-item .tweet.comment {
  background: unset !important;
}
app-activity-aggregated-feed .comments-item:not(:last-child) {
  border-bottom: var(--default-border);
}
app-activity-aggregated-feed .comments-item.detailed {
  margin: 0px 16px;
}
app-activity-aggregated-feed .comments-item.detailed:first-child {
  margin-top: 10px !important;
}
app-activity-aggregated-feed .comments-item.detailed .tweet {
  padding: 10px 0px;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__body {
  padding: 5px 0;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__date {
  margin-left: 0px !important;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row {
  width: 100%;
  position: relative;
}
@supports (display: grid) {
  app-activity-aggregated-feed .comments-item.detailed .tweet__row {
    display: grid;
    grid-template-columns: 7% 5% 10% 23% 10% 40%;
  }
  app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__message {
    width: 100%;
  }
}
@supports not (display: grid) {
  app-activity-aggregated-feed .comments-item.detailed .tweet__row {
    display: flex;
    flex-direction: row;
  }
  app-activity-aggregated-feed .comments-item.detailed .tweet__row .user__name, app-activity-aggregated-feed .comments-item.detailed .tweet__row .user__id {
    width: 100px;
  }
  app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__date {
    width: 80px;
  }
  app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__message {
    width: calc(100% - 500px);
  }
  app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__action {
    width: 100px;
  }
  app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__breadcrumbs {
    width: 200px;
  }
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row div {
  align-items: flex-start;
  display: flex;
  margin-left: 12px;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row .user__name, app-activity-aggregated-feed .comments-item.detailed .tweet__row .user__id {
  white-space: break-spaces;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__icon {
  display: block !important;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__date {
  font-size: 11px;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__breadcrumbs div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__breadcrumbs .link-default {
  font-size: 11px !important;
  white-space: pre-line;
}
app-activity-aggregated-feed .comments-item.detailed .tweet__row .tweet__text {
  display: block;
}
app-activity-aggregated-feed .comments-item:not(.detailed) {
  position: relative;
}

app-comment-feed .tweet.reply, app-comment-aggregated-feed .tweet.reply {
  margin-left: 8px;
  border-radius: unset;
  padding: 14px !important;
}
app-comment-feed .tweet.reply.new, app-comment-aggregated-feed .tweet.reply.new {
  border-top: unset;
}
app-comment-feed .tweet.reply .tweet__details, app-comment-aggregated-feed .tweet.reply .tweet__details {
  display: flex;
}
app-comment-feed .tweet.reply .tweet__icon, app-comment-aggregated-feed .tweet.reply .tweet__icon {
  min-width: 32px !important;
  width: 32px !important;
  height: 32px !important;
  line-height: 32px !important;
  font-size: 13px;
}
app-comment-feed .tweet__actor, app-comment-feed .tweet__breadcrumbs, app-comment-aggregated-feed .tweet__actor, app-comment-aggregated-feed .tweet__breadcrumbs {
  font-size: 10px;
  line-height: 11.85px;
  margin-bottom: 2px;
}
app-comment-feed .tweet__actor .line, app-comment-feed .tweet__breadcrumbs .line, app-comment-aggregated-feed .tweet__actor .line, app-comment-aggregated-feed .tweet__breadcrumbs .line {
  margin: 0px 5px;
}
app-comment-feed .tweet__actions, app-comment-aggregated-feed .tweet__actions {
  justify-content: flex-end;
  margin: 10px 0;
}
app-comment-feed .tweet__reactions, app-comment-aggregated-feed .tweet__reactions {
  justify-content: flex-start;
  margin-left: 47px !important;
}
app-comment-feed .tweet__actions, app-comment-feed .tweet__reactions, app-comment-aggregated-feed .tweet__actions, app-comment-aggregated-feed .tweet__reactions {
  display: flex;
  margin: 0 auto;
  position: relative;
  align-items: flex-start;
}
app-comment-feed .tweet__actions .iconsax, app-comment-feed .tweet__reactions .iconsax, app-comment-aggregated-feed .tweet__actions .iconsax, app-comment-aggregated-feed .tweet__reactions .iconsax {
  --Iconsax-Size: 16px !important;
}
app-comment-feed .tweet__actions .textx, app-comment-feed .tweet__reactions .textx, app-comment-aggregated-feed .tweet__actions .textx, app-comment-aggregated-feed .tweet__reactions .textx {
  color: var(--gray-color1);
  font-size: 11px !important;
}
app-comment-feed .tweet__actions button, app-comment-feed .tweet__reactions button, app-comment-aggregated-feed .tweet__actions button, app-comment-aggregated-feed .tweet__reactions button {
  min-height: 20px !important;
}

app-comment-feed .tweet__actions {
  margin-top: 13px !important;
}

app-comment-aggregated-feed .comments-item {
  background: var(--ultra-light-blue1);
}
app-comment-aggregated-feed .comments-item .tweet {
  padding: 16px;
}
app-comment-aggregated-feed .comments-item .tweet__actions {
  min-height: 26px;
  min-width: 52px;
}
app-comment-aggregated-feed .comments-item .tweet:not(.reply) .tweet__details {
  margin: 10px 0;
  display: flex;
}
app-comment-aggregated-feed .comments-item .tweet:not(.reply) .tweet__actions {
  margin: 10px 0 !important;
}
app-comment-aggregated-feed .comments-item .tweet:not(.reply) .tweet__text {
  margin: auto 0px !important;
}
app-comment-aggregated-feed .reply {
  padding: 8px 0px;
  margin-left: 58px !important;
  margin-right: 16px !important;
}
app-comment-aggregated-feed .related {
  margin: 5px 0 5px 0;
  background-color: var(--ultra-light-blue1);
  border-radius: var(--border-radius);
}
app-comment-aggregated-feed .foreign {
  min-height: 40px;
  display: flex;
  background-color: var(--ultra-light-blue1);
  margin: 10px 0;
  border-radius: var(--border-radius);
  font-size: 13px;
}
app-comment-aggregated-feed .foreign .cell {
  padding: 5px 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: auto;
  margin-bottom: auto;
  min-width: 80px;
}
app-comment-aggregated-feed .foreign .cell.date {
  width: 10% !important;
  color: var(--gray-color1);
}
app-comment-aggregated-feed .foreign .cell.name {
  width: 30% !important;
  flex-direction: column;
}
app-comment-aggregated-feed .foreign .cell.category {
  flex-grow: 1;
  padding-right: 10px;
  width: 20% !important;
}
app-comment-aggregated-feed .foreign .cell.amount {
  width: 20% !important;
  text-align: right !important;
}
app-comment-aggregated-feed .foreign .cell.amount .amount {
  font-weight: 500;
  color: var(--gray-color1);
}
app-comment-aggregated-feed .foreign .cell.condition {
  width: 60% !important;
}
app-comment-aggregated-feed .foreign .cell.period {
  display: flex;
  width: 20% !important;
}
app-comment-aggregated-feed .foreign .cell.period .lnr {
  font-size: 16px;
  margin-left: 5px;
  font-weight: bold;
  color: var(--blue-color3);
  cursor: pointer;
  margin-right: 5px;
  margin-top: auto;
  margin-bottom: auto;
}
app-comment-aggregated-feed .foreign .cell .overflow {
  width: 95%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
app-comment-aggregated-feed .foreign .cell .counterpart-name, app-comment-aggregated-feed .foreign .cell .name {
  font-weight: 500;
}
app-comment-aggregated-feed .foreign .cell.info {
  flex-grow: 1;
  width: 240px;
  padding: 0 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
app-comment-aggregated-feed .foreign .cell.info .tags {
  margin: 5px 0;
}
app-comment-aggregated-feed .foreign .cell.info .description, app-comment-aggregated-feed .foreign .cell.info .name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

app-activity-feed .comments-item .tweet__action button, app-activity-aggregated-feed .comments-item .tweet__action button {
  cursor: default !important;
}
app-activity-feed .comments-item .tweet__action button .textx, app-activity-aggregated-feed .comments-item .tweet__action button .textx {
  text-align: left;
}
app-activity-feed .comments-item:not(.detailed) .tweet__action .iconsax, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__action .iconsax {
  --Iconsax-Size: 14px !important;
}
app-activity-feed .comments-item:not(.detailed) .tweet__actor, app-activity-feed .comments-item:not(.detailed) .tweet__breadcrumbs, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__actor, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__breadcrumbs {
  font-size: 10px;
  line-height: 11.85px;
  margin-bottom: 2px;
}
app-activity-feed .comments-item:not(.detailed) .tweet__actor .line, app-activity-feed .comments-item:not(.detailed) .tweet__breadcrumbs .line, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__actor .line, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__breadcrumbs .line {
  margin: 0px 5px;
}
app-activity-feed .comments-item:not(.detailed) .tweet__actor .textx, app-activity-feed .comments-item:not(.detailed) .tweet__breadcrumbs .textx, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__actor .textx, app-activity-aggregated-feed .comments-item:not(.detailed) .tweet__breadcrumbs .textx {
  font-size: 10px !important;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.header-with-icon {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-right: 25px;
}
.header-with-icon ui-button {
  margin-left: auto;
}
.header-with-icon .transactions-download-wrapper {
  margin-left: auto;
  padding-right: 25px;
}
.header-with-icon .transactions-download-wrapper .last-sync {
  margin: 5px 15px 0;
}
.header-with-icon .transactions-download-wrapper .upload {
  background: var(--gray-color13);
  border: none;
  border-radius: 50%;
  width: 32px;
  position: relative;
}
.header-with-icon .transactions-download-wrapper .upload:hover .tooltip {
  display: block;
  top: calc(100% + 5px);
  right: 0;
}
.header-with-icon .transactions-download-wrapper .upload:hover .tooltip:after {
  content: "";
  position: absolute;
  top: -10px;
  left: calc(100% - 20px);
}
.header-container {
  padding: 25px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.header-container h1 {
  margin-right: 20px;
}

.navigation-panel {
  width: 230px;
  padding: 5px 20px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
.navigation-panel .nav-item-outer {
  display: flex;
}
.navigation-panel .nav-item-outer .nav-item {
  color: var(--blue-color6);
  font-size: 15px;
  cursor: pointer;
  border-radius: 10px;
  padding: 10px 20px;
  text-align: right;
  text-transform: capitalize;
  width: 100%;
}
.navigation-panel .nav-item-outer .nav-item.active {
  color: var(--black-color0);
  font-weight: 500;
  background: var(--gray-color13);
}

.no-data-popup, .no-data-popup-local {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: var(--white-color5);
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: var(--border-radius);
  height: calc(100% + 68px + 45px);
}
.no-data-popup.unset-height, .no-data-popup-local.unset-height {
  height: unset;
}
.no-data-popup .title, .no-data-popup-local .title {
  font-weight: 400;
  margin-bottom: 12px;
  color: var(--black-color1);
}

.no-data-popup .title {
  font-size: 24px;
}
.no-data-popup .inner {
  position: fixed;
  top: 50%;
  left: 0;
  margin: -25px 0 0 110px;
  width: 100%;
}

.no-data-popup-local.text-only .title {
  margin: 0;
}
.no-data-popup-local .title {
  font-size: 18px;
}
.no-data-popup-local .inner {
  width: 90%;
}
.no-data-popup-local .button {
  margin-top: 10px;
}

.error-summary {
  background: var(--orange-color2);
  padding: 5px;
  margin: 18px 0 0;
  border-radius: 5px;
}
.error-summary .error-message {
  color: var(--orange-color1);
}

.success-summary {
  background: var(--green-color3);
  padding: 5px;
  margin: 18px 0 0;
  color: var(--green-color1);
}

.text-nowrap {
  white-space: nowrap;
}

div.global-page-loader {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  margin: calc(50vh - 210px) 0;
}

.view-not-allowed {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--orange-color2);
  color: var(--orange-color1);
  text-align: center;
  padding: 20px;
}

ui-loader {
  width: 100%;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-default-master .main-wrapper {
  position: relative;
  padding-left: 220px;
}
page-default-master .main-wrapper.menu-collapsed {
  padding-left: 53px;
}
page-default-master .main-wrapper .main-view {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 45px - 68px);
}
page-default-master .global-page-loader {
  position: static;
  margin: 0;
}
page-default-master .body-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  width: 100%;
  padding: 50px 0;
  font-family: "Rubik", sans-serif;
}
page-default-master .body-wrapper__title {
  line-height: 1;
  color: var(--black-color0);
  margin-bottom: 20px;
  font-weight: 600;
  font-size: 24px;
}
page-default-master .body-wrapper__text {
  font-size: 19px;
  line-height: 30px;
  text-align: center;
  color: var(--gray-color1);
}
page-default-master .body-wrapper img {
  max-width: 100%;
}
page-default-master .body-wrapper__text-wrapper {
  text-align: center;
  padding: 50px 0;
}
page-default-master .g-notification {
  position: absolute;
  width: 300px;
  z-index: 99;
  padding: 5px;
  left: calc(50% - 150px);
  top: 20px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--white-color);
  box-shadow: 0 0 10px var(--input-shadow-color);
}
page-default-master .g-notification .message {
  width: calc(100% - 32px);
  padding-left: 5px;
  font-size: 14px;
}
page-default-master .g-notification .no-font-ico {
  display: block;
  cursor: pointer;
  width: 32px;
  height: 32px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-color: var(--gray-color5);
  border-radius: 50%;
  background-image: url(/assets/images/icons/ico_sync.svg);
}
page-default-master .g-notification .no-font-ico:hover {
  background-color: rgba(44, 60, 76, 0.46);
}
page-default-master .needRefresh {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  top: 10px;
  left: calc(50% - 335px);
  z-index: 10;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
  background: var(--ultra-light-blue2);
}
page-default-master .needRefresh.expandedMenu {
  margin-left: 170px;
}
page-default-master .needRefresh .message {
  padding: 0 20px;
  color: var(--blue-color6) !important;
}
page-default-master .needRefresh .message > span {
  color: var(--new-version-label-text);
  font-size: 13px;
  font-weight: 500;
  margin-right: 10px;
}
page-default-master .needRefresh .iconsax {
  --Iconsax-Color: var(--blue-color6);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.wrap-page-auth {
  max-width: 460px !important;
}
.wrap-page-auth .separator {
  margin: 24px auto !important;
  padding-top: 0px !important;
}

.sign-in__wallet {
  background-color: var(--ultra-light-blue1);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px;
  gap: 16px;
  border-radius: 16px;
}
.sign-in__wallet__content {
  display: flex;
}
.sign-in__wallet__content-icon {
  box-shadow: var(--box-shadow);
  box-shadow: 0px 0.83px 2.5px 0px rgba(0, 0, 0, 0.1019607843);
  --Iconsax-Color: var(--green-color1);
  --Iconsax-Size: 18px;
  background-color: var(--white-color);
  width: 40px;
  height: 40px;
  border-radius: 100px;
  padding: 11px;
  align-items: center;
}
.sign-in__wallet__content-info {
  display: flex;
  flex-direction: column;
  color: var(--gray-color5);
  font-size: 13px;
  line-height: 15px;
  gap: 4px;
  padding-left: 16px;
}
.sign-in__wallet__content-info-title {
  font-weight: 500;
  font-size: 16px;
  line-height: 40px;
  display: flex;
  --Iconsax-Size: 16px;
}
.sign-in__wallet__content-info-title span {
  display: flex;
  align-items: center;
}
.sign-in__wallet__content-info-text {
  color: var(--gray-color1);
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-sign-up .wrap-page-sign-up {
  width: 100%;
  max-width: 570px;
  margin: auto;
}
page-sign-up .title {
  text-align: center;
}
page-sign-up .success-summary {
  padding: 20px;
  color: var(--gray-color1);
  background: var(--green-color6);
  border-radius: 5px;
  font-size: 13px;
}
page-sign-up .success-summary .title {
  width: 100%;
  font-weight: 500;
  color: var(--gray-color5);
  font-size: 13px;
  text-align: left;
  background: url(/assets/images/icons/plug_success_ico.svg) 0 50% no-repeat;
  padding-left: 25px;
}
page-sign-up .new-success-summary {
  max-width: 360px;
  margin: 0 auto;
}
page-sign-up .new-success-summary__icon {
  width: 64px;
  height: 64px;
  margin: 35px auto 40px auto;
  background: var(--green-color1);
  border-radius: 16px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
page-sign-up .new-success-summary__icon__check {
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background: #FFF;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  position: absolute;
  padding: 2px;
  top: -4px;
  right: -4px;
}
page-sign-up .new-success-summary__title {
  font-size: 24px;
  line-height: 28px;
  font-family: "Rubik", serif;
  font-weight: 500;
  color: var(--gray-color5);
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 4px;
  gap: 6px;
}
page-sign-up .new-success-summary__title img {
  width: 24px;
  height: 24px;
}
page-sign-up .new-success-summary__subtitle {
  color: var(--gray-color5);
  text-align: center;
  font-family: "Rubik", serif;
  font-size: 13px;
  line-height: 15px;
  padding-bottom: 16px;
}
page-sign-up .new-success-summary__text {
  color: var(--gray-color5);
  text-align: center;
  font-family: "Rubik", serif;
  font-size: 13px;
  line-height: 15px;
  padding-bottom: 60px;
}
page-sign-up .new-success-summary__spam {
  color: var(--gray-color1);
  text-align: center;
  font-family: "Rubik", serif;
  font-size: 13px;
  line-height: 15px;
}
page-sign-up .trial {
  font-weight: bold;
  font-size: 16px;
  line-height: 19px;
  color: var(--green-color20);
  text-align: center;
  margin-top: 10px;
}
page-sign-up .form-group {
  display: flex;
}
page-sign-up .form-group .form-control {
  width: 49%;
  margin: auto;
}
page-sign-up .form-control {
  width: 98%;
  margin: auto;
}
page-sign-up .form .agree-with-terms {
  justify-content: center;
  margin-top: 19px;
  flex-direction: row !important;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  align-items: center;
}
page-sign-up .form .agree-with-terms .label {
  margin: 2px 0 0 10px;
  font-weight: normal !important;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-dashboard,
page-dashboard-insights-actual,
dashboard-plans {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  position: relative;
}
page-dashboard .header-container .last-sync,
page-dashboard-insights-actual .header-container .last-sync,
dashboard-plans .header-container .last-sync {
  margin: 5px 15px 0;
}
page-dashboard .header-container .upload,
page-dashboard-insights-actual .header-container .upload,
dashboard-plans .header-container .upload {
  margin-left: auto;
  margin-right: 5px;
}
page-dashboard .top-panel,
page-dashboard-insights-actual .top-panel,
dashboard-plans .top-panel {
  display: flex;
  width: 100%;
}
page-dashboard .credit-rating,
page-dashboard-insights-actual .credit-rating,
dashboard-plans .credit-rating {
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  background-color: var(--white-color);
  position: relative;
  min-height: 139px;
  margin: 10px;
}
page-dashboard .content-container,
page-dashboard-insights-actual .content-container,
dashboard-plans .content-container {
  flex-grow: 1;
  display: flex;
}
page-dashboard .content-container.no-data,
page-dashboard-insights-actual .content-container.no-data,
dashboard-plans .content-container.no-data {
  overflow: hidden;
}
page-dashboard .content-container .widgets,
page-dashboard-insights-actual .content-container .widgets,
dashboard-plans .content-container .widgets {
  position: relative;
  flex-grow: 1;
  padding: 15px;
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
}
page-dashboard .content-container .widgets-container,
page-dashboard-insights-actual .content-container .widgets-container,
dashboard-plans .content-container .widgets-container {
  position: relative;
  flex-grow: 1;
  padding: 15px;
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
}
page-dashboard .content-container .widgets-container.widgets-top, page-dashboard .content-container .widgets-container > .widgets-top,
page-dashboard-insights-actual .content-container .widgets-container.widgets-top,
page-dashboard-insights-actual .content-container .widgets-container > .widgets-top,
dashboard-plans .content-container .widgets-container.widgets-top,
dashboard-plans .content-container .widgets-container > .widgets-top {
  display: flex;
  flex-grow: 1;
}
page-dashboard .content-container .widgets-container.widgets-top,
page-dashboard-insights-actual .content-container .widgets-container.widgets-top,
dashboard-plans .content-container .widgets-container.widgets-top {
  margin-bottom: -19px;
}
page-dashboard .content-container .widgets-container .title,
page-dashboard-insights-actual .content-container .widgets-container .title,
dashboard-plans .content-container .widgets-container .title {
  font-weight: 500;
  font-size: 16px;
}
page-dashboard .content-container .widgets-container .title .link-default,
page-dashboard-insights-actual .content-container .widgets-container .title .link-default,
dashboard-plans .content-container .widgets-container .title .link-default {
  font-size: 14px;
  font-weight: 400;
}
page-dashboard .content-container .widgets-container > *,
page-dashboard-insights-actual .content-container .widgets-container > *,
dashboard-plans .content-container .widgets-container > * {
  align-self: stretch;
}
page-dashboard .card-text, page-dashboard .currency-text, page-dashboard .limit-text,
page-dashboard-insights-actual .card-text,
page-dashboard-insights-actual .currency-text,
page-dashboard-insights-actual .limit-text,
dashboard-plans .card-text,
dashboard-plans .currency-text,
dashboard-plans .limit-text {
  font-weight: 500;
  font-size: var(--default-font-size);
}
page-dashboard .card-id,
page-dashboard-insights-actual .card-id,
dashboard-plans .card-id {
  padding-top: 15px;
}
page-dashboard .card-id span,
page-dashboard-insights-actual .card-id span,
dashboard-plans .card-id span {
  font-size: 15px;
  display: inline-block;
  text-align: center;
  letter-spacing: 3.6px;
}
page-dashboard .toggle-accounts,
page-dashboard-insights-actual .toggle-accounts,
dashboard-plans .toggle-accounts {
  width: calc(100vw - 538px);
  display: block;
  margin: 10px;
  flex: 1;
  position: relative;
}
page-dashboard .toggle-accounts .toggle-accounts-wrapper,
page-dashboard-insights-actual .toggle-accounts .toggle-accounts-wrapper,
dashboard-plans .toggle-accounts .toggle-accounts-wrapper {
  overflow: hidden;
  position: relative;
}
page-dashboard .detail-section,
page-dashboard-insights-actual .detail-section,
dashboard-plans .detail-section {
  position: relative;
  padding: 25px 0;
  width: 100%;
  display: flex;
  overflow-x: auto;
}
page-dashboard .detail-section,
page-dashboard-insights-actual .detail-section,
dashboard-plans .detail-section {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  page-dashboard .detail-section,
  page-dashboard-insights-actual .detail-section,
  dashboard-plans .detail-section { /* For Firefox */
    scrollbar-width: thin;
  }
}
page-dashboard .detail-section::-webkit-scrollbar,
page-dashboard-insights-actual .detail-section::-webkit-scrollbar,
dashboard-plans .detail-section::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
page-dashboard .detail-section::-webkit-scrollbar-track,
page-dashboard-insights-actual .detail-section::-webkit-scrollbar-track,
dashboard-plans .detail-section::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
page-dashboard .detail-section::-webkit-scrollbar-thumb,
page-dashboard-insights-actual .detail-section::-webkit-scrollbar-thumb,
dashboard-plans .detail-section::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}
page-dashboard .detail-section .card-item,
page-dashboard-insights-actual .detail-section .card-item,
dashboard-plans .detail-section .card-item {
  background: var(--gray-color25);
  border-radius: 20px;
  width: 244.9px;
  color: var(--white-color);
  height: 155px;
  min-width: 244.9px;
  margin: 0 10px;
  overflow: hidden;
  box-shadow: 2px 2px 10px 1px var(--gray-color26);
  position: relative;
}
page-dashboard .detail-section .card-item::before,
page-dashboard-insights-actual .detail-section .card-item::before,
dashboard-plans .detail-section .card-item::before {
  content: "";
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 60%;
  height: 100%;
  background: linear-gradient(to top left, var(--green-color12), transparent);
  filter: blur(15px);
  border-top-left-radius: 50%;
}
page-dashboard .detail-section .card-item.offline:before,
page-dashboard-insights-actual .detail-section .card-item.offline:before,
dashboard-plans .detail-section .card-item.offline:before {
  background: linear-gradient(to top left, var(--blue-color19), transparent);
}
page-dashboard .detail-section .card-item.failed:before,
page-dashboard-insights-actual .detail-section .card-item.failed:before,
dashboard-plans .detail-section .card-item.failed:before {
  background: linear-gradient(to top left, var(--orange-color5), transparent);
}
page-dashboard .detail-section .card-item:first-child,
page-dashboard-insights-actual .detail-section .card-item:first-child,
dashboard-plans .detail-section .card-item:first-child {
  margin-left: 0;
}
page-dashboard .detail-section .card-item .card-wrapper,
page-dashboard-insights-actual .detail-section .card-item .card-wrapper,
dashboard-plans .detail-section .card-item .card-wrapper {
  padding: 15px;
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
}
page-dashboard .detail-section .card-item .card-status,
page-dashboard-insights-actual .detail-section .card-item .card-status,
dashboard-plans .detail-section .card-item .card-status {
  margin-left: auto;
  color: var(--green-color1);
  position: absolute;
  right: 10px;
  bottom: 10px;
}
page-dashboard .detail-section .card-item .card-status > div,
page-dashboard-insights-actual .detail-section .card-item .card-status > div,
dashboard-plans .detail-section .card-item .card-status > div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
page-dashboard .detail-section .card-item .card-status.offline,
page-dashboard-insights-actual .detail-section .card-item .card-status.offline,
dashboard-plans .detail-section .card-item .card-status.offline {
  color: var(--blue-color6);
}
page-dashboard .detail-section .card-item .card-status.failed,
page-dashboard-insights-actual .detail-section .card-item .card-status.failed,
dashboard-plans .detail-section .card-item .card-status.failed {
  color: var(--orange-color1);
}
page-dashboard .detail-section .action-tab,
page-dashboard-insights-actual .detail-section .action-tab,
dashboard-plans .detail-section .action-tab {
  display: flex;
  align-items: center;
  margin: 0 10px;
  flex-direction: column;
  min-width: 200px;
  justify-content: flex-end;
}
page-dashboard .detail-section .action-tab .manage-link,
page-dashboard-insights-actual .detail-section .action-tab .manage-link,
dashboard-plans .detail-section .action-tab .manage-link {
  white-space: nowrap;
  font-size: 13px;
  text-decoration: none;
  background: url(/assets/images/icons_new_design/ico_cog_blue.svg) 0 50% no-repeat;
  padding: 5px 0 5px 30px;
}
page-dashboard .card-data,
page-dashboard-insights-actual .card-data,
dashboard-plans .card-data {
  display: flex;
  width: 100%;
  z-index: 1;
}
page-dashboard .card-data .card-currency,
page-dashboard-insights-actual .card-data .card-currency,
dashboard-plans .card-data .card-currency {
  width: 25%;
}
page-dashboard .card-data .card-currency .image,
page-dashboard-insights-actual .card-data .card-currency .image,
dashboard-plans .card-data .card-currency .image {
  width: 35px;
  margin-top: 25px;
}
page-dashboard .card-data .card-amount .card-amount-num,
page-dashboard-insights-actual .card-data .card-amount .card-amount-num,
dashboard-plans .card-data .card-amount .card-amount-num {
  display: inline-block;
  margin-left: auto;
  font-size: 24px;
  font-weight: 500;
}
page-dashboard .card-data .card-amount .limit,
page-dashboard-insights-actual .card-data .card-amount .limit,
dashboard-plans .card-data .card-amount .limit {
  display: flex;
}
page-dashboard .card-data .card-amount .limit .disconnected,
page-dashboard-insights-actual .card-data .card-amount .limit .disconnected,
dashboard-plans .card-data .card-amount .limit .disconnected {
  color: var(--orange-color1);
}
page-dashboard .card-data .card-amount .limit :last-child,
page-dashboard-insights-actual .card-data .card-amount .limit :last-child,
dashboard-plans .card-data .card-amount .limit :last-child {
  display: flex;
}
page-dashboard .card-account-name,
page-dashboard-insights-actual .card-account-name,
dashboard-plans .card-account-name {
  padding-right: 5px;
  white-space: nowrap;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
}
page-dashboard .header-toggle-link,
page-dashboard-insights-actual .header-toggle-link,
dashboard-plans .header-toggle-link {
  padding: 0 10px;
}
page-dashboard .card-text, page-dashboard .currency-text, page-dashboard .limit-text, page-dashboard .large-size,
page-dashboard-insights-actual .card-text,
page-dashboard-insights-actual .currency-text,
page-dashboard-insights-actual .limit-text,
page-dashboard-insights-actual .large-size,
dashboard-plans .card-text,
dashboard-plans .currency-text,
dashboard-plans .limit-text,
dashboard-plans .large-size {
  font-weight: 500;
  font-size: var(--default-font-size);
}
page-dashboard .card-id,
page-dashboard-insights-actual .card-id,
dashboard-plans .card-id {
  padding: 12px 15px 0 0;
  display: flex;
  align-items: flex-end;
  width: 100%;
}
page-dashboard .card-id .card-bank-wrapper,
page-dashboard-insights-actual .card-id .card-bank-wrapper,
dashboard-plans .card-id .card-bank-wrapper {
  width: 80%;
}
page-dashboard .card-id .card-number,
page-dashboard-insights-actual .card-id .card-number,
dashboard-plans .card-id .card-number {
  width: 20%;
}
page-dashboard .widgets-amount .amount,
page-dashboard-insights-actual .widgets-amount .amount,
dashboard-plans .widgets-amount .amount {
  font-size: 24px;
}
page-dashboard .widgets-amount .currency,
page-dashboard-insights-actual .widgets-amount .currency,
dashboard-plans .widgets-amount .currency {
  font-size: 14px;
}
page-dashboard .widgets-amount .separate,
page-dashboard-insights-actual .widgets-amount .separate,
dashboard-plans .widgets-amount .separate {
  padding-right: 5px;
}
page-dashboard .widgets-container-wrapper,
page-dashboard-insights-actual .widgets-container-wrapper,
dashboard-plans .widgets-container-wrapper {
  display: flex;
  margin: 15px 0;
}
page-dashboard .widgets-container-wrapper .widgets-container-item,
page-dashboard-insights-actual .widgets-container-wrapper .widgets-container-item,
dashboard-plans .widgets-container-wrapper .widgets-container-item {
  width: 25%;
  padding: 0 20px;
}
page-dashboard .section-title,
page-dashboard-insights-actual .section-title,
dashboard-plans .section-title {
  flex-basis: 50%;
  padding: 25px 20px 5px;
  color: var(--black-color0);
  font-size: 16px;
  font-weight: 500;
}

page-dashboard-insights-actual .loader, wg-dashboard-bank-accounts .loader {
  height: calc(100vh - 320px) !important;
  width: 100%;
}
page-dashboard-insights-actual .loader .image-load, wg-dashboard-bank-accounts .loader .image-load {
  width: 70px !important;
}

dashboard-home connected-account {
  position: relative;
}
dashboard-home connected-account .accounts {
  padding-bottom: 0px !important;
}
dashboard-home connected-account .accounts .account {
  padding: 16px 12px !important;
}
dashboard-home connected-account .accounts .name {
  color: var(--gray-color5) !important;
  font-size: 16px !important;
}
dashboard-home connected-account .toggle-accounts-status {
  width: 1400px;
  margin-bottom: 0px;
  z-index: 1;
  background: var(--white-color);
}
dashboard-home .status-inner .name, dashboard-home .accounts .name {
  position: relative;
  padding-bottom: 7px;
  margin-bottom: 10px;
  font-weight: 500;
}
dashboard-home .status-inner .name:after, dashboard-home .accounts .name:after {
  border-bottom: var(--default-border);
  width: 77px;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: var(--gray-color14);
}

@media screen and (max-width: 1280px) {
  .widgets-amount .amount {
    font-size: 20px;
  }
  .widgets-amount .currency {
    font-size: 10px;
  }
  .widgets-amount .separate {
    padding-right: 3px;
  }
}
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-planning {
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: calc(100vh - 45px - 68px);
}
page-planning page-company-planning .cell.planned {
  color: var(--black-color1) !important;
}
page-planning page-company-planning .cell.clickable {
  color: var(--blue-color3);
}
page-planning page-company-planning .cell.clickable.planned {
  color: var(--blue-color3) !important;
}
page-planning page-company-planning .cell.cell-other {
  flex-wrap: wrap;
  color: var(--gray-color5);
}
page-planning page-company-planning .cell .week-start {
  display: block;
  width: 100%;
  text-align: right;
}
page-planning page-company-planning > ui-plug {
  margin: 0 25px;
}
page-planning page-company-planning .legend-bg {
  min-height: 95px !important;
}
page-planning page-company-planning .cash-flow-table .periods-right {
  padding-right: 29px;
}
page-planning .parent-cat {
  background: var(--white-color) !important;
}
page-planning .category-cat {
  background-color: var(--ultra-light-blue1) !important;
}
page-planning .updateDate {
  color: var(--orange-color1);
}
page-planning page-group-planning .cell {
  flex-direction: column;
}
page-planning page-group-planning .cell.planned {
  color: var(--black-color1) !important;
}
page-planning page-group-planning .cell.clickable {
  color: var(--blue-color3);
}
page-planning page-group-planning .cell.clickable .actual {
  color: var(--blue-color3) !important;
}
page-planning page-group-planning .cell.weeklyCell .title {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  min-height: auto !important;
  margin-bottom: 3px;
}
page-planning page-group-planning .cell.weeklyCell .title .data {
  padding: 5px 0;
}
page-planning page-group-planning .cell.weeklyCell .title .week-title {
  padding: 0 15px 0 0;
  margin: 2px 0;
}
page-planning page-group-planning .cell .week-title {
  font-size: 11px;
}
page-planning page-group-planning .cell .filler {
  min-height: 17px;
  margin: 0;
}
page-planning page-group-planning .cell .scale-title {
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
}
page-planning page-group-planning .plan-select {
  margin-right: auto;
}
page-planning page-group-planning .view {
  margin: auto 0 auto 10px;
  height: 18px;
}
page-planning page-group-planning planning-group-budget-dialog .cash-flow-table {
  margin-top: 20px;
  padding-top: 20px;
  box-shadow: none;
}
page-planning page-group-planning planning-group-budget-dialog .cash-flow-table .title {
  width: 415px !important;
  display: flex;
}
page-planning page-group-planning planning-group-budget-dialog .cash-flow-table .cell span {
  margin-left: auto;
  margin-right: 20px;
}
page-planning page-group-planning planning-group-budget-dialog .cash-flow-table .cell, page-planning page-group-planning planning-group-budget-dialog .cash-flow-table .title {
  border-bottom: none !important;
}
page-planning page-group-planning planning-group-budget-dialog .chevron-sub {
  margin-left: -22px;
}
page-planning page-group-planning planning-group-budget-dialog .item-level0 {
  box-shadow: none !important;
  border: none !important;
  border-radius: none !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level0:hover, page-planning page-group-planning planning-group-budget-dialog .item-inner-level1:hover, page-planning page-group-planning planning-group-budget-dialog .item-inner-level2:hover, page-planning page-group-planning planning-group-budget-dialog .item-inner-level3:hover, page-planning page-group-planning planning-group-budget-dialog .item-inner-level4:hover, page-planning page-group-planning planning-group-budget-dialog .item-inner-level5:hover, page-planning page-group-planning planning-group-budget-dialog .item-inner-level6:hover {
  background-color: var(--white-color14) !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level1, page-planning page-group-planning planning-group-budget-dialog .item-inner-level2, page-planning page-group-planning planning-group-budget-dialog .item-inner-level3, page-planning page-group-planning planning-group-budget-dialog .item-inner-level4, page-planning page-group-planning planning-group-budget-dialog .item-inner-level5, page-planning page-group-planning planning-group-budget-dialog .item-inner-level6 {
  min-height: 40px !important;
  background-color: var(--white-color) !important;
  border-top: none !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level1 .cell, page-planning page-group-planning planning-group-budget-dialog .item-inner-level2 .cell, page-planning page-group-planning planning-group-budget-dialog .item-inner-level3 .cell, page-planning page-group-planning planning-group-budget-dialog .item-inner-level4 .cell, page-planning page-group-planning planning-group-budget-dialog .item-inner-level5 .cell, page-planning page-group-planning planning-group-budget-dialog .item-inner-level6 .cell {
  text-align: right;
  flex: 1;
}
page-planning page-group-planning planning-group-budget-dialog .item-level2, page-planning page-group-planning planning-group-budget-dialog .item-level3 {
  border-top: none !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level1 .title {
  padding-left: 20px !important;
  margin-left: 0 !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level2 .title {
  padding-left: 70px !important;
  margin-left: 0 !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level3.connection::before, page-planning page-group-planning planning-group-budget-dialog .item-inner-level3.connection::after {
  left: 55px !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level3 .title {
  padding-left: 100px !important;
  margin-left: 0 !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level4.connection::before, page-planning page-group-planning planning-group-budget-dialog .item-inner-level4.connection::after {
  left: 85px !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level4 .title {
  padding-left: 130px !important;
  margin-left: 0 !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level5.connection::before, page-planning page-group-planning planning-group-budget-dialog .item-inner-level5.connection::after {
  left: 113px !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level5 .title {
  padding-left: 160px !important;
  margin-left: 0 !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level6.connection::before, page-planning page-group-planning planning-group-budget-dialog .item-inner-level6.connection::after {
  left: 143px !important;
}
page-planning page-group-planning planning-group-budget-dialog .item-inner-level6 .title {
  padding-left: 190px !important;
  margin-left: 0 !important;
}
page-planning page-group-planning planning-group-budget-dialog .connection {
  overflow: hidden;
  position: relative;
  color: var(--black-color0);
}
page-planning page-group-planning planning-group-budget-dialog .view-link-wrapper:hover .tooltip {
  display: block;
}
page-planning page-group-planning planning-group-budget-dialog .view-link-wrapper {
  height: 100%;
  display: flex;
  margin-bottom: auto;
  margin-top: auto;
  position: relative;
}
page-planning page-group-planning planning-group-budget-dialog .view-link-wrapper .view:before {
  background-image: url(/assets/images/icons/go-to-arrow.svg);
  background-repeat: no-repeat;
  background-size: 14px 17px;
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 17px;
  height: 14px;
  cursor: pointer;
}
page-planning page-group-planning planning-group-budget-dialog .view-link-wrapper .tooltip {
  top: -5px;
  left: 30px;
}
page-planning page-group-planning planning-group-budget-dialog .view-link-wrapper .tooltip:after {
  content: "";
  position: absolute;
  right: 100%;
  transform: rotate(270deg);
  top: 8px;
}
page-planning page-group-planning > ui-plug {
  margin: 0 25px;
}
page-planning page-group-planning .legend-bg {
  min-height: 95px !important;
}
page-planning page-group-planning .cash-flow-table {
  margin-top: 20px;
}
page-planning .status-container {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  position: relative;
}
page-planning .status-container ui-button.comment-in-nav {
  position: absolute;
  right: 40px;
  top: 15px;
}
page-planning .header-container .btn-create-plan, page-planning .chart-container .btn-create-plan {
  width: 200px;
}
page-planning .header-container .btn-add, page-planning .header-container .btn-export, page-planning .chart-container .btn-add, page-planning .chart-container .btn-export {
  margin-left: 10px;
}
page-planning .header-container .plan-select, page-planning .chart-container .plan-select {
  width: 340px;
}
page-planning .header-container .plan-select .button, page-planning .chart-container .plan-select .button {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
}
page-planning .header-container .plan-select .button .plan-icon, page-planning .chart-container .plan-select .button .plan-icon {
  position: relative;
  display: inline-block;
  line-height: 1;
}
page-planning .header-container .plan-select .button .plan-icon .ball, page-planning .chart-container .plan-select .button .plan-icon .ball {
  width: 8px;
  height: 8px;
  background: var(--white-color);
  border-radius: 50%;
  border: 2px solid;
  margin: 0 4px;
  position: relative;
  z-index: 2;
}
page-planning .header-container .plan-select .button .plan-icon .line, page-planning .chart-container .plan-select .button .plan-icon .line {
  width: 16px;
  height: 2px;
  position: absolute;
  top: 3px;
  left: 0px;
}
page-planning .header-container .plan-select .button .text, page-planning .chart-container .plan-select .button .text {
  margin: 0 0 0 10px;
}
page-planning .header-container .plan-select .drp-menu .drp-item, page-planning .chart-container .plan-select .drp-menu .drp-item {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
page-planning .header-container .settings, page-planning .header-container .add-plan, page-planning .chart-container .settings, page-planning .chart-container .add-plan {
  margin-left: 10px;
}
page-planning .header-container .settings, page-planning .header-container .add-plan, page-planning .header-container .upload, page-planning .chart-container .settings, page-planning .chart-container .add-plan, page-planning .chart-container .upload {
  position: relative;
}
page-planning .header-container .settings:hover .tooltip, page-planning .header-container .add-plan:hover .tooltip, page-planning .header-container .upload:hover .tooltip, page-planning .chart-container .settings:hover .tooltip, page-planning .chart-container .add-plan:hover .tooltip, page-planning .chart-container .upload:hover .tooltip {
  display: block;
  bottom: calc(-100% - 10px);
  right: 0;
}
page-planning .header-container .settings:hover .tooltip:after, page-planning .header-container .add-plan:hover .tooltip:after, page-planning .header-container .upload:hover .tooltip:after, page-planning .chart-container .settings:hover .tooltip:after, page-planning .chart-container .add-plan:hover .tooltip:after, page-planning .chart-container .upload:hover .tooltip:after {
  content: "";
  position: absolute;
  left: calc(100% - 20px);
}
page-planning .header-container .upload, page-planning .chart-container .upload {
  margin-left: 5px;
}
page-planning .header-container .header-end, page-planning .chart-container .header-end {
  margin-left: auto;
  display: flex;
  align-items: center;
  margin-right: 15px;
}
page-planning .header-container .planning-download-wrapper, page-planning .chart-container .planning-download-wrapper {
  display: flex;
}
page-planning .cash-flow-table .title {
  display: flex;
}
page-planning .cash-flow-table .title span {
  margin-bottom: auto;
  margin-top: auto;
  padding: 5px 0;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 10;
}
page-planning .cash-flow-table .title span.chevron {
  flex-shrink: 1;
}
page-planning .cash-flow-table .cell {
  display: flex;
}
page-planning .cash-flow-table .cell span {
  width: 100%;
  padding-right: 15px;
  padding-top: 8px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
}
page-planning .cash-flow-table .cell span.iconsax {
  padding: 5px 2px 0 2px;
  justify-content: flex-start;
  width: 25px;
}
page-planning .cash-flow-table .cell span.text {
  padding-right: 0px !important;
}
page-planning .progress-line-green {
  position: relative !important;
  background: linear-gradient(90deg, var(--green-color14) 0%, var(--green-color15) 90%, var(--green-color16) 100%) !important;
}
page-planning .progress-line-amber {
  position: relative !important;
  background: rgba(240, 155, 56, 0.7) !important;
  background: linear-gradient(90deg, var(--orange-color14) 0%, var(--orange-color15) 90%, var(--orange-color16) 100%) !important;
}
page-planning .amount-progress {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  transition: all 0.8s;
  background-color: var(--ultra-light-blue3);
}
page-planning .amount-progress.halfprogress {
  width: 98%;
}
page-planning .amount-progress.startprogress {
  width: 0;
}
page-planning .disable-overlay {
  position: absolute;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: stretch;
  height: 100%;
  width: 100%;
}
page-planning .disable-overlay:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--black-overlay-color);
  opacity: 0.3;
}
page-planning .disable-overlay .hint {
  background: var(--green-color3);
  height: 70px;
  width: 100%;
  display: flex;
  align-items: stretch;
  justify-content: center;
  position: relative;
}
page-planning .disable-overlay .hint .icon {
  font-size: 40px;
  line-height: 0.6;
  color: var(--green-color1);
}
page-planning .disable-overlay .hint .text {
  margin: 0 15px;
}
page-planning .recently-created-plan-panel {
  background: var(--green-color3);
  height: 80px;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
page-planning .recently-created-plan-panel .icon {
  font-size: 40px;
}
page-planning .recently-created-plan-panel .text {
  margin: 0 15px;
}
page-planning .recently-created-plan-panel .button {
  width: 155px;
}
page-planning .all-categories-planned-panel {
  background: var(--green-color3);
  height: 80px;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
page-planning .notifications-panel {
  height: 65px;
  padding: 10px 0;
  border-bottom: var(--default-border);
  border-top: var(--default-border);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
page-planning .notifications-panel .divider {
  background-color: var(--default-border-color);
  height: 100%;
  width: 1px;
}
page-planning .notifications-panel .accounts {
  display: flex;
  align-items: flex-end;
  height: 100%;
}
page-planning .notifications-panel .accounts .account {
  display: flex;
  flex-direction: column;
  padding: 0 25px;
}
page-planning .notifications-panel .accounts .account .total {
  font-size: 28px;
  font-weight: 400;
  line-height: 1;
  color: var(--black-color0);
}
page-planning .notifications-panel .accounts .account .total span {
  font-size: 16px;
  font-weight: 400;
  margin-right: 5px;
}
page-planning .notifications-panel .accounts .view-more {
  width: 100px;
}
page-planning .notifications-panel .comments-container {
  display: flex;
}
page-planning .notifications-panel .comments-container .icon {
  font-size: 36px;
  line-height: 1;
  color: var(--green-color1);
  margin: 0 15px 0 25px;
}
page-planning .notifications-panel .comments-container .comments {
  display: flex;
  flex-direction: column;
  margin: 0 25px 0 0;
}
page-planning .notifications-panel .comments-container .comments .count {
  font-size: 27px;
  font-weight: 400;
  color: var(--black-color0);
  line-height: 1;
}
page-planning .notifications-panel .out-of-budget-container {
  display: flex;
}
page-planning .notifications-panel .out-of-budget-container .icon {
  font-size: 36px;
  line-height: 1;
  color: var(--notification-color);
  margin: 0 15px 3px 25px;
}
page-planning .notifications-panel .out-of-budget-container .out-of-budget {
  display: flex;
  flex-direction: column;
  margin: 0 25px 0 0;
}
page-planning .notifications-panel .out-of-budget-container .out-of-budget .count {
  font-size: 27px;
  font-weight: 400;
  color: var(--black-color0);
  line-height: 1;
}
page-planning .periods {
  display: flex;
  align-items: center;
  height: 100%;
}
page-planning .periods .button-toggle {
  width: 160px;
}
page-planning .periods.periods-right {
  width: 380px;
  justify-content: flex-end;
}
page-planning .periods.periods-left {
  width: 380px;
  gap: 20px;
  justify-content: flex-start;
}
page-planning .periods .button {
  margin: auto;
}
page-planning .toggle {
  display: flex;
  margin-top: auto;
  margin-bottom: auto;
}
page-planning .toggle .wrapper-tooltip {
  position: relative;
  height: 21.2px;
}
page-planning .toggle .form-label {
  margin-right: 5px;
  margin-top: auto;
  margin-bottom: auto;
  color: var(--gray-color1);
  white-space: nowrap;
}
page-planning .toggle .tooltip {
  top: -18px;
  left: 40px;
}
page-planning .periods-panel {
  height: 55px;
  padding: 0 25px;
  display: flex;
  justify-content: space-between;
}
page-planning .periods-panel .buttons {
  display: flex;
  align-items: center;
}
page-planning .periods-panel .buttons .prev, page-planning .periods-panel .buttons .next {
  margin: 0 3px;
  font-size: 13px;
  height: 32px;
  width: 32px;
  background: var(--ultra-light-blue2);
  color: var(--blue-color6);
  border-radius: 50%;
  border: none;
}
page-planning .chart-container-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
page-planning .chart-container-header .buttons {
  margin-left: 15px;
  color: var(--menu-link-color);
  display: flex;
  align-items: center;
}
page-planning .chart-container-header .buttons ui-button {
  margin: 0 10px;
}
page-planning .chart-container {
  display: flex;
  flex-direction: column;
  max-height: 575px;
  position: relative;
  padding: 15px;
  min-height: 30px;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin: 0 25px 15px 25px;
  background: var(--white-color);
}
page-planning .chart-container .chart {
  width: 100%;
  overflow: hidden;
}
page-planning .chart-container .chart-hidden-wrapper {
  overflow: hidden !important;
}
page-planning .chart-container .btn-toggle-collapse {
  cursor: pointer;
  bottom: 7px;
  left: 20px;
  padding: 2px 10px;
  z-index: 2;
  width: 100px;
  margin-right: 40px;
  display: flex;
  align-items: stretch;
}
page-planning .chart-container .btn-toggle-collapse .chevron {
  transition: linear 0.2s;
  font-size: 12px;
}
page-planning .chart-container .btn-toggle-collapse .buttons {
  margin-left: 15px;
}
page-planning .chart-container .btn-toggle-collapse .text {
  margin-left: 5px;
  line-height: 1;
}
page-planning .chart-container.collapsed .btn-toggle-collapse .chevron {
  transform: rotate(-180deg);
}
page-planning .chart-container.expanded {
  height: 575px;
}
page-planning .chart-container .expandedBar:not(.collapsed) {
  height: 575px;
}
page-planning .cash-flow-table .toggle-collapse {
  cursor: pointer;
  padding: 2px 10px;
  width: 100px;
}
page-planning .cash-flow-table .toggle-collapse .chevron {
  transition: linear 0.2s;
  font-size: 12px;
}
page-planning .cash-flow-table .toggle-collapse.collapsed .chevron {
  transform: rotate(-180deg);
}
page-planning .chevron {
  transition: linear 0.2s;
  font-size: 12px;
  display: inline-block;
}
page-planning .cash-flow-table {
  display: flex;
  background: var(--white-color);
  border-radius: var(--border-radius);
  color: var(--menu-link-color);
  flex-direction: column;
  margin: 0 25px 15px;
  box-shadow: 0 0 10px 0 var(--shadow-color1);
}
page-planning .cash-flow-table .chart-container-header {
  padding: 20px 15px;
  position: sticky;
  top: 0;
  background: var(--white-color);
  z-index: 3;
  border-radius: var(--border-radius);
}
page-planning .cash-flow-table .cell {
  flex-basis: calc((100% - 220px) / var(--colcount));
  flex-shrink: 0;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  position: relative;
}
page-planning .cash-flow-table .cell.expanded {
  background: var(--ultra-light-blue3);
  font-weight: 500;
  overflow: hidden;
}
page-planning .cash-flow-table .cell.expanded .actual, page-planning .cash-flow-table .cell.expanded .planned {
  z-index: 2;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  flex-direction: column;
  height: 100%;
}
page-planning .cash-flow-table .cell.expanded .actual .month, page-planning .cash-flow-table .cell.expanded .planned .month {
  line-height: 1.5;
}
page-planning .cash-flow-table .cell.expanded .actual .month + span, page-planning .cash-flow-table .cell.expanded .planned .month + span {
  line-height: 1.5;
}
page-planning .cash-flow-table .cell.expanded .actual {
  border-left: 1px solid var(--blue-color7);
  width: 100%;
}
page-planning .cash-flow-table .cell.expanded .planned, page-planning .cash-flow-table .cell.expanded .data {
  border-left: 1px solid var(--blue-color7);
  border-right: 1px solid var(--blue-color7);
  width: 100%;
}
page-planning .cash-flow-table .periods-header {
  display: flex;
  justify-content: flex-start;
  position: -webkit-sticky;
  top: 70px !important;
  margin: 0 20px 15px;
  border-bottom: var(--default-border-header);
  background: var(--white-color);
  border-radius: 5px;
}
page-planning .cash-flow-table .periods-header.periods-header-black {
  border: 2px solid var(--black-color0);
}
page-planning .cash-flow-table .periods-header.periods-header-black .title-cell {
  color: var(--black-color0);
}
page-planning .cash-flow-table .periods-header.periods-header-blue {
  border: 2px solid var(--blue-color6);
}
page-planning .cash-flow-table .periods-header.periods-header-blue .title-cell {
  color: var(--blue-color6);
}
page-planning .cash-flow-table .periods-header.periods-header-orange {
  border: 2px solid var(--orange-color4);
}
page-planning .cash-flow-table .periods-header.periods-header-orange .title-cell {
  color: var(--orange-color4);
}
page-planning .cash-flow-table .periods-header .title-cell {
  flex-basis: 220px;
  width: 220px;
  flex-shrink: 0;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: 8px;
  padding-left: 10px;
  word-wrap: anywhere;
  overflow: hidden;
}
page-planning .cash-flow-table .periods-header .title-cell.periods-panel {
  padding-left: 0;
}
page-planning .cash-flow-table .periods-header .title-cell.periods-panel .periods .period:first-child {
  margin-left: 0px;
}
page-planning .cash-flow-table .periods-header .title-cell .buttons {
  margin-left: 15px;
}
page-planning .cash-flow-table .periods-header .title-cell .buttons ui-icon-button {
  font-size: 13px;
  height: 32px;
  width: 32px;
  background: var(--ultra-light-blue2);
  color: var(--blue-color6);
  border-radius: 50%;
  border: none;
}
page-planning .cash-flow-table .periods-header .title-cell .buttons ui-icon-button:first-child {
  margin-right: 3px;
}
page-planning .cash-flow-table .periods-header .title-cell .toggle-collapse {
  cursor: pointer;
  display: flex;
  align-items: center;
}
page-planning .cash-flow-table .periods-header .title-cell .toggle-collapse.collapsed .chevron {
  transform: rotate(-90deg);
}
page-planning .cash-flow-table .periods-header .title-cell .toggle-collapse .chevron {
  font-size: 12px;
  transition: linear 0.2s;
}
page-planning .cash-flow-table .periods-header .title-cell .toggle-collapse .text {
  margin-left: 5px;
}
page-planning .cash-flow-table .periods-header .expanded.actual {
  border-top-left-radius: 3px;
}
page-planning .cash-flow-table .periods-header .expanded.planned {
  border-top-right-radius: 3px;
}
page-planning .cash-flow-table .periods-header .cell .title {
  display: flex !important;
  min-height: 30px;
}
page-planning .cash-flow-table .periods-header .cell.weeklyCell .title {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
}
page-planning .cash-flow-table .periods-header .cell.weeklyCell .title .data {
  padding: 5px 0;
}
page-planning .cash-flow-table .periods-header .cell.weeklyCell .title .filler {
  min-height: 18px;
  margin: 0;
}
page-planning .cash-flow-table .periods-header .cell.weeklyCell .title .week-title {
  padding: 0 15px 0 0;
  margin: 2px 0;
}
page-planning .cash-flow-table .periods-header .cell .week-title {
  font-size: 11px;
}
page-planning .cash-flow-table .periods-header .cell .scale-title {
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
}
page-planning .cash-flow-table .periods-header .cell.expanded {
  align-items: center !important;
}
page-planning .cash-flow-table .periods-header .cell.expanded .actual, page-planning .cash-flow-table .periods-header .cell.expanded .planned {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 0 0 5px 0;
}
page-planning .cash-flow-table .periods-header .cell.expanded .actual .month, page-planning .cash-flow-table .periods-header .cell.expanded .planned .month {
  color: var(--black-color1);
}
page-planning .cash-flow-table .container-level0 {
  display: flex;
  flex-direction: column;
}
page-planning .cash-flow-table .container-level0 .item-level0 {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
  padding: 0 20px;
}
page-planning .cash-flow-table .container-level0 .item-level0 .item-inner-level0 {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  font-weight: 500;
  min-height: 30px;
  height: 100%;
  background-color: var(--white-color);
  border-bottom: var(--default-border-header);
  border-radius: var(--border-radius) var(--border-radius) 0 0;
}
page-planning .cash-flow-table .container-level0 .item-level0 .item-inner-level0:last-child {
  border-radius: var(--border-radius);
}
page-planning .cash-flow-table .container-level0 .item-level0 .item-inner-level0 .title {
  flex-shrink: 0;
  width: 220px;
  padding-left: 25px;
  display: flex;
  min-height: 30px !important;
  height: 100% !important;
  font-size: 13px !important;
}
page-planning .cash-flow-table .container-level0 .item-level0 .item-inner-level0 .cell {
  font-weight: 500;
}
page-planning .cash-flow-table .container-level1 {
  display: flex;
  flex-direction: column;
}
page-planning .cash-flow-table .container-level1 .item-level1 {
  display: flex;
  flex-direction: column;
}
page-planning .cash-flow-table .container-level1 .item-level1.collapsed .title .chevron {
  transform: rotate(-90deg);
}
page-planning .cash-flow-table .container-level1 .item-level1 .item-inner-level1 {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  border-bottom: var(--default-border);
  min-height: 30px;
  height: 100%;
  background-color: var(--white-color);
}
page-planning .cash-flow-table .container-level1 .item-level1 .item-inner-level1:last-child {
  border-radius: 0 0 var(--border-radius) var(--border-radius);
}
page-planning .cash-flow-table .container-level1 .item-level1 .item-inner-level1 .title {
  flex-shrink: 0;
  width: 220px;
  padding-left: 15px;
  font-size: 13px;
  display: flex;
  min-height: 30px !important;
  align-items: flex-start;
  color: var(--gray-color5);
}
page-planning .cash-flow-table .container-level1 .item-level1 .item-inner-level1 .title .chevron {
  font-size: 12px;
  font-weight: bold;
  margin-right: 10px;
  transition: linear 0.2s;
}
page-planning .cash-flow-table .container-level1 .item-level1 .item-inner-level1 .title ui-button.group-toggle {
  margin-left: -20px;
}
page-planning .cash-flow-table .container-level1 .item-level1 .item-inner-level1 .title:not(.pointer) span {
  margin-left: 10px;
}
page-planning .cash-flow-table .container-level2, page-planning .cash-flow-table .container-level3, page-planning .cash-flow-table .container-level4, page-planning .cash-flow-table .container-level5, page-planning .cash-flow-table .container-level6 {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
page-planning .cash-flow-table .container-level2 .item-level2, page-planning .cash-flow-table .container-level2 .item-level3, page-planning .cash-flow-table .container-level2 .item-level4, page-planning .cash-flow-table .container-level2 .item-level5, page-planning .cash-flow-table .container-level2 .item-level6, page-planning .cash-flow-table .container-level3 .item-level2, page-planning .cash-flow-table .container-level3 .item-level3, page-planning .cash-flow-table .container-level3 .item-level4, page-planning .cash-flow-table .container-level3 .item-level5, page-planning .cash-flow-table .container-level3 .item-level6, page-planning .cash-flow-table .container-level4 .item-level2, page-planning .cash-flow-table .container-level4 .item-level3, page-planning .cash-flow-table .container-level4 .item-level4, page-planning .cash-flow-table .container-level4 .item-level5, page-planning .cash-flow-table .container-level4 .item-level6, page-planning .cash-flow-table .container-level5 .item-level2, page-planning .cash-flow-table .container-level5 .item-level3, page-planning .cash-flow-table .container-level5 .item-level4, page-planning .cash-flow-table .container-level5 .item-level5, page-planning .cash-flow-table .container-level5 .item-level6, page-planning .cash-flow-table .container-level6 .item-level2, page-planning .cash-flow-table .container-level6 .item-level3, page-planning .cash-flow-table .container-level6 .item-level4, page-planning .cash-flow-table .container-level6 .item-level5, page-planning .cash-flow-table .container-level6 .item-level6 {
  display: flex;
  align-items: stretch;
  flex-direction: column;
  justify-content: flex-start;
  min-height: 30px;
  height: 100%;
  background-color: var(--ultra-light-blue1);
  color: var(--gray-color1) !important;
}
page-planning .cash-flow-table .container-level2 .item-level2 .chevron, page-planning .cash-flow-table .container-level2 .item-level3 .chevron, page-planning .cash-flow-table .container-level2 .item-level4 .chevron, page-planning .cash-flow-table .container-level2 .item-level5 .chevron, page-planning .cash-flow-table .container-level2 .item-level6 .chevron, page-planning .cash-flow-table .container-level3 .item-level2 .chevron, page-planning .cash-flow-table .container-level3 .item-level3 .chevron, page-planning .cash-flow-table .container-level3 .item-level4 .chevron, page-planning .cash-flow-table .container-level3 .item-level5 .chevron, page-planning .cash-flow-table .container-level3 .item-level6 .chevron, page-planning .cash-flow-table .container-level4 .item-level2 .chevron, page-planning .cash-flow-table .container-level4 .item-level3 .chevron, page-planning .cash-flow-table .container-level4 .item-level4 .chevron, page-planning .cash-flow-table .container-level4 .item-level5 .chevron, page-planning .cash-flow-table .container-level4 .item-level6 .chevron, page-planning .cash-flow-table .container-level5 .item-level2 .chevron, page-planning .cash-flow-table .container-level5 .item-level3 .chevron, page-planning .cash-flow-table .container-level5 .item-level4 .chevron, page-planning .cash-flow-table .container-level5 .item-level5 .chevron, page-planning .cash-flow-table .container-level5 .item-level6 .chevron, page-planning .cash-flow-table .container-level6 .item-level2 .chevron, page-planning .cash-flow-table .container-level6 .item-level3 .chevron, page-planning .cash-flow-table .container-level6 .item-level4 .chevron, page-planning .cash-flow-table .container-level6 .item-level5 .chevron, page-planning .cash-flow-table .container-level6 .item-level6 .chevron {
  font-size: 12px;
  font-weight: bold;
  margin-right: 10px;
  transition: linear 0.2s;
  display: inline-block;
}
page-planning .cash-flow-table .container-level2 .item-level2.collapsed .title .chevron, page-planning .cash-flow-table .container-level2 .item-level3.collapsed .title .chevron, page-planning .cash-flow-table .container-level2 .item-level4.collapsed .title .chevron, page-planning .cash-flow-table .container-level2 .item-level5.collapsed .title .chevron, page-planning .cash-flow-table .container-level2 .item-level6.collapsed .title .chevron, page-planning .cash-flow-table .container-level3 .item-level2.collapsed .title .chevron, page-planning .cash-flow-table .container-level3 .item-level3.collapsed .title .chevron, page-planning .cash-flow-table .container-level3 .item-level4.collapsed .title .chevron, page-planning .cash-flow-table .container-level3 .item-level5.collapsed .title .chevron, page-planning .cash-flow-table .container-level3 .item-level6.collapsed .title .chevron, page-planning .cash-flow-table .container-level4 .item-level2.collapsed .title .chevron, page-planning .cash-flow-table .container-level4 .item-level3.collapsed .title .chevron, page-planning .cash-flow-table .container-level4 .item-level4.collapsed .title .chevron, page-planning .cash-flow-table .container-level4 .item-level5.collapsed .title .chevron, page-planning .cash-flow-table .container-level4 .item-level6.collapsed .title .chevron, page-planning .cash-flow-table .container-level5 .item-level2.collapsed .title .chevron, page-planning .cash-flow-table .container-level5 .item-level3.collapsed .title .chevron, page-planning .cash-flow-table .container-level5 .item-level4.collapsed .title .chevron, page-planning .cash-flow-table .container-level5 .item-level5.collapsed .title .chevron, page-planning .cash-flow-table .container-level5 .item-level6.collapsed .title .chevron, page-planning .cash-flow-table .container-level6 .item-level2.collapsed .title .chevron, page-planning .cash-flow-table .container-level6 .item-level3.collapsed .title .chevron, page-planning .cash-flow-table .container-level6 .item-level4.collapsed .title .chevron, page-planning .cash-flow-table .container-level6 .item-level5.collapsed .title .chevron, page-planning .cash-flow-table .container-level6 .item-level6.collapsed .title .chevron {
  display: inline-block;
  transform: rotate(-90deg);
}
page-planning .cash-flow-table .container-level2 .item-level2:last-child, page-planning .cash-flow-table .container-level2 .item-level3:last-child, page-planning .cash-flow-table .container-level2 .item-level4:last-child, page-planning .cash-flow-table .container-level2 .item-level5:last-child, page-planning .cash-flow-table .container-level2 .item-level6:last-child, page-planning .cash-flow-table .container-level3 .item-level2:last-child, page-planning .cash-flow-table .container-level3 .item-level3:last-child, page-planning .cash-flow-table .container-level3 .item-level4:last-child, page-planning .cash-flow-table .container-level3 .item-level5:last-child, page-planning .cash-flow-table .container-level3 .item-level6:last-child, page-planning .cash-flow-table .container-level4 .item-level2:last-child, page-planning .cash-flow-table .container-level4 .item-level3:last-child, page-planning .cash-flow-table .container-level4 .item-level4:last-child, page-planning .cash-flow-table .container-level4 .item-level5:last-child, page-planning .cash-flow-table .container-level4 .item-level6:last-child, page-planning .cash-flow-table .container-level5 .item-level2:last-child, page-planning .cash-flow-table .container-level5 .item-level3:last-child, page-planning .cash-flow-table .container-level5 .item-level4:last-child, page-planning .cash-flow-table .container-level5 .item-level5:last-child, page-planning .cash-flow-table .container-level5 .item-level6:last-child, page-planning .cash-flow-table .container-level6 .item-level2:last-child, page-planning .cash-flow-table .container-level6 .item-level3:last-child, page-planning .cash-flow-table .container-level6 .item-level4:last-child, page-planning .cash-flow-table .container-level6 .item-level5:last-child, page-planning .cash-flow-table .container-level6 .item-level6:last-child {
  border-radius: 0 0 var(--border-radius) var(--border-radius);
}
page-planning .cash-flow-table .container-level2 .item-level2 .title, page-planning .cash-flow-table .container-level2 .item-level3 .title, page-planning .cash-flow-table .container-level2 .item-level4 .title, page-planning .cash-flow-table .container-level2 .item-level5 .title, page-planning .cash-flow-table .container-level2 .item-level6 .title, page-planning .cash-flow-table .container-level3 .item-level2 .title, page-planning .cash-flow-table .container-level3 .item-level3 .title, page-planning .cash-flow-table .container-level3 .item-level4 .title, page-planning .cash-flow-table .container-level3 .item-level5 .title, page-planning .cash-flow-table .container-level3 .item-level6 .title, page-planning .cash-flow-table .container-level4 .item-level2 .title, page-planning .cash-flow-table .container-level4 .item-level3 .title, page-planning .cash-flow-table .container-level4 .item-level4 .title, page-planning .cash-flow-table .container-level4 .item-level5 .title, page-planning .cash-flow-table .container-level4 .item-level6 .title, page-planning .cash-flow-table .container-level5 .item-level2 .title, page-planning .cash-flow-table .container-level5 .item-level3 .title, page-planning .cash-flow-table .container-level5 .item-level4 .title, page-planning .cash-flow-table .container-level5 .item-level5 .title, page-planning .cash-flow-table .container-level5 .item-level6 .title, page-planning .cash-flow-table .container-level6 .item-level2 .title, page-planning .cash-flow-table .container-level6 .item-level3 .title, page-planning .cash-flow-table .container-level6 .item-level4 .title, page-planning .cash-flow-table .container-level6 .item-level5 .title, page-planning .cash-flow-table .container-level6 .item-level6 .title {
  flex-shrink: 0;
  width: 205px;
  font-size: 13px;
  font-weight: 400;
  min-height: 30px !important;
  height: 100% !important;
  margin-left: 15px;
}
page-planning .cash-flow-table .container-level2 .item-level2 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level2 .item-level3 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level2 .item-level4 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level2 .item-level5 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level2 .item-level6 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level3 .item-level2 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level3 .item-level3 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level3 .item-level4 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level3 .item-level5 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level3 .item-level6 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level4 .item-level2 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level4 .item-level3 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level4 .item-level4 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level4 .item-level5 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level4 .item-level6 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level5 .item-level2 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level5 .item-level3 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level5 .item-level4 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level5 .item-level5 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level5 .item-level6 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level6 .item-level2 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level6 .item-level3 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level6 .item-level4 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level6 .item-level5 .title ui-button.group-toggle, page-planning .cash-flow-table .container-level6 .item-level6 .title ui-button.group-toggle {
  margin-left: -30px;
}
page-planning .cash-flow-table .container-level2 .item-level2 .cell.actual, page-planning .cash-flow-table .container-level2 .item-level3 .cell.actual, page-planning .cash-flow-table .container-level2 .item-level4 .cell.actual, page-planning .cash-flow-table .container-level2 .item-level5 .cell.actual, page-planning .cash-flow-table .container-level2 .item-level6 .cell.actual, page-planning .cash-flow-table .container-level3 .item-level2 .cell.actual, page-planning .cash-flow-table .container-level3 .item-level3 .cell.actual, page-planning .cash-flow-table .container-level3 .item-level4 .cell.actual, page-planning .cash-flow-table .container-level3 .item-level5 .cell.actual, page-planning .cash-flow-table .container-level3 .item-level6 .cell.actual, page-planning .cash-flow-table .container-level4 .item-level2 .cell.actual, page-planning .cash-flow-table .container-level4 .item-level3 .cell.actual, page-planning .cash-flow-table .container-level4 .item-level4 .cell.actual, page-planning .cash-flow-table .container-level4 .item-level5 .cell.actual, page-planning .cash-flow-table .container-level4 .item-level6 .cell.actual, page-planning .cash-flow-table .container-level5 .item-level2 .cell.actual, page-planning .cash-flow-table .container-level5 .item-level3 .cell.actual, page-planning .cash-flow-table .container-level5 .item-level4 .cell.actual, page-planning .cash-flow-table .container-level5 .item-level5 .cell.actual, page-planning .cash-flow-table .container-level5 .item-level6 .cell.actual, page-planning .cash-flow-table .container-level6 .item-level2 .cell.actual, page-planning .cash-flow-table .container-level6 .item-level3 .cell.actual, page-planning .cash-flow-table .container-level6 .item-level4 .cell.actual, page-planning .cash-flow-table .container-level6 .item-level5 .cell.actual, page-planning .cash-flow-table .container-level6 .item-level6 .cell.actual {
  color: var(--gray-color3);
}
page-planning .cash-flow-table .container-level2 .item-level2 .cell.planned, page-planning .cash-flow-table .container-level2 .item-level3 .cell.planned, page-planning .cash-flow-table .container-level2 .item-level4 .cell.planned, page-planning .cash-flow-table .container-level2 .item-level5 .cell.planned, page-planning .cash-flow-table .container-level2 .item-level6 .cell.planned, page-planning .cash-flow-table .container-level3 .item-level2 .cell.planned, page-planning .cash-flow-table .container-level3 .item-level3 .cell.planned, page-planning .cash-flow-table .container-level3 .item-level4 .cell.planned, page-planning .cash-flow-table .container-level3 .item-level5 .cell.planned, page-planning .cash-flow-table .container-level3 .item-level6 .cell.planned, page-planning .cash-flow-table .container-level4 .item-level2 .cell.planned, page-planning .cash-flow-table .container-level4 .item-level3 .cell.planned, page-planning .cash-flow-table .container-level4 .item-level4 .cell.planned, page-planning .cash-flow-table .container-level4 .item-level5 .cell.planned, page-planning .cash-flow-table .container-level4 .item-level6 .cell.planned, page-planning .cash-flow-table .container-level5 .item-level2 .cell.planned, page-planning .cash-flow-table .container-level5 .item-level3 .cell.planned, page-planning .cash-flow-table .container-level5 .item-level4 .cell.planned, page-planning .cash-flow-table .container-level5 .item-level5 .cell.planned, page-planning .cash-flow-table .container-level5 .item-level6 .cell.planned, page-planning .cash-flow-table .container-level6 .item-level2 .cell.planned, page-planning .cash-flow-table .container-level6 .item-level3 .cell.planned, page-planning .cash-flow-table .container-level6 .item-level4 .cell.planned, page-planning .cash-flow-table .container-level6 .item-level5 .cell.planned, page-planning .cash-flow-table .container-level6 .item-level6 .cell.planned {
  color: var(--blue-color3);
}
page-planning .cash-flow-table .container-level2 .item-level2 .cell.neg-deviation, page-planning .cash-flow-table .container-level2 .item-level3 .cell.neg-deviation, page-planning .cash-flow-table .container-level2 .item-level4 .cell.neg-deviation, page-planning .cash-flow-table .container-level2 .item-level5 .cell.neg-deviation, page-planning .cash-flow-table .container-level2 .item-level6 .cell.neg-deviation, page-planning .cash-flow-table .container-level3 .item-level2 .cell.neg-deviation, page-planning .cash-flow-table .container-level3 .item-level3 .cell.neg-deviation, page-planning .cash-flow-table .container-level3 .item-level4 .cell.neg-deviation, page-planning .cash-flow-table .container-level3 .item-level5 .cell.neg-deviation, page-planning .cash-flow-table .container-level3 .item-level6 .cell.neg-deviation, page-planning .cash-flow-table .container-level4 .item-level2 .cell.neg-deviation, page-planning .cash-flow-table .container-level4 .item-level3 .cell.neg-deviation, page-planning .cash-flow-table .container-level4 .item-level4 .cell.neg-deviation, page-planning .cash-flow-table .container-level4 .item-level5 .cell.neg-deviation, page-planning .cash-flow-table .container-level4 .item-level6 .cell.neg-deviation, page-planning .cash-flow-table .container-level5 .item-level2 .cell.neg-deviation, page-planning .cash-flow-table .container-level5 .item-level3 .cell.neg-deviation, page-planning .cash-flow-table .container-level5 .item-level4 .cell.neg-deviation, page-planning .cash-flow-table .container-level5 .item-level5 .cell.neg-deviation, page-planning .cash-flow-table .container-level5 .item-level6 .cell.neg-deviation, page-planning .cash-flow-table .container-level6 .item-level2 .cell.neg-deviation, page-planning .cash-flow-table .container-level6 .item-level3 .cell.neg-deviation, page-planning .cash-flow-table .container-level6 .item-level4 .cell.neg-deviation, page-planning .cash-flow-table .container-level6 .item-level5 .cell.neg-deviation, page-planning .cash-flow-table .container-level6 .item-level6 .cell.neg-deviation {
  color: var(--orange-color6);
}
page-planning .cash-flow-table.main-table .item-inner-level2 .title {
  padding-left: 36px;
}
page-planning .cash-flow-table.main-table .item-inner-level3 .title {
  padding-left: 62px;
}
page-planning .cash-flow-table.main-table .item-inner-level4 .title {
  padding-left: 88px;
}
page-planning .cash-flow-table.main-table .item-inner-level5 .title {
  padding-left: 114px;
}
page-planning .cash-flow-table.main-table .item-inner-level6 .title {
  padding-left: 140px;
}
page-planning .cash-flow-table.main-table .subheader .title span {
  margin-left: auto;
  padding-right: 3px;
  font-size: 12px;
}
page-planning .cash-flow-table.main-table .subheader span {
  font-style: italic;
}
page-planning .cash-flow-table.main-table .subheader .cell {
  color: var(--gray-color11);
}
page-planning .item-level3 {
  border: 0;
}
page-planning .item-level3:last-child {
  border-bottom: 0;
}
page-planning .item-level3:first-child {
  border-top: 0;
}
page-planning .chevron-sub {
  margin-right: 10px;
  display: inline-block;
}
page-planning .gray3-text, page-planning .cash-flow-table.main-table .item-inner-level4 .title {
  color: var(--gray-color1);
}
page-planning .gray4-text {
  color: var(--gray-color1);
}
page-planning .gray5-text {
  color: var(--gray-color1);
}
page-planning .item-inner-level2, page-planning .item-inner-level3, page-planning .item-inner-level4, page-planning .item-inner-level5, page-planning .item-inner-level6 {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  background-color: var(--gray-color7);
  border-bottom: var(--default-border);
}
page-planning .item-inner-level0:hover, page-planning .item-inner-level1:hover, page-planning .item-inner-level2:hover, page-planning .item-inner-level3:hover, page-planning .item-inner-level4:hover, page-planning .item-inner-level5:hover, page-planning .item-inner-level6:hover {
  background-color: var(--white-color12) !important;
}
page-planning .footer-prev-next-panel {
  height: 55px;
  padding: 0 25px;
  display: flex;
  justify-content: flex-end;
  border-bottom: var(--default-border);
  background: var(--white-color);
}
page-planning .footer-prev-next-panel .buttons {
  display: flex;
  align-items: center;
}
page-planning .footer-prev-next-panel .buttons .prev, page-planning .footer-prev-next-panel .buttons .next {
  margin: 0 3px;
  font-size: 13px;
  height: 32px;
  width: 32px;
  background: var(--ultra-light-blue2);
  color: var(--blue-color6);
  border-radius: 50%;
  border: none;
}
page-planning .loader-excel {
  margin: 0 auto;
  width: 30px;
  position: absolute;
  right: 120px;
}
page-planning .page-loader {
  background: var(--white-color5);
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0 auto;
}
page-planning .no-data-popup + .global-page-loader {
  display: none;
}
page-planning .clickable, page-planning .pointer {
  cursor: pointer !important;
}
page-planning .uppercase {
  text-transform: uppercase;
}
page-planning ui-confirm-dialog .dialog-inner {
  width: 500px !important;
}
page-planning .expired-forecast {
  padding: 0 25px;
}
page-planning .expired-forecast .updateDate app-input-year-select {
  display: inline-block;
}
page-planning .expired-forecast .updateDate app-input-year-select .calendar-wrapper {
  right: 0;
  left: auto;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-transactions {
  display: flex;
  flex-direction: column;
  position: relative;
}
page-transactions .tabs-container [nav] .navigation-wrapper {
  display: flex;
  width: 100%;
  max-width: 1380px;
}
page-transactions .tabs-container [nav] .navigation-wrapper .comment-in-nav {
  margin-left: auto;
  margin-right: 25px;
}
page-transactions .tabs-container [nav] .nav-item.active .icon-rule {
  cursor: default !important;
}
page-transactions .tabs-container [nav] .nav-item.active .icon-rule:before {
  width: 20px;
  height: 20px;
  cursor: default !important;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_black.svg);
}
page-transactions .tabs-container [nav] .nav-item:not(.active):hover .icon-rule:before {
  width: 20px;
  height: 20px;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_blue.svg);
}
page-transactions .tabs-container [nav] .nav-item .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
  margin-left: 10px;
}
page-transactions .tabs-container [nav] .nav-item .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_gray.svg);
  background-repeat: no-repeat;
  background-position: 0 50%;
  margin: auto;
}
page-transactions .loader-sync {
  width: auto;
  padding-left: 40px;
  line-height: 30px;
}
page-transactions .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
page-transactions .tag:not(:first-child) {
  margin-left: 5px;
}
page-transactions .tag.more-tag {
  min-width: unset;
  border: unset;
}
page-transactions .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.selected option {
  cursor: pointer !important;
}

.loader {
  color: var(--green-color1);
  height: 30px;
  width: 30px;
  position: relative;
  margin: 0 15px;
}
.loader .image-load {
  width: 30px;
}

.loader.hide {
  display: none;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-account-receivables {
  display: flex;
  flex-direction: column;
  position: relative;
}
page-account-receivables .sync {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
page-account-receivables .sync .success-summary {
  margin: 0 15px 0 0 !important;
}
page-account-receivables .tabs-container [nav] .navigation-wrapper {
  display: flex;
  width: 100%;
  max-width: 1380px;
}
page-account-receivables .tabs-container [nav] .navigation-wrapper .comment-in-nav {
  margin-left: auto;
  margin-right: 25px;
}
page-account-receivables .tabs-container [nav] .nav-item.active .icon-rule {
  cursor: default !important;
}
page-account-receivables .tabs-container [nav] .nav-item.active .icon-rule:before {
  cursor: default !important;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_black.svg);
}
page-account-receivables .tabs-container [nav] .nav-item:not(.active):hover .icon-rule:before {
  width: 20px;
  height: 20px;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_blue.svg);
}
page-account-receivables .tabs-container [nav] .nav-item.disabled {
  cursor: default;
}
page-account-receivables .tabs-container [nav] .nav-item.disabled .text {
  opacity: 0.5;
}
page-account-receivables .tabs-container [nav] .nav-item .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
  margin-left: 10px;
}
page-account-receivables .tabs-container [nav] .nav-item .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_gray.svg);
  background-repeat: no-repeat;
  background-position: 0 50%;
  margin: auto;
}
page-account-receivables .tabs-container [nav] .nav-item .tooltiptext {
  visibility: hidden;
  width: 120px;
  background: rgba(44, 60, 76, 0.8);
  color: var(--white-color);
  text-align: center;
  border-radius: var(--border-radius);
  padding: 5px 0;
  top: 100%;
  left: 50%;
  margin-left: -60px;
  /* Position the tooltip */
  position: absolute;
  z-index: 100;
}
page-account-receivables .tabs-container [nav] .nav-item:hover .tooltiptext {
  visibility: visible;
}
page-account-receivables .loader-sync {
  width: auto;
  padding-left: 40px;
  line-height: 30px;
}
page-account-receivables .tag-wrapper {
  margin-top: 5px;
  display: flex;
}
page-account-receivables .tag {
  padding: 2px 9px;
  border-radius: 10px;
  font-size: 13px;
  margin-right: 5px;
  cursor: pointer;
  position: relative;
  background: var(--gray-color13);
  color: var(--gray-color1);
  text-align: center;
}
page-account-receivables .tag:not(:first-child) {
  margin-left: 5px;
}
page-account-receivables .tag.more-tag {
  min-width: unset;
  border: unset;
}
page-account-receivables .tag .tagName {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
@media screen and (max-width: 1300px) {
  page-account-receivables .tag {
    min-width: unset;
  }
}
page-account-receivables .transactions-download-wrapper {
  margin-left: auto;
}
page-account-receivables .filter-all .item {
  position: relative;
}
page-account-receivables .filter-all .item .search-button {
  position: absolute;
  right: 0;
  text-align-last: center;
  top: 0;
  height: 32px;
  display: block;
  width: 32px;
  line-height: 32px;
  cursor: pointer;
  z-index: 1;
}
page-account-receivables .filter-all .item .search-text {
  max-width: 160px;
}
page-account-receivables .filter-all .item .search-text .text-boxes {
  padding-right: 25px;
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
page-account-receivables .filter-all .item .drp-label {
  background-color: var(--gray-color13) !important;
  border-radius: 20px;
  border: none;
}
page-account-receivables .filter-all .item .drp-menu {
  width: auto !important;
}

.selected option {
  cursor: pointer !important;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-reporting {
  position: relative;
}
page-reporting .header-container .download {
  margin-left: auto;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-data-room {
  position: relative;
}
page-data-room .no-data {
  overflow: hidden;
}
page-data-room .no-items {
  font-size: 14px;
  font-weight: 500;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 10px 20px;
  margin: 10px 0;
  border-radius: var(--border-radius);
}
page-data-room .notifications-panel {
  height: 65px;
  padding: 10px 0;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}
page-data-room .notifications-panel .divider {
  background-color: var(--default-border-color);
  height: 100%;
  width: 1px;
}
page-data-room .notifications-panel .iconsax {
  --Iconsax-Size: 20px;
  margin-right: 10px;
}
page-data-room .notifications-panel .reports-notification {
  display: flex;
  align-items: center;
  margin: 0 25px 0 25px;
}
page-data-room .notifications-panel .reports-notification .icon {
  font-size: 36px;
  line-height: 1;
  color: var(--green-color1);
  margin: 0 20px 0 0;
}
page-data-room .notifications-panel .reports-notification .info {
  display: flex;
  flex-direction: column;
}
page-data-room .notifications-panel .reports-notification .info .count {
  font-size: 27px;
  font-weight: 400;
  color: var(--black-color0);
  line-height: 1;
}
page-data-room .notifications-panel .files-notification {
  display: flex;
  align-items: center;
  margin: 0 25px 0 25px;
}
page-data-room .notifications-panel .files-notification .icon {
  font-size: 36px;
  line-height: 1;
  color: var(--green-color1);
  margin: 0 20px 0 0;
}
page-data-room .notifications-panel .files-notification .info {
  display: flex;
  flex-direction: column;
}
page-data-room .notifications-panel .files-notification .info .count {
  font-size: 27px;
  font-weight: 400;
  color: var(--black-color0);
  line-height: 1;
}
page-data-room .actions-panel {
  padding: 0 15px 0 25px;
  height: 55px;
  display: flex;
  align-items: center;
}
page-data-room .actions-panel .file-upload-wrapper:hover .btn-add-file {
  background: var(--green-color2);
}
page-data-room .actions-panel .btn-add-file {
  width: 180px;
}
page-data-room .actions-panel .filters {
  display: flex;
  align-items: center;
  margin-left: auto;
}
page-data-room .actions-panel .filters .filter {
  margin-right: 8px;
  width: 145px;
}
page-data-room .actions-panel .filters .reset {
  margin-right: 10px;
  margin-left: 10px;
}
page-data-room .file-upload-error {
  display: inline-block;
  color: var(--orange-color1);
  margin-left: 15px;
}
page-data-room .content {
  display: flex;
  position: relative;
}
page-data-room .content .report-list {
  width: 100%;
}
page-data-room .content .left-panel {
  width: 225px;
  padding: 5px 20px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
}
page-data-room .content .left-panel .filter-outer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  border-bottom: var(--default-border);
}
page-data-room .content .left-panel .filter-outer:last-child {
  border-bottom: none;
}
page-data-room .content .left-panel .filter-outer .filter {
  padding: 0 7px;
  height: 50px;
  line-height: 50px;
}
page-data-room .content .left-panel .filter-outer .filter.active {
  color: var(--black-color0);
  cursor: default;
}
page-data-room .content .left-panel .filter-outer .filter.active .count {
  color: var(--default-font-color);
}
page-data-room .content .left-panel .filter-outer .tags {
  display: flex;
  flex-direction: column;
  margin: 0 0 15px 25px;
}
page-data-room .content .left-panel .filter-outer .tags .tag {
  margin-bottom: 8px;
}
page-data-room .content .reports-table, page-data-room .content .files-table {
  flex-grow: 1;
  margin: 0 15px 25px 0;
}
page-data-room .content .reports-table.readonly .row, page-data-room .content .files-table.readonly .row {
  padding-left: 15px;
}
page-data-room .content .reports-table.readonly .row:first-child, page-data-room .content .files-table.readonly .row:first-child {
  margin-top: 10px;
}
page-data-room .content .reports-table > .actions, page-data-room .content .files-table > .actions {
  height: 65px;
  display: flex;
  align-items: center;
  border: 1px solid transparent;
}
page-data-room .content .reports-table > .actions .select, page-data-room .content .files-table > .actions .select {
  margin: 0 17px;
}
page-data-room .content .reports-table > .actions .action, page-data-room .content .files-table > .actions .action {
  margin-right: 5px;
}
page-data-room .content .reports-table .row, page-data-room .content .files-table .row {
  min-height: 65px;
  padding: 10px 0;
  background: var(--white-color);
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  margin-bottom: 8px;
  display: flex;
  align-items: flex-start;
}
page-data-room .content .reports-table .row .select, page-data-room .content .files-table .row .select {
  margin: 4px 17px 0 17px;
}
page-data-room .content .reports-table .row .date, page-data-room .content .files-table .row .date {
  padding: 6px 0;
  line-height: 17px;
  width: 65px;
  display: flex;
  flex-direction: column;
}
page-data-room .content .reports-table .row .date .day, page-data-room .content .files-table .row .date .day {
  font-size: 18px;
}
page-data-room .content .reports-table .row .author, page-data-room .content .files-table .row .author {
  padding: 6px 0;
  width: 110px;
  display: flex;
  justify-content: center;
}
page-data-room .content .reports-table .row .info, page-data-room .content .files-table .row .info {
  padding: 6px 10px;
  text-align: left;
  display: flex;
  flex-direction: column;
}
page-data-room .content .reports-table .row .info .tags, page-data-room .content .files-table .row .info .tags {
  margin: 5px 0;
}
page-data-room .content .reports-table .row .info .tags .tag, page-data-room .content .files-table .row .info .tags .tag {
  margin-right: 4px;
}
page-data-room .content .reports-table .row .comments, page-data-room .content .files-table .row .comments {
  display: flex;
  flex-direction: column;
  flex: 1;
  flex-basis: 90px;
  text-align: left;
  padding: 0 10px;
}
page-data-room .content .reports-table .row .comments .icon, page-data-room .content .files-table .row .comments .icon {
  font-size: 21px;
  line-height: 1;
}
page-data-room .content .reports-table .row .comments .text .count, page-data-room .content .files-table .row .comments .text .count {
  margin-right: 2px;
}
page-data-room .content .reports-table .row .actions, page-data-room .content .files-table .row .actions {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 0 15px;
  margin-left: auto;
}
page-data-room .deleting-loader {
  position: absolute;
  top: 0;
  left: 210px;
  width: 100%;
  height: 100%;
  background: var(--white-color5);
}

.email-form {
  display: block !important;
  padding: 0 35px 20px;
}
.email-form ui-text-box {
  width: 360px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-setup {
  display: block;
}
page-setup .main-container {
  display: flex;
  flex-direction: column;
}
page-setup .main-container .content-panel {
  flex-grow: 1;
  margin: 15px 15px 15px 0;
}
page-setup .main-container .content-panel .roles {
  margin-right: 15px;
  margin-left: auto;
  font-size: 11px;
  display: flex;
  align-items: center;
}
page-setup .confirm-delete .text-boxes {
  text-align: left !important;
}
page-setup .wrapper {
  display: flex;
}
page-setup .buttons-wrapper {
  background: var(--gray-color7);
  border-top: var(--default-border);
  padding: 0 20px;
  border-radius: 0 0 6px 6px;
  overflow: hidden;
  display: flex;
  align-items: center;
  height: 55px;
}
page-setup .btn-cancel {
  margin-left: auto;
}
page-setup .btn-save {
  width: 150px;
  margin-left: 10px;
}
page-setup .secure {
  padding: 0 25px 20px 45px;
}
page-setup .secure__text span {
  font-size: 12px;
  color: var(--gray-color1);
}
page-setup .secure__img {
  padding-top: 10px;
}
page-setup .secure__img img {
  width: 95px;
  height: 53px;
}
page-setup .list-show {
  padding-left: 20px;
}
page-setup .hint {
  margin-top: 10px;
}
page-setup .form-row.hide {
  display: none;
}
page-setup .card-header {
  display: flex;
}
page-setup .card-header {
  flex-direction: column;
  align-items: flex-start;
  margin-left: 20px;
  height: auto !important;
  border: none !important;
}
page-setup .card-header .card-note {
  margin-bottom: auto;
  margin-top: 8px;
  margin-left: 0;
}
page-setup .card-header .card-title {
  margin-left: 0 !important;
}
page-setup .card-container .card-header .card-title {
  margin-top: auto;
  margin-bottom: auto;
  display: flex;
  font-weight: 500;
  font-size: 18px;
  line-height: 21px;
  text-transform: none;
  justify-content: flex-start;
}
page-setup .card-container .card-header .card-title .aligner {
  display: flex;
  align-items: center;
  margin-right: auto;
}
page-setup .card-container .card-header .card-title ui-text-button {
  margin-left: 10px;
}
page-setup .card-container .card-header .card-title .tooltip {
  top: -40px;
  left: -10px;
}
page-setup .card-container .card-header .card-title .tooltip:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 15px;
  transform: rotate(180deg);
}
page-setup .card-title-note {
  margin-top: 5px !important;
}
page-setup .card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
page-setup .card-container .card-header #HiddenText {
  display: none;
}
page-setup .card-container .card-header .sync:hover #HiddenText {
  display: block;
}
page-setup .bank-bic {
  margin-left: 15px;
}
page-setup .accounts-loader {
  margin: 0 auto;
  width: 30px;
  padding: 0;
}
page-setup .card-container {
  width: 100%;
}
page-setup .card-container.team {
  overflow-y: visible !important;
}
page-setup .card-subtitle {
  color: var(--black-color0);
  font-weight: 500;
  font-size: 15px;
  padding: 25px 25px 0 25px;
}

.last-sync {
  margin-left: 15px;
}

.find-bank-error {
  margin: 18px 0 20px;
  padding: 5px 22px;
}

.bank-login-wrapper {
  display: flex;
}
.bank-login-wrapper .bank-login {
  padding-right: 50px;
}
.bank-login-wrapper .form-label {
  white-space: nowrap;
}
.bank-login-wrapper .hint {
  margin-top: 15px;
  max-width: 400px;
}

.connection-to-bank {
  padding-top: 30px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-user-profile .main-container {
  display: flex;
}
page-user-profile .main-container .content-panel {
  flex-grow: 1;
  margin: 0;
}
page-user-profile .card-container {
  flex: 1;
}
page-user-profile .card-container .card-header .card-title {
  margin-top: 13px;
}
page-user-profile .card-title-note {
  margin-top: 5px !important;
}
page-user-profile .card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
page-user-profile .card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  /* Gray 3 */
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}
page-user-profile .buttons-wrapper {
  background: var(--gray-color7);
  border-top: var(--default-border);
  padding: 0 20px;
  border-radius: 0 0 6px 6px;
  overflow: hidden;
  display: flex;
  align-items: center;
  height: 55px;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.right-bar-signin {
  position: relative;
  background-color: var(--ultra-light-blue1);
}

@media (max-width: 767px) {
  .right-bar-signin {
    display: none;
  }
  .left-bar {
    display: block;
    min-width: 300px;
    width: 100%;
  }
  .left-bar .wrap-page-auth {
    width: 100%;
    padding-top: 50px;
  }
  .left-bar .page-auth .title {
    font-size: 20px;
  }
  .left-bar .page-restoring {
    width: 100%;
    display: flex;
    flex-direction: column;
  }
}
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
page-progress .header-container {
  margin-bottom: 10px;
  justify-content: unset !important;
}
page-progress .info-message {
  font-size: 14px;
  font-weight: 500;
  border: solid var(--gray-color6);
  border-width: 10px 25px;
  background-color: var(--green-color3);
  color: var(--green-color2);
  text-align: center;
  padding: 20px 20px 20px;
}
page-progress .section-container {
  position: relative;
  flex-grow: 1;
  padding: 0 25px 0 50px;
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
}
page-progress .section {
  margin: 10px;
  box-shadow: var(--box-shadow);
  border-radius: var(--border-radius);
  background-color: var(--white-color);
  position: relative;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 15px;
}
page-progress .section > .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
page-progress .section > .title {
  justify-content: flex-start;
  position: relative;
}
page-progress .section > .title .checkmark {
  position: absolute;
  left: -50px;
  vertical-align: top;
  background: var(--gray-color1);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  --Iconsax-Color: var(--white-color);
}
page-progress .section > .title .checkmark.checked {
  --Iconsax-Color: var(--white-color);
  background-color: var(--green-color1);
  border-color: var(--green-color1);
}
page-progress .section > .title .title-icon {
  font-size: 32px;
  display: flex;
  align-items: center;
  height: 32px;
  margin: 0 8px;
  color: var(--black-color0);
  --Iconsax-Color: var(--gray-color1);
  --Iconsax-Size: 20px;
}
page-progress .section > .title .title-icon.checked {
  --Iconsax-Color: var(--green-color1);
  color: var(--green-color1);
}
page-progress .section .card-title-border {
  margin: 0;
  padding: 0 0 10px 0;
}
page-progress .content {
  text-align: left;
  padding: 15px;
  text-transform: none;
}
page-progress .text {
  margin-bottom: 8px;
}
page-progress .progress-bar {
  height: 5px;
  width: 100%;
  border-radius: var(--border-radius);
  background-color: var(--green-color4);
}
page-progress .progress-bar .inner {
  height: 100%;
  background-image: linear-gradient(to right, var(--green-color2) 0%, var(--green-color1) 100%);
  border-radius: var(--border-radius);
}
page-progress .helper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
page-progress .helper .text {
  margin: 0 20px 0 0;
}
page-progress .helper .image {
  height: 57px;
}
page-progress .content-item {
  border-top: 1px solid var(--gray-color14);
  padding-top: 10px;
  margin: 10px -15px 0;
  display: flex;
  justify-content: space-between;
}
page-progress .content-item:first-child {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}
page-progress .content-item .item-wrapper {
  width: calc(100% - 50px);
}
page-progress .content-item .title {
  color: var(--black-color0);
  margin-bottom: 8px;
}
page-progress .content-item .title.done {
  text-decoration: line-through;
}
page-progress .content-item .inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
page-progress .content-item .inner > div {
  width: calc(100% - 150px);
}
page-progress .checkmark {
  display: flex;
  width: 50px;
  height: 35px;
  align-items: center;
  justify-content: center;
}
page-progress .hide-page {
  margin-left: 15px;
}
page-progress .hide-page .label {
  display: flex;
  flex-direction: column;
  padding-left: 5px;
}
page-progress .hide-page .label-title {
  line-height: 1;
  color: var(--gray-color3);
}
page-progress .hide-page .label-text {
  font-size: 11px;
  color: var(--gray-color28);
  margin-top: 2px;
}
page-progress .top-container, page-progress .section-container {
  max-width: 1400px;
}
page-progress .top-container {
  padding: 0 25px 0 60px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
page-progress .progress-wrapper {
  width: calc(100% - 180px);
  padding-top: 32px;
}
page-progress .progress-wrapper .title {
  font-weight: 500;
  font-size: 16px;
  color: var(--black-color0);
  margin-bottom: 3px;
}
page-progress .progress-wrapper .text {
  margin-bottom: 20px;
}
page-progress .progress-data {
  padding-top: 7px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
page-progress .progress-text, page-progress .progress-amount {
  color: var(--green-color2);
  font-size: 11px;
  font-weight: 500;
}
page-progress .monster {
  padding: 20px 0px 5px 0;
  position: relative;
  z-index: 1;
}
page-progress .monster .content {
  position: absolute;
  top: 10px;
  left: 100px;
  background: var(--white-color);
  border: 2px solid var(--white-color2);
  border-radius: 16px;
  padding: 16px;
  width: 207px;
}
page-progress .monster .content:after {
  content: "";
  background: url(/assets/images/progress-message-aside.png);
  position: absolute;
  top: 53px;
  left: -21px;
  width: 21px;
  height: 24px;
}
page-progress .monster .title {
  font-size: 14px;
  color: var(--black-color0);
  font-weight: 500;
  margin-bottom: 3px;
}
page-progress .monster .text {
  font-size: 12px;
  line-height: 1.1;
  font-weight: 400;
  margin: 0;
}
page-progress .collapse-wrapper {
  font-size: 10px;
  font-weight: 500;
  color: var(--blue-color3);
  display: flex;
  justify-content: center;
  margin-top: -1px;
}
page-progress .collapse-wrapper .inner {
  padding: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
}

/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
/*Colors=====================================================*/
/*default color of links and color of planned text in Planning table*/
/*default color of hovered links*/
/*dropper bg*/
/*color of input's borders*/
/*default font color*/
/*color of text in sub groups in Planning table*/
/*hover bg color of gray buttons*/
/*default color of bg NEW 2021*/
/*$gray-color6: #f4f6f8; /*default color of bg 2020*/
/*color of rows in Planning table and bg of gray buttons*/
/*color of aggregator rows of Report table*/
/*color of switch-check-box bg*/
/*$gray-color9: #f3f4f6; /*hover bg color of top header buttons and popover items /*TODO: use $gray-color4*/
/*color of main headers / page headers*/
/*color of input's text*/
/*alert color*/
/*bg color of alert*/
/*color of green button and nav*/
/*darker green (used in progress bar and green buttons)*/
/*bg of hints*/
/*bg of progress bar in dashboard*/
/*text color*/
/*$green-color5; TODO: color almost the same*/
/*$green-color6; TODO: color almost the same*/
/*Sizes================================================================*/
/*Grid system==========================================================*/
.main-container {
  padding: 0 25px;
}
.main-container .content-panel {
  flex-grow: 1;
  margin: 15px 0;
  box-shadow: 0 0 10px var(--input-shadow-color);
  border-radius: 5px;
  background: var(--white-color);
}

.content-wrapper {
  padding: 20px 30px;
}

.card-container .card-header .card-title {
  margin-top: 13px;
}

.card-title-note {
  margin-top: 5px !important;
}
.card-title-note + .card-note .card-note-text {
  padding-top: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.card-note {
  display: flex;
  font-family: Rubik;
  font-style: italic;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  color: var(--gray-color1);
  width: 100%;
  margin-left: 20px;
}

app-settings-invitations .global-page-loader .loader .image-load {
  width: 70px;
}
app-settings-invitations .card-container {
  margin: 0 0 20px 0;
}
app-settings-invitations .card-container.single {
  min-height: 300px;
}
app-settings-invitations .card-container .card-header {
  height: 45px;
  border-bottom: var(--default-border);
  align-items: center;
}
app-settings-invitations .card-container .card-header .card-title {
  margin-left: 20px;
  width: 100%;
  margin-top: 10px;
}
app-settings-invitations .companies-table-header {
  display: flex;
  align-items: center;
  padding: 10px 15px 10px 20px;
}
app-settings-invitations .companies-table-header .btn-setup-new-company {
  width: 150px;
}
app-settings-invitations .companies-table tbody tr.selected td {
  background: var(--green-color3);
}
app-settings-invitations .companies-table td:first-child {
  width: 50%;
}
app-settings-invitations .companies-table td {
  border-bottom: var(--default-border);
}
app-settings-invitations .companies-table .header {
  background: var(--white-color);
  height: 40px;
  border-bottom: var(--default-border-header);
  font-family: Rubik;
  font-style: normal;
  font-weight: 500;
  font-size: 11px;
  line-height: 13px;
  vertical-align: middle;
}
app-settings-invitations .companies-table th {
  color: var(--black-color0);
  font-size: 13px;
  vertical-align: middle;
}
app-settings-invitations .companies-table td .logo {
  cursor: pointer;
  width: 34px;
  height: 34px;
  margin-right: 17px;
  border-radius: 50%;
  border: 1px solid var(--blue-color20);
  box-sizing: border-box;
}
app-settings-invitations .companies-table td .now-running, app-settings-invitations .companies-table td .archived {
  margin-left: 4px;
}
app-settings-invitations .companies-table td .archived {
  background: var(--gray-color3);
}
app-settings-invitations .companies-table td .edit-area {
  display: flex;
}
app-settings-invitations .companies-table .name {
  display: flex;
  position: relative;
}
app-settings-invitations .companies-table ::ng-deep.icons {
  text-align: unset;
}
app-settings-invitations .global-page-loader {
  display: flex;
  margin: 30px 0 !important;
  justify-content: center;
}
app-settings-invitations .global-page-loader .loader {
  height: 100px;
}
app-settings-invitations .company-archived {
  background-color: var(--green-color3);
  color: var(--green-color2);
  padding: 7px 20px;
}
app-settings-invitations .error {
  background-color: var(--orange-color2);
  color: var(--orange-color1);
  padding: 7px 20px;
}
app-settings-invitations .confirm-delete {
  position: relative;
  top: -20px;
  display: block;
  text-align: left;
}
app-settings-invitations .confirm-delete .text-boxes {
  text-align: left;
}
app-settings-invitations .modal .message b {
  color: var(--black-color0);
}
app-settings-invitations .counts {
  font-size: 11px;
  font-weight: 500;
}
app-settings-invitations .company {
  background-color: var(--white-color);
}
app-settings-invitations .company.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.5;
}
app-settings-invitations .company td {
  vertical-align: top;
}
app-settings-invitations .company .title {
  cursor: pointer;
  color: var(--blue-color6);
}
app-settings-invitations .company.archived td {
  vertical-align: top;
  opacity: 0.5;
}
app-settings-invitations .company.archived td.icons {
  opacity: 1;
}
app-settings-invitations .content-container {
  display: flex;
  margin-top: 15px;
}
app-settings-invitations .uploader {
  padding-left: 20px;
  width: 210px;
}
app-settings-invitations .fields-wrapper {
  flex-grow: 1;
}
app-settings-invitations .fields-wrapper ui-text-box, app-settings-invitations .fields-wrapper ui-dropdown {
  display: block;
}
app-settings-invitations .setup-wrapper {
  padding: 0 7px 0 17px;
}
app-settings-invitations .setup-wrapper .item {
  display: inline-block;
  vertical-align: top;
  width: calc(40% - 28px);
  margin: 0 13px 17px;
}
app-settings-invitations .setup-wrapper .item ui-dropdown {
  background: var(--white-color);
}
app-settings-invitations .setup-wrapper .currency {
  width: 15% !important;
}
app-settings-invitations .buttons-wrapper {
  padding-top: 10px;
}
app-settings-invitations .buttons-wrapper .btn-save {
  margin-left: auto;
  min-width: 120px;
}
app-settings-invitations .buttons-wrapper .btn-cancel {
  margin-right: 10px;
  min-width: 120px;
}
app-settings-invitations .form-label {
  display: inline-block;
  vertical-align: top;
  margin-bottom: 3px;
}
app-settings-invitations .form-label.required:after {
  content: "*";
  color: var(--orange-color1);
  display: inline;
  margin-left: 3px;
}
app-settings-invitations .error-summary {
  background: var(--orange-color2);
  padding: 5px;
}
app-settings-invitations .error-message {
  color: var(--orange-color1);
}
app-settings-invitations .wrapper-tooltip:hover .tooltip {
  display: inline-flex;
}
app-settings-invitations .wrapper-tooltip {
  display: inline-flex;
  position: relative;
}
app-settings-invitations .tooltip {
  top: 28px;
  right: -13px;
  font-size: 12px;
}
app-settings-invitations .tooltip:after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: 5px;
}
app-settings-invitations .loader-for-row-height {
  position: absolute;
  top: 50%;
}

page-payables {
  display: flex;
  flex-direction: column;
  position: relative;
}
page-payables .no-permissions {
  padding: 0 25px;
}
page-payables .tabs-container [nav] .navigation-wrapper {
  display: flex;
  width: 100%;
  max-width: 1380px;
}
page-payables .tabs-container [nav] .navigation-wrapper .comment-in-nav {
  margin-left: auto;
  margin-right: 25px;
}
page-payables .tabs-container [nav] .nav-item.active .icon-rule {
  cursor: default !important;
}
page-payables .tabs-container [nav] .nav-item.active .icon-rule:before {
  cursor: default !important;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_black.svg);
}
page-payables .tabs-container [nav] .nav-item:not(.active):hover .icon-rule:before {
  width: 20px;
  height: 20px;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_blue.svg);
}
page-payables .tabs-container [nav] .nav-item.disabled {
  cursor: default;
}
page-payables .tabs-container [nav] .nav-item.disabled .text {
  opacity: 0.5;
}
page-payables .tabs-container [nav] .nav-item .icon-rule {
  align-items: center;
  display: flex;
  text-align: center;
  margin-left: 10px;
}
page-payables .tabs-container [nav] .nav-item .icon-rule:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 20px;
  cursor: pointer;
  background-image: url(/assets/images/icons_new_design/ico_add_rule_gray.svg);
  background-repeat: no-repeat;
  background-position: 0 50%;
  margin: auto;
}
page-payables .tabs-container [nav] .nav-item .tooltiptext {
  visibility: hidden;
  width: 120px;
  background: var(--blue-color18);
  color: var(--white-color);
  text-align: center;
  border-radius: var(--border-radius);
  padding: 5px 0;
  top: 100%;
  left: 50%;
  margin-left: -60px;
  /* Position the tooltip */
  position: absolute;
  z-index: 100;
}
page-payables .tabs-container [nav] .nav-item:hover .tooltiptext {
  visibility: visible;
}
page-payables .loader-sync {
  width: auto;
  padding-left: 40px;
  line-height: 30px;
}

html {
  --transition1: linear .2s;
  --border-radius: 5px;
  --border-radius20: 20px;
  /* Sizes */
  --header-height: 45px;
  --footer-height: 68px;
  --gap-under-card: 8px;
  /* Grid system */
  --notebook-height: 800px;
  /* Grid breakpoints */
  --grid-xs: 0; /* Extra small screen / phone */
  --grid-sm: 576px; /* Small screen / phone */
  --grid-md: 768px; /* Medium screen / tablet */
  --grid-lg: 992px; /* Large screen / desktop */
  --grid-xl: 1200px; /* Extra large screen / wide desktop */
  /* Widget card */
  --widget-padding: 15px;
}

.theme-light,
page-sign-in,
page-sign-up,
page-restoring,
page-resent-password {
  --blue-color3: #34a5da; /* default color of links and color of planned text in Planning table */
  --blue-color4: #1581b3; /* default color of hovered links */
  --blue-color5: #e2f6ff; /* dropper bg */
  --blue-color6: #2D9CDB;
  --blue-color7: #8BCBEF;
  --blue-color8: #1a698e;
  --blue-color9: rgba(45,156,219,1);
  --blue-color10: rgba(44,60,76,1);
  --blue-color11: #283543;
  --blue-color12: rgba(44, 60, 76);
  --blue-color13: #3F51B5;
  --blue-color14: #55A4D1;
  --blue-color15: #A6DFFF;
  --blue-color16: #090B2B;
  --blue-color17: #292D32;
  --blue-color18: rgba(44, 60, 76, 0.8);
  --blue-color19: #B1F1FF;
  --blue-color20: #B7C5D4;
  --blue-color21: #1a6f99;
  --blue-color22: #237bad;
  --blue-color23: #2990c9;
  --blue-color24: #2c3d4e;
  --blue-color-switch: #D4DADF;
  --blue-color6-05: rgba(45, 156, 219, 0.05);
  --blue-color6-1: rgba(45, 156, 219, 0.1);
  --blue-color6-25: rgba(45, 156, 219, 0.25);
  --banner-blue-background:
      linear-gradient(180deg, var(--blue-color6-05) 0%, var(--blue-color6-1) 100%),
      url("/assets/images/background/blue-particle-effect.svg"),
      #FFFFFF;
  --banner-blue-box-shadow: 0 0 80px 20px var(--blue-color6-25), 0 0 80px 5px var(--blue-color6);
  --gray-color1: #667C93; /* color of input's borders */
  --gray-color2: #696868; /* default font color */
  --gray-color3: #666; /* color of text in sub groups in Planning table */
  --gray-color4: #ebeef3;
  --gray-color5: #2c3c4c;
  --gray-color6: #E9EFF3; /* default color of bg NEW 2021 */
  --gray-color7: #f9fafb; /* color of rows in Planning table and bg of gray buttons */
  --gray-color8: #ededed; /* color of aggregator rows of Report table */
  --gray-color9: #c2c7cc; /* color of switch-check-box bg */
  --gray-color10: #4F4F4F;
  --gray-color11: #8C91AA;
  --gray-color12: #828282;
  --gray-color13: #E6EFF6;
  --gray-color14: #CBD9E3;
  --gray-color15: #95A7BA;
  --gray-color16: #CCC;
  --gray-color17: #aab1b7;
  --gray-color18: #e1e1e1;
  --gray-color19: #b3b2b2;
  --gray-color20: #666666;
  --gray-color21: #b8bec6;
  --gray-color22: #908F8F;
  --gray-color23: #858585;
  --gray-color24: rgba(203, 217, 227, 0.3);
  --gray-color25: #728597;
  --gray-color26: #a0a0a0;
  --gray-color27: #808080;
  --gray-color28: #b3b3b3;
  --gray-color29: rgba(239, 239, 239, 0.3);
  --gray-color30: rgba(59, 59, 59, 0.3);
  --gray-color31: #616a7d;
  --gray-color32: rgba(44, 60, 76, 0.4);
  --gray-color33: #bfd2e4;
  --gray-color34: #d7dee4;
  --gray-color35: #f9fafb;
  --gray-color36: #667C93;
  --gray-color37: #F9FCFF;
  --gray-button-hover: #ebeef3; /* hover bg color of gray buttons */
  --draft-badge-background: var(--gray-color13); /* draft badge background color */
  --selector-checkbox-background: #d4dadf;
  --actuals-chart-line-color: #2b3c4e;
  --gray-input-search: #E6EFF6;
  --gray-input-border: #E6EFF6;
  --menu-state-button-border: #CBD9E3;
  --gray-comment-feed-active: #E6EFF6;
  --blue-tooltip-text: #2c3c4c;
  --black-color0: #000000; /* color of main headers / page headers */
  --black-color1: #333; /* color of input's text */
  --black-color2: rgba(44,60,76,0.3);
  --black-color3: #333333;
  --black-color4: rgba(0, 0, 0, 0.04);
  --black-color5: rgba(0, 0, 0, 0.075);
  --black-color6: rgba(51, 51, 51, .3);
  --black-color7: rgba(0, 0, 0, 0.25);
  --black-color8: rgba(0, 0, 0, 0.2);
  --black-overlay-color: #333;
  --black-color-transparent: rgba(0, 0, 0, 0);
  --overlay-transparent: rgba(51, 51, 51, 0);
  --overlay-display: rgba(51, 51, 51, 0.7);
  --overlay-loader: rgba(255, 255, 255, 0.7);
  --sorting-arrow-color: #000;
  --button-text-color: #FFFFFF;
  --button-dropdown-arrow: #667C93;
  --button-text-no-bg-color: #000000;
  --dropdown-hower-background: #E9EFF3;
  --new-version-label-text: #2c3c4c;
  --orange-color1: #f75b36; /* alert color */
  --orange-color2: #fff6e4; /* bg color of alert */
  --orange-color3: #F65B36;
  --orange-color4: #FF9600;
  --orange-color5: #FFE9DC;
  --orange-color6: #f54a22;
  --orange-color7: rgba(247, 91, 54, 0.6);
  --orange-color8: #F9D7A7;
  --orange-color9: #FFC0B1;
  --orange-color10: rgba(247, 91, 54, 0.1);
  --orange-color11: #FFA500;
  --orange-color12: #e39402;
  --orange-color13: #fad0bf;
  --orange-color14: rgba(240, 155, 56, 0.1);
  --orange-color15: rgba(240, 155, 56, 0.4);
  --orange-color16: rgba(230, 101, 68, 0.8);
  --orange-color17: #FFFCE0;
  --orange-color1-10: rgba(247, 91, 54, 0.1);
  --orange-color1-30: rgba(247, 91, 54, 0.3);
  --orange-color-plug: #FFE9DC;
  --orange-color-plug2: rgba(247, 91, 54, 0.1);
  --yellow-plug-icon-color: #FF9600;
  --yellow-plug-font-color: #2C3C4C;
  --yellow-plug-background: rgba(255, 150, 0, 0.1);
  --orange-color1-05: rgba(247, 91, 54, 0.05);
  --orange-color1-1: rgba(247, 91, 54, 0.1);
  --orange-color1-25: rgba(247, 91, 54, 0.25);
  --orange-color4-05: rgba(255, 150, 0, 0.05);
  --orange-color4-1: rgba(255, 150, 0, 0.1);
  --orange-color4-25: rgba(255, 150, 0, 0.25);
  --banner-red-background:
      linear-gradient(180deg, var(--orange-color1-05) 0%, var(--orange-color1-1) 100%),
      url("/assets/images/background/red-particle-effect.svg"),
      #FFFFFF;
  --banner-red-box-shadow: 0 0 80px 20px var(--orange-color1-25), 0 0 80px 5px var(--orange-color1);
  --banner-orange-background:
      linear-gradient(180deg, var(--orange-color4-05) 0%, var(--orange-color4-1) 100%),
      url("/assets/images/background/orange-particle-effect.svg"),
      #FFFFFF;
  --banner-orange-box-shadow: 0 0 80px 20px var(--orange-color4-25), 0 0 80px 5px var(--orange-color4);
  --light-yellow-color1: #FFFDF0;
  --button-red-background: #FFE9DC;
  --button-red-background-hover: #fad0bf;
  --dark-red-background: rgba(247, 93, 57, 0.3);
  --dark-red-color: #A32305;
  --green-color1: #84c612; /* color of green button and nav */
  --green-color2: #278a13; /* darker green (used in progress bar and green buttons) */
  --green-color3: #f8ffec; /* bg of hints */
  --green-color4: #dfeec5; /* bg of progress bar in dashboard */
  --green-color5: #999999; /* text color */
  --green-color6: #EFFFD4;
  --green-color7: rgba(174, 213, 129, 0.3);
  --green-color8: #5DBC00;
  --green-color9: rgba(132, 198, 18, 0.6);
  --green-color10: rgba(130, 200, 0, 0.7);
  --green-color11: rgba(130, 200, 0, 1);
  --green-color12: #CEEC9A;
  --green-color13: #8CD27D;
  --green-color14: rgba(130, 200, 0, 0.1);
  --green-color15: rgba(130, 200, 0, 0.4);
  --green-color16: rgba(32, 139, 0, 0.8);
  --green-color17: rgba(186, 208, 208, 0.7);
  --green-color18: rgba(130, 200, 0, .7);
  --green-color19: rgba(130, 200, 0, 1);
  --green-color20: #6AA701;
  --green-color21: rgba(96, 148, 0, 1);
  --green-color22: #1e6e0f;
  --green-color23: rgba(105, 160, 0, 1);
  --green-color24: #eff7e6;
  --green-color25: #F8FCF5;
  --green-color1-10: rgba(132, 198, 18, 0.1);
  --green-color1-30: rgba(132, 198, 18, 0.3);
  --green-color-plug: #EFFFD4;
  --green-allocate: #f8ffec;
  --banner-green-background: linear-gradient(270deg, var(--green-color1) 15.75%, var(--green-color2) 100.61%);
  --white-color: #FFF;
  --white-color1: #eff7e6;
  --white-color2: #dfdfdf;
  --white-color3: #f4f4f4;
  --white-color4: rgba(255, 255, 255, 0.6);
  --white-color5: rgba(255, 255, 255, 0.8);
  --white-color6: #f9f9f9;
  --white-color7: #e6e6e6;
  --white-color8: #F1F4F7;
  --white-color9: #FFF0D4;
  --white-color10: #cacaca;
  --white-color11: #fefefe;
  --white-color12: rgb(236, 239, 242);
  --white-color13: #e5ecf1;
  --white-color14: #ebebeb;
  --white-color15: #FFF0D4;
  --white-color16: #e6e6e6;
  --tooltip-color: #FFF;
  --tooltip-border-color: #CBD9E3;
  --tooltip-hover-item: #E6EFF6;
  --white-input-background: #FFF;
  --icon-white: #FFF;
  --white-spinner: rgba(255, 255, 255, 0.7);
  --input-shadow-color: rgba(190, 207, 224, 0.7);
  --purple-color: #6E51F1;
  --purple-color1: #FF4081;
  --orange-color: #ff9600;
  --orange-light-color: var(--white-color)CE0;
  --red-color: #ff0000;
  --tooltip-background: rgba(44, 60, 76, 0.9);
  --tooltip-background-darken: rgba(20, 28, 35, 0.9);
  --default-font: "Rubik", sans-serif;
  --default-font-size: 13px;
  --default-font-color: var(--gray-color2);
  --default-line-height-computed: 17px;
  --link-color: var(--blue-color3);
  --link-color-hover: var(--blue-color4);
  --link-color-active: #000;
  --notification-color: var(--orange-color1);
  --menu-bg-color: var(--white-color);
  --menu-link-color: var(--gray-color5);
  --menu-classic-link-color: #F0F1F5;
  --menu-link-border-color: var(--green-color1);
  --menu-link-icon-active-color: var(--green-color1);
  --btn-gray-color: var(--gray-color2);
  --btn-gray-border-color: var(--gray-color1);
  --btn-gray-border-hover-color: var(--gray-color1);
  --btn-gray-bg: var(--gray-color7);
  --btn-gray-hover-bg: var(--gray-color4);
  --btn-green-color: #FFFFFF;
  --btn-green-border-color: var(--green-color2);
  --btn-green-border-hover-color: var(--green-color2);
  --btn-green-bg: var(--green-color1);
  --btn-green-hover-bg: var(--green-color2);
  --btn-blue-color: var(--blue-color6);
  --ultra-light-blue1: #F8FCFF;
  --ultra-light-blue2: #DCF4FF;
  --ultra-light-blue3: #EFFDFF;
  --ultra-light-blue-plug: #DCF4FF;
  --ultra-light-blue-plug-color: #2C3C4C;
  --button-blue-background: #DCF4FF;
  --button-blue-date-range: #DCF4FF;
  --button-period-picker: #DCF4FF;
  --background-budget-suggestion: #E9EFF3;
  --budget-chart-background: #E9EFF3;
  --budget-left-panel-background: #E9EFF3;
  --budget-chart-color: #2c3d4e;
  --budget-chart-dots: #b7c5d433;
  --default-input-color: var(--black-color1);
  --default-input-placeholder-color: #BAC7D5;
  --default-input-border-color: var(--gray-color1);
  --default-input-border: 1px solid var(--default-input-border-color);
  --default-input-hover-border-color: var(--blue-color3);
  --default-border-color: var(--gray-color14);
  --default-border: 1px solid var(--default-border-color);
  --default-border-header: 2px solid var(--default-border-color);
  --input-categories-color: #171F24;
  --input-color-name: #B6B8BA;
  --input-color-placeholder: #bcc9d7;
  --input-color-raised: #777777;
  --shadow-color1: rgba(190, 207, 224, .70);
  --shadow-color2: rgba(0, 0, 0, .3);
  --shadow-color3: rgba(0, 0, 0, .3);
  --box-shadow: 0 0 10px var(--shadow-color1);
  --chart-label-color: #2c3d4e;
  --chart-label-border: #FFFFFF;
  --chart-axis: #667C93;
  --chart-horizontal-grid: #ebebeb;
  --chart-green-bar-color: #dcefc0;
  --chart-red-bar-color: #ffd2c7;
  --chart-green-main-color: #84c612;
  --chart-red-main-color: #ff6036;
  --chart-table-vertical-line: #2c3c4c;
  --blue-color-scroll: #2D9CDB;
  --panel-widget-bg: #F8FCFF;
  --group-column-chart-color1: #094A70;
  --group-column-chart-color2: #095784;
  --group-column-chart-color3: #0A6EA8;
  --group-column-chart-color4: #178CC9;
  --group-column-chart-color5: #55A4D1;
  --group-column-chart-color6: #4FB8E6;
  --group-column-chart-color7: #95A7BA;
  --chart-blue-color: #A6DFFF;
  --chart-light-red-color: rgba(247, 91, 54, 0.2);
  --chart-light-green-color: rgba(132, 198, 18, 0.2);
  --chart-light-blue-color: rgba(166, 223, 255, 0.2);
  --notify-background: #2B3446;
  --notify-color: #FFFFFF;
  --login-logo: url(/assets/images/logos/login-logo.png);
}

.theme-dark {
  --blue-color3: #34a5da; /* default color of links and color of planned text in Planning table */
  --blue-color4: #1581b3; /* default color of hovered links */
  --blue-color5: #e2f6ff; /* dropper bg */
  --blue-color6: #2D9CDB;
  --blue-color7: #8BCBEF;
  --blue-color8: #1a698e;
  --blue-color9: rgba(45,156,219,1);
  --blue-color10: rgba(44,60,76,1);
  --blue-color11: #283543;
  --blue-color12: rgba(44, 60, 76);
  --blue-color13: #3F51B5;
  --blue-color14: #55A4D1;
  --blue-color15: #A6DFFF;
  --blue-color16: #B7C5D4;
  --blue-color17: #292D32;
  --blue-color18: rgba(44, 60, 76, 0.8);
  --blue-color19: #B1F1FF;
  --blue-color20: #B7C5D4;
  --blue-color21: #1a6f99;
  --blue-color22: #237bad;
  --blue-color23: #2990c9;
  --blue-color24: #FFFFFF;
  --blue-color-switch: #C8CDE6;
  --blue-color6-05: rgba(45, 156, 219, 0.05);
  --blue-color6-1: rgba(45, 156, 219, 0.1);
  --blue-color6-25: rgba(45, 156, 219, 0.25);
  --banner-blue-background:
      linear-gradient(180deg, rgba(33, 35, 48, 0.2) 0%, var(--blue-color6-05) 100%),
      url("/assets/images/background/blue-particle-effect.svg"),
      #212330;
  --banner-blue-box-shadow: 0 0 80px 20px rgba(33, 35, 48), 0 0 80px 5px var(--blue-color6);
  --gray-color1: #C8CDE6; /* color of input's borders */
  --gray-color2: #696868; /* default font color */
  --gray-color3: #cecece; /* color of text in sub groups in Planning table */
  --gray-color4: #ebeef3;
  --gray-color5: #F0F1F5;
  --gray-color6: #E9EFF3; /* default color of bg NEW 2021 */
  --gray-color7: #262b37; /* color of rows in Planning table and bg of gray buttons */
  --gray-color8: #ededed; /* color of aggregator rows of Report table */
  --gray-color9: #c2c7cc; /* color of switch-check-box bg */
  --gray-color10: #e8e8e8;
  --gray-color11: #e8e8e8;
  --gray-color12: #828282;
  --gray-color13: #2A2D3D;
  --gray-color14: #292F3F;
  --gray-color15: #95A7BA;
  --gray-color16: #CCC;
  --gray-color17: #aab1b7;
  --gray-color18: #e1e1e1;
  --gray-color19: #b3b2b2;
  --gray-color20: #666666;
  --gray-color21: #b8bec6;
  --gray-color22: #908F8F;
  --gray-color23: #858585;
  --gray-color24: #2a2d3d;
  --gray-color25: #728597;
  --gray-color26: #262b37;
  --gray-color27: #808080;
  --gray-color28: #b3b3b3;
  --gray-color29: rgba(239, 239, 239, 0.3);
  --gray-color30: rgba(59, 59, 59, 0.3);
  --gray-color31: #616a7d;
  --gray-color32: rgba(44, 60, 76, 0.4);
  --gray-color33: #bfd2e4;
  --gray-color34: #3b3c45;
  --gray-color35: #616a7d;
  --gray-color36: #374554;
  --gray-color37: #F9FCFF;
  --gray-button-hover: #171923;
  --draft-badge-background: #47576E; /* draft badge background color in dark theme */
  --selector-checkbox-background: #C8CDE6;
  --actuals-chart-line-color: #FFFFFF;
  --menu-state-button-border: #C8CDE6;
  --gray-input-search: #2A2D3D;
  --gray-input-border: #434557;
  --gray-comment-feed-active: #2A2D3D;
  --blue-tooltip-text: #2c3c4c;
  --black-color0: #F0F1F5; /* color of main headers / page headers */
  --black-color1: #E6EFF6; /* color of input's text */
  --black-color2: rgba(44,60,76,0.3);
  --black-color3: #e1e1e1;
  --black-color4: rgba(0, 0, 0, 0.04);
  --black-color5: rgba(0, 0, 0, 0.075);
  --black-color6: rgba(51, 51, 51, .3);
  --black-color7: rgba(0, 0, 0, 0.25);
  --black-color8: rgba(0, 0, 0, 0.2);
  --black-overlay-color: #333;
  --black-color-transparent: rgba(0, 0, 0, 0);
  --overlay-transparent: rgba(51, 51, 51, 0);
  --overlay-display: rgba(51, 51, 51, 0.7);
  --overlay-loader: rgba(33, 35, 48, 0.7);
  --sorting-arrow-color: #434557;
  --button-text-color: #FFFFFF;
  --button-dropdown-arrow: #FFFFFF;
  --button-text-no-bg-color: #F0F1F5;
  --dropdown-hower-background: #171923;
  --new-version-label-text: #2c3c4c;
  --orange-color1: #f75b36; /* alert color */
  --orange-color2: #fff6e4; /* bg color of alert */
  --orange-color3: #F65B36;
  --orange-color4: #FF9600;
  --orange-color5: #FFE9DC;
  --orange-color6: #f54a22;
  --orange-color7: rgba(247, 91, 54, 0.6);
  --orange-color8: #F9D7A7;
  --orange-color9: #FFC0B1;
  --orange-color10: rgba(247, 91, 54, 0.1);
  --orange-color11: #FFA500;
  --orange-color12: #e39402;
  --orange-color13: #fad0bf;
  --orange-color14: rgba(240, 155, 56, 0.1);
  --orange-color15: rgba(240, 155, 56, 0.4);
  --orange-color16: rgba(230, 101, 68, 0.8);
  --orange-color17: #FFFCE0;
  --orange-color1-10: rgba(247, 91, 54, 0.1);
  --orange-color1-30: rgba(247, 91, 54, 0.3);
  --orange-color-plug: #FFE9DC30;
  --orange-color-plug2: rgba(247, 91, 54, 0.1);
  --yellow-plug-icon-color: rgba(255, 150, 0, 1);
  --yellow-plug-font-color: #F0F1F5;
  --yellow-plug-background: rgba(255, 150, 0, 0.1);
  --orange-color1-05: rgba(247, 91, 54, 0.05);
  --orange-color1-1: rgba(247, 91, 54, 0.1);
  --orange-color1-25: rgba(247, 91, 54, 0.25);
  --orange-color4-05: rgba(255, 150, 0, 0.05);
  --orange-color4-1: rgba(255, 150, 0, 0.1);
  --orange-color4-25: rgba(255, 150, 0, 0.25);
  --banner-red-background:
      linear-gradient(180deg, rgba(33, 35, 48, 0.2) 0%, var(--orange-color1-05) 100%),
      url("/assets/images/background/red-particle-effect.svg"),
      #212330;
  --banner-red-box-shadow: 0 0 80px 20px rgba(33, 35, 48), 0 0 80px 5px var(--orange-color1);
  --banner-orange-background:
      linear-gradient(180deg, rgba(33, 35, 48, 0.2) 0%, var(--orange-color4-05) 100%),
      url("/assets/images/background/orange-particle-effect.svg"),
      #212330;
  --banner-orange-box-shadow: 0 0 80px 20px rgba(33, 35, 48), 0 0 80px 5px var(--orange-color4);
  --light-yellow-color1: #FFFDF0;
  --button-red-background: #212330;
  --button-red-background-hover: #362931;
  --dark-red-color: rgba(220, 42, 0, 1);
  --dark-red-background: rgba(220, 42, 0, 0.1);
  --green-color1: #84c612; /* color of green button and nav */
  --green-color2: #278a13; /* darker green (used in progress bar and green buttons) */
  --green-color3: #f8ffec; /* bg of hints */
  --green-color4: #dfeec5; /* bg of progress bar in dashboard */
  --green-color5: #999999; /* text color */
  --green-color6: #848d7d;
  --green-color7: rgba(174, 213, 129, 0.3);
  --green-color8: #5DBC00;
  --green-color9: rgba(132, 198, 18, 0.6);
  --green-color10: rgba(130, 200, 0, 0.7);
  --green-color11: rgba(130, 200, 0, 1);
  --green-color12: #CEEC9A;
  --green-color13: #8CD27D;
  --green-color14: rgba(130, 200, 0, 0.1);
  --green-color15: rgba(130, 200, 0, 0.4);
  --green-color16: rgba(32, 139, 0, 0.8);
  --green-color17: rgba(186, 208, 208, 0.7);
  --green-color18: rgba(130, 200, 0, .7);
  --green-color19: rgba(130, 200, 0, 1);
  --green-color20: #6AA701;
  --green-color21: rgba(96, 148, 0, 1);
  --green-color22: #1e6e0f;
  --green-color23: rgba(105, 160, 0, 1);
  --green-color24: rgba(174, 213, 129, 0.3);
  --green-color25: #F8FCF5;
  --green-color1-10: rgba(132, 198, 18, 0.1);
  --green-color1-30: rgba(132, 198, 18, 0.3);
  --green-allocate: #212228;
  --banner-green-background: linear-gradient(270deg, rgba(132, 198, 18, 0.8) 15.75%, rgba(39, 138, 19, 0.8) 100%);
  --white-color: #212330;
  --white-color1: #171923;
  --white-color2: #dfdfdf;
  --white-color3: #f4f4f4;
  --white-color4: rgba(255, 255, 255, 0.6);
  --white-color5: rgba(42, 45, 61, 0.8);
  --white-color6: #f9f9f9;
  --white-color7: #e6e6e6;
  --white-color8: #2A2D3D;
  --white-color9: #FF96000D;
  --white-color10: #cacaca;
  --white-color11: #fefefe;
  --white-color12: #616a7d;
  --white-color13: #e5ecf1;
  --white-color14: #616a7d;
  --white-color15: #ff9600;
  --white-color16: #3e4156;
  --tooltip-color: #FFF;
  --tooltip-border-color: #434557;
  --tooltip-hover-item: #171923;
  --white-input-background: #2A2D3D;
  --icon-white: #FFF;
  --white-spinner: rgba(255, 255, 255, 0.7);
  --input-shadow-color: rgba(0, 0, 0, .25);
  --purple-color: #6E51F1;
  --purple-color1: #FF4081;
  --orange-color: #ff9600;
  --orange-light-color: var(--white-color)CE0;
  --red-color: #ff0000;
  --tooltip-background: rgba(44, 60, 76, 0.9);
  --tooltip-background-darken: rgba(20, 28, 35, 0.9);
  --default-font: "Rubik", sans-serif;
  --default-font-size: 13px;
  --default-font-color: var(--gray-color2);
  --default-line-height-computed: 17px;
  --link-color: var(--blue-color3);
  --link-color-hover: var(--blue-color4);
  --link-color-active: #FFF;
  --notification-color: var(--orange-color1);
  --menu-bg-color: var(--white-color);
  --menu-link-color: var(--gray-color5);
  --menu-classic-link-color: #F0F1F5;
  --menu-link-border-color: var(--green-color1);
  --menu-link-icon-active-color: var(--green-color1);
  --btn-gray-color: var(--gray-color2);
  --btn-gray-border-color: var(--gray-color1);
  --btn-gray-border-hover-color: var(--gray-color1);
  --btn-gray-bg: var(--gray-color7);
  --btn-gray-hover-bg: var(--gray-color4);
  --btn-green-color: #FFFFFF;
  --btn-green-border-color: var(--green-color2);
  --btn-green-border-hover-color: var(--green-color2);
  --btn-green-bg: var(--green-color1);
  --btn-green-hover-bg: var(--green-color2);
  --btn-blue-color: var(--blue-color6);
  --ultra-light-blue1: #171923;
  --ultra-light-blue2: #DCF4FF;
  --ultra-light-blue3: #2B3446;
  --ultra-light-blue-plug: #47576E;
  --ultra-light-blue-plug-color: #C8CDE6;
  --button-blue-background: #2A2D3D;
  --button-blue-date-range: #171923;
  --button-period-picker: #171923;
  --background-budget-suggestion: #171923;
  --budget-chart-background: #171923;
  --budget-left-panel-background: #171923;
  --budget-chart-color: #fefefe;
  --budget-chart-dots: #DCF4FF;
  --default-input-color: var(--black-color1);
  --default-input-placeholder-color: #BAC7D5;
  --default-input-border-color: var(--gray-color1);
  --default-input-border: 1px solid var(--default-input-border-color);
  --default-input-hover-border-color: var(--blue-color3);
  --default-border-color: var(--gray-color14);
  --default-border: 1px solid var(--default-border-color);
  --default-border-header: 2px solid var(--default-border-color);
  --input-categories-color: #B6B8BA;
  --input-color-name: #B6B8BA;
  --input-color-placeholder: #bcc9d7;
  --input-color-raised: #777777;
  --shadow-color1: rgba(0, 0, 0, .25);
  --shadow-color2: rgba(0, 0, 0, .3);
  --shadow-color3: rgba(0, 0, 0, .3);
  --box-shadow: 0 0 10px var(--shadow-color1);
  --chart-label-color: #FFFFFF;
  --chart-label-border: #FFFFFF00;
  --chart-axis: #C8CDE6;
  --chart-horizontal-grid: #2C2F41;
  --chart-green-bar-color: #415a27;
  --chart-red-bar-color: #6d3732;
  --chart-green-main-color: #84c612;
  --chart-red-main-color: #ff6036;
  --chart-table-vertical-line: #FFFFFF;
  --blue-color-scroll: #1a698e;
  --panel-widget-bg: #2A2D3D;
  --group-column-chart-color1: #002B44;
  --group-column-chart-color2: #004477;
  --group-column-chart-color3: #005999;
  --group-column-chart-color4: #006BB8;
  --group-column-chart-color5: #0085DB;
  --group-column-chart-color6: #0898EF;
  --group-column-chart-color7: #95A7BA;
  --chart-blue-color: #0085DB;
  --chart-light-red-color: rgba(247, 91, 54, 0.2);
  --chart-light-green-color: rgba(132, 198, 18, 0.2);
  --chart-light-blue-color: rgba(0, 133, 219, 0.2);
  --notify-background: #F8FCFF;
  --notify-color: #2C3C4C;
  --login-logo: url(/assets/images/logos-white/login-logo.png);
}
.theme-dark .finapi-logo {
  background: url(/assets/images/banks-white/finapi-logo.png) no-repeat center center/contain !important;
}
.theme-dark .banksapi-logo {
  background: url(/assets/images/banks-white/banksapi-logo.png) no-repeat center center/contain !important;
}
.theme-dark .ebics-logo {
  background: url(/assets/images/banks-white/ebics_logo.svg) no-repeat center center/contain !important;
}

/* Change the white to any color */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px var(--white-input-background) inset !important;
}

/*Change text in autofill textbox*/
input:-webkit-autofill {
  -webkit-text-fill-color: var(--menu-link-color) !important;
}

.ng2-pdf-viewer-container {
  overflow-x: hidden;
}
.ng2-pdf-viewer-container {
  overflow-y: auto; /* Ensure vertical scrollbar appears when needed */
}
@-moz-document url-prefix() {
  .ng2-pdf-viewer-container { /* For Firefox */
    scrollbar-width: thin;
  }
}
.ng2-pdf-viewer-container::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.ng2-pdf-viewer-container::-webkit-scrollbar-track {
  border-radius: 8px;
  background-color: var(--gray-color13);
}
.ng2-pdf-viewer-container::-webkit-scrollbar-thumb {
  background-color: var(--blue-color-scroll);
  border-radius: var(--border-radius);
}

highcharts-chart .highcharts-legend .highcharts-legend-item text {
  color: var(--gray-color5) !important;
  fill: var(--gray-color5) !important;
}
highcharts-chart .highcharts-legend .highcharts-legend-item text:hover {
  opacity: 0.7 !important;
}
highcharts-chart .highcharts-legend .highcharts-legend-item.highcharts-legend-item-hidden text {
  color: rgb(102, 102, 102) !important;
  fill: rgb(102, 102, 102) !important;
}
highcharts-chart .highcharts-legend .highcharts-legend-item.highcharts-legend-item-hidden text:hover {
  opacity: 0.7 !important;
}

.hc-tooltip-commitly .hc-tooltip-inner {
  font-size: 12px;
  padding: 2px 4px;
}
.hc-tooltip-commitly .hc-tooltip-title {
  font-weight: 700;
  margin-bottom: 6px;
}
.hc-tooltip-commitly .hc-tooltip-total {
  font-weight: 700;
}
.hc-tooltip-commitly .hc-tooltip-total b {
  font-size: 14px;
}
.hc-tooltip-commitly .hc-tooltip-break {
  height: 1px;
  background: var(--tooltip-border-color);
  margin: 6px 0;
}
.hc-tooltip-commitly .hc-tooltip-line {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}
.hc-tooltip-commitly .hc-dot {
  width: 8px;
  height: 8px;
  border-radius: 99px;
}
.hc-tooltip-commitly b {
  font-weight: normal;
}
.hc-tooltip-commitly b .hc-val-int, .hc-tooltip-commitly b .hc-val-currency {
  font-weight: 700;
}
.hc-tooltip-commitly b .hc-val-decimal, .hc-tooltip-commitly b .hc-val-suffix {
  font-weight: 400;
}

cash-flow-bar-chart .highcharts-legend .highcharts-legend-item:not(.highcharts-legend-item-hidden):nth-child(1) rect {
  fill: #84c612 !important;
}
cash-flow-bar-chart .highcharts-legend .highcharts-legend-item:not(.highcharts-legend-item-hidden):nth-child(2) rect {
  fill: #ff6036 !important;
}

wg-group-outlook-table .company-title ui-loader .loader {
  height: 19px !important;
}

app-expected-dialog-offline app-input-date-select {
  width: 100% !important;
}

bulk-map app-input-date-select {
  max-width: 110px !important;
  margin-right: 15px;
}

app-bank-cards-transactions .bank-cards-transactions__filter__icon svg path {
  stroke: var(--blue-color6) !important;
}
app-bank-cards-transactions .checkbox svg {
  max-width: 100%;
}
app-bank-cards-transactions .checkbox svg path {
  stroke: var(--btn-green-color) !important;
}

.transaction-details-dialog__invoice__dropzone span svg {
  width: 24px;
  height: 24px;
}
.transaction-details-dialog__invoice__dropzone span svg path {
  fill: var(--gray-color15) !important;
}

comments-activities {
  position: relative;
  display: block;
  background: var(--ultra-light-blue1);
}

.category-item__row--archived .category-item__actions-icons .iconsax {
  opacity: 0.5 !important;
}

.iconsax.iconColor-gray {
  --Iconsax-Color: var(--gray-color1);
}
.iconsax.iconColor-blue {
  --Iconsax-Color: var(--blue-color6);
}

.hiddenCanvasElement {
  position: fixed;
  top: -10000px;
  left: -10000px;
}

.grecaptcha-badge {
  opacity: 0;
  visibility: hidden;
}

body.show-recaptcha .grecaptcha-badge {
  opacity: 1 !important;
  visibility: visible !important;
}

.popup-sidebar__close i.iconsax.iconColor-white {
  --Iconsax-Color: #FFFFFF !important;
}

app-company-onboarding .company-onboarding__title span {
  background-image: linear-gradient(to right, var(--green-color2), var(--green-color1));
  color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}

app-company-onboarding-cards .company-onboarding__card__description__title span svg,
app-company-onboarding-cards .company-onboarding__card__status span svg {
  max-width: 100%;
  max-height: 100%;
}
app-company-onboarding-cards .company-onboarding__card__description__item span {
  font-weight: 500;
}

page-sign-up .new-success-summary .new-success-summary__subtitle span, page-sign-up .new-success-summary .new-success-summary__text span {
  font-weight: 700;
}
/*!******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[2]!./node_modules/ngx-toastr/toastr.css?ngGlobalStyle ***!
  \******************************************************************************************************************************************************************************************************************************************/
/* based on angular-toastr css https://github.com/Foxandxss/angular-toastr/blob/cb508fe6801d6b288d3afc525bb40fee1b101650/dist/angular-toastr.css */

/* position */
.toast-center-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.toast-top-center {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-left {
  top: 12px;
  left: 12px;
}
.toast-top-right {
  top: 12px;
  right: 12px;
}
.toast-bottom-right {
  right: 12px;
  bottom: 12px;
}
.toast-bottom-left {
  bottom: 12px;
  left: 12px;
}

/* toast styles */
.toast-title {
  font-weight: bold;
}
.toast-message {
  word-wrap: break-word;
}
.toast-message a,
.toast-message label {
  color: #FFFFFF;
}
.toast-message a:hover {
  color: #CCCCCC;
  text-decoration: none;
}
.toast-close-button {
  position: relative;
  right: -0.3em;
  top: -0.3em;
  float: right;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  text-shadow: 0 1px 0 #ffffff;
  /* opacity: 0.8; */
}
.toast-close-button:hover,
.toast-close-button:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
}
/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/
button.toast-close-button {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
}
.toast-container {
  pointer-events: none;
  position: fixed;
  z-index: 999999;
}
.toast-container * {
  box-sizing: border-box;
}
.toast-container .ngx-toastr {
  position: relative;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  border-radius: 3px 3px 3px 3px;
  background-position: 15px center;
  background-repeat: no-repeat;
  background-size: 24px;
  box-shadow: 0 0 12px #999999;
  color: #FFFFFF;
}
.toast-container .ngx-toastr:hover {
  box-shadow: 0 0 12px #000000;
  opacity: 1;
  cursor: pointer;
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/info-circle.svg */
.toast-info {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOS4wNDMgOCA4IDExOS4wODMgOCAyNTZjMCAxMzYuOTk3IDExMS4wNDMgMjQ4IDI0OCAyNDhzMjQ4LTExMS4wMDMgMjQ4LTI0OEM1MDQgMTE5LjA4MyAzOTIuOTU3IDggMjU2IDh6bTAgMTEwYzIzLjE5NiAwIDQyIDE4LjgwNCA0MiA0MnMtMTguODA0IDQyLTQyIDQyLTQyLTE4LjgwNC00Mi00MiAxOC44MDQtNDIgNDItNDJ6bTU2IDI1NGMwIDYuNjI3LTUuMzczIDEyLTEyIDEyaC04OGMtNi42MjcgMC0xMi01LjM3My0xMi0xMnYtMjRjMC02LjYyNyA1LjM3My0xMiAxMi0xMmgxMnYtNjRoLTEyYy02LjYyNyAwLTEyLTUuMzczLTEyLTEydi0yNGMwLTYuNjI3IDUuMzczLTEyIDEyLTEyaDY0YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MTAwaDEyYzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MjR6Jy8+PC9zdmc+");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/times-circle.svg */
.toast-error {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOSA4IDggMTE5IDggMjU2czExMSAyNDggMjQ4IDI0OCAyNDgtMTExIDI0OC0yNDhTMzkzIDggMjU2IDh6bTEyMS42IDMxMy4xYzQuNyA0LjcgNC43IDEyLjMgMCAxN0wzMzggMzc3LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwyNTYgMzEybC02NS4xIDY1LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwxMzQuNCAzMzhjLTQuNy00LjctNC43LTEyLjMgMC0xN2w2NS42LTY1LTY1LjYtNjUuMWMtNC43LTQuNy00LjctMTIuMyAwLTE3bDM5LjYtMzkuNmM0LjctNC43IDEyLjMtNC43IDE3IDBsNjUgNjUuNyA2NS4xLTY1LjZjNC43LTQuNyAxMi4zLTQuNyAxNyAwbDM5LjYgMzkuNmM0LjcgNC43IDQuNyAxMi4zIDAgMTdMMzEyIDI1Nmw2NS42IDY1LjF6Jy8+PC9zdmc+");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/check.svg */
.toast-success {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTE3My44OTggNDM5LjQwNGwtMTY2LjQtMTY2LjRjLTkuOTk3LTkuOTk3LTkuOTk3LTI2LjIwNiAwLTM2LjIwNGwzNi4yMDMtMzYuMjA0YzkuOTk3LTkuOTk4IDI2LjIwNy05Ljk5OCAzNi4yMDQgMEwxOTIgMzEyLjY5IDQzMi4wOTUgNzIuNTk2YzkuOTk3LTkuOTk3IDI2LjIwNy05Ljk5NyAzNi4yMDQgMGwzNi4yMDMgMzYuMjA0YzkuOTk3IDkuOTk3IDkuOTk3IDI2LjIwNiAwIDM2LjIwNGwtMjk0LjQgMjk0LjQwMWMtOS45OTggOS45OTctMjYuMjA3IDkuOTk3LTM2LjIwNC0uMDAxeicvPjwvc3ZnPg==");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/exclamation-triangle.svg */
.toast-warning {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1NzYgNTEyJyB3aWR0aD0nNTc2JyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTU2OS41MTcgNDQwLjAxM0M1ODcuOTc1IDQ3Mi4wMDcgNTY0LjgwNiA1MTIgNTI3Ljk0IDUxMkg0OC4wNTRjLTM2LjkzNyAwLTU5Ljk5OS00MC4wNTUtNDEuNTc3LTcxLjk4N0wyNDYuNDIzIDIzLjk4NWMxOC40NjctMzIuMDA5IDY0LjcyLTMxLjk1MSA4My4xNTQgMGwyMzkuOTQgNDE2LjAyOHpNMjg4IDM1NGMtMjUuNDA1IDAtNDYgMjAuNTk1LTQ2IDQ2czIwLjU5NSA0NiA0NiA0NiA0Ni0yMC41OTUgNDYtNDYtMjAuNTk1LTQ2LTQ2LTQ2em0tNDMuNjczLTE2NS4zNDZsNy40MTggMTM2Yy4zNDcgNi4zNjQgNS42MDkgMTEuMzQ2IDExLjk4MiAxMS4zNDZoNDguNTQ2YzYuMzczIDAgMTEuNjM1LTQuOTgyIDExLjk4Mi0xMS4zNDZsNy40MTgtMTM2Yy4zNzUtNi44NzQtNS4wOTgtMTIuNjU0LTExLjk4Mi0xMi42NTRoLTYzLjM4M2MtNi44ODQgMC0xMi4zNTYgNS43OC0xMS45ODEgMTIuNjU0eicvPjwvc3ZnPg==");
}
.toast-container.toast-top-center .ngx-toastr,
.toast-container.toast-bottom-center .ngx-toastr {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}
.toast-container.toast-top-full-width .ngx-toastr,
.toast-container.toast-bottom-full-width .ngx-toastr {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}
.ngx-toastr {
  background-color: #030303;
  pointer-events: auto;
}
.toast-success {
  background-color: #51A351;
}
.toast-error {
  background-color: #BD362F;
}
.toast-info {
  background-color: #2F96B4;
}
.toast-warning {
  background-color: #F89406;
}
.toast-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000000;
  opacity: 0.4;
}
/* Responsive Design */
@media all and (max-width: 240px) {
  .toast-container .ngx-toastr.div {
    padding: 8px 8px 8px 50px;
    width: 11em;
  }
  .toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 241px) and (max-width: 480px) {
  .toast-container .ngx-toastr.div {
    padding: 8px 8px 8px 50px;
    width: 18em;
  }
  .toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 481px) and (max-width: 768px) {
  .toast-container .ngx-toastr.div {
    padding: 15px 15px 15px 50px;
    width: 25em;
  }
}


/*# sourceMappingURL=styles.a7431a45b75d9bbe.css.map*/