@import "https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed|Roboto+Mono";

/* src/theme.scss */
.mat-elevation-z0,
.mat-mdc-elevation-specific.mat-elevation-z0 {
  box-shadow: var(--mat-app-elevation-shadow-level-0, 0px 0px 0px 0px --mat-sys-shadow, 0px 0px 0px 0px --mat-sys-shadow, 0px 0px 0px 0px --mat-sys-shadow);
}
.mat-elevation-z1,
.mat-mdc-elevation-specific.mat-elevation-z1 {
  box-shadow: var(--mat-app-elevation-shadow-level-1, 0px 2px 1px -1px --mat-sys-shadow, 0px 1px 1px 0px --mat-sys-shadow, 0px 1px 3px 0px --mat-sys-shadow);
}
.mat-elevation-z2,
.mat-mdc-elevation-specific.mat-elevation-z2 {
  box-shadow: var(--mat-app-elevation-shadow-level-2, 0px 3px 1px -2px --mat-sys-shadow, 0px 2px 2px 0px --mat-sys-shadow, 0px 1px 5px 0px --mat-sys-shadow);
}
.mat-elevation-z3,
.mat-mdc-elevation-specific.mat-elevation-z3 {
  box-shadow: var(--mat-app-elevation-shadow-level-3, 0px 3px 3px -2px --mat-sys-shadow, 0px 3px 4px 0px --mat-sys-shadow, 0px 1px 8px 0px --mat-sys-shadow);
}
.mat-elevation-z4,
.mat-mdc-elevation-specific.mat-elevation-z4 {
  box-shadow: var(--mat-app-elevation-shadow-level-4, 0px 2px 4px -1px --mat-sys-shadow, 0px 4px 5px 0px --mat-sys-shadow, 0px 1px 10px 0px --mat-sys-shadow);
}
.mat-elevation-z5,
.mat-mdc-elevation-specific.mat-elevation-z5 {
  box-shadow: var(--mat-app-elevation-shadow-level-5, 0px 3px 5px -1px --mat-sys-shadow, 0px 5px 8px 0px --mat-sys-shadow, 0px 1px 14px 0px --mat-sys-shadow);
}
.mat-elevation-z6,
.mat-mdc-elevation-specific.mat-elevation-z6 {
  box-shadow: var(--mat-app-elevation-shadow-level-6, 0px 3px 5px -1px --mat-sys-shadow, 0px 6px 10px 0px --mat-sys-shadow, 0px 1px 18px 0px --mat-sys-shadow);
}
.mat-elevation-z7,
.mat-mdc-elevation-specific.mat-elevation-z7 {
  box-shadow: var(--mat-app-elevation-shadow-level-7, 0px 4px 5px -2px --mat-sys-shadow, 0px 7px 10px 1px --mat-sys-shadow, 0px 2px 16px 1px --mat-sys-shadow);
}
.mat-elevation-z8,
.mat-mdc-elevation-specific.mat-elevation-z8 {
  box-shadow: var(--mat-app-elevation-shadow-level-8, 0px 5px 5px -3px --mat-sys-shadow, 0px 8px 10px 1px --mat-sys-shadow, 0px 3px 14px 2px --mat-sys-shadow);
}
.mat-elevation-z9,
.mat-mdc-elevation-specific.mat-elevation-z9 {
  box-shadow: var(--mat-app-elevation-shadow-level-9, 0px 5px 6px -3px --mat-sys-shadow, 0px 9px 12px 1px --mat-sys-shadow, 0px 3px 16px 2px --mat-sys-shadow);
}
.mat-elevation-z10,
.mat-mdc-elevation-specific.mat-elevation-z10 {
  box-shadow: var(--mat-app-elevation-shadow-level-10, 0px 6px 6px -3px --mat-sys-shadow, 0px 10px 14px 1px --mat-sys-shadow, 0px 4px 18px 3px --mat-sys-shadow);
}
.mat-elevation-z11,
.mat-mdc-elevation-specific.mat-elevation-z11 {
  box-shadow: var(--mat-app-elevation-shadow-level-11, 0px 6px 7px -4px --mat-sys-shadow, 0px 11px 15px 1px --mat-sys-shadow, 0px 4px 20px 3px --mat-sys-shadow);
}
.mat-elevation-z12,
.mat-mdc-elevation-specific.mat-elevation-z12 {
  box-shadow: var(--mat-app-elevation-shadow-level-12, 0px 7px 8px -4px --mat-sys-shadow, 0px 12px 17px 2px --mat-sys-shadow, 0px 5px 22px 4px --mat-sys-shadow);
}
.mat-elevation-z13,
.mat-mdc-elevation-specific.mat-elevation-z13 {
  box-shadow: var(--mat-app-elevation-shadow-level-13, 0px 7px 8px -4px --mat-sys-shadow, 0px 13px 19px 2px --mat-sys-shadow, 0px 5px 24px 4px --mat-sys-shadow);
}
.mat-elevation-z14,
.mat-mdc-elevation-specific.mat-elevation-z14 {
  box-shadow: var(--mat-app-elevation-shadow-level-14, 0px 7px 9px -4px --mat-sys-shadow, 0px 14px 21px 2px --mat-sys-shadow, 0px 5px 26px 4px --mat-sys-shadow);
}
.mat-elevation-z15,
.mat-mdc-elevation-specific.mat-elevation-z15 {
  box-shadow: var(--mat-app-elevation-shadow-level-15, 0px 8px 9px -5px --mat-sys-shadow, 0px 15px 22px 2px --mat-sys-shadow, 0px 6px 28px 5px --mat-sys-shadow);
}
.mat-elevation-z16,
.mat-mdc-elevation-specific.mat-elevation-z16 {
  box-shadow: var(--mat-app-elevation-shadow-level-16, 0px 8px 10px -5px --mat-sys-shadow, 0px 16px 24px 2px --mat-sys-shadow, 0px 6px 30px 5px --mat-sys-shadow);
}
.mat-elevation-z17,
.mat-mdc-elevation-specific.mat-elevation-z17 {
  box-shadow: var(--mat-app-elevation-shadow-level-17, 0px 8px 11px -5px --mat-sys-shadow, 0px 17px 26px 2px --mat-sys-shadow, 0px 6px 32px 5px --mat-sys-shadow);
}
.mat-elevation-z18,
.mat-mdc-elevation-specific.mat-elevation-z18 {
  box-shadow: var(--mat-app-elevation-shadow-level-18, 0px 9px 11px -5px --mat-sys-shadow, 0px 18px 28px 2px --mat-sys-shadow, 0px 7px 34px 6px --mat-sys-shadow);
}
.mat-elevation-z19,
.mat-mdc-elevation-specific.mat-elevation-z19 {
  box-shadow: var(--mat-app-elevation-shadow-level-19, 0px 9px 12px -6px --mat-sys-shadow, 0px 19px 29px 2px --mat-sys-shadow, 0px 7px 36px 6px --mat-sys-shadow);
}
.mat-elevation-z20,
.mat-mdc-elevation-specific.mat-elevation-z20 {
  box-shadow: var(--mat-app-elevation-shadow-level-20, 0px 10px 13px -6px --mat-sys-shadow, 0px 20px 31px 3px --mat-sys-shadow, 0px 8px 38px 7px --mat-sys-shadow);
}
.mat-elevation-z21,
.mat-mdc-elevation-specific.mat-elevation-z21 {
  box-shadow: var(--mat-app-elevation-shadow-level-21, 0px 10px 13px -6px --mat-sys-shadow, 0px 21px 33px 3px --mat-sys-shadow, 0px 8px 40px 7px --mat-sys-shadow);
}
.mat-elevation-z22,
.mat-mdc-elevation-specific.mat-elevation-z22 {
  box-shadow: var(--mat-app-elevation-shadow-level-22, 0px 10px 14px -6px --mat-sys-shadow, 0px 22px 35px 3px --mat-sys-shadow, 0px 8px 42px 7px --mat-sys-shadow);
}
.mat-elevation-z23,
.mat-mdc-elevation-specific.mat-elevation-z23 {
  box-shadow: var(--mat-app-elevation-shadow-level-23, 0px 11px 14px -7px --mat-sys-shadow, 0px 23px 36px 3px --mat-sys-shadow, 0px 9px 44px 8px --mat-sys-shadow);
}
.mat-elevation-z24,
.mat-mdc-elevation-specific.mat-elevation-z24 {
  box-shadow: var(--mat-app-elevation-shadow-level-24, 0px 11px 15px -7px --mat-sys-shadow, 0px 24px 38px 3px --mat-sys-shadow, 0px 9px 46px 8px --mat-sys-shadow);
}
html {
  --mat-sys-on-surface: initial;
}
.mat-app-background {
  background-color: var(--mat-app-background-color, var(--mat-sys-background, transparent));
  color: var(--mat-app-text-color, var(--mat-sys-on-background, inherit));
}
html {
  --mat-app-background-color: #fafafa;
  --mat-app-text-color: rgba(0, 0, 0, 0.87);
  --mat-app-elevation-shadow-level-0:
    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-app-elevation-shadow-level-1:
    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-app-elevation-shadow-level-2:
    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-app-elevation-shadow-level-3:
    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-app-elevation-shadow-level-4:
    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-app-elevation-shadow-level-5:
    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-app-elevation-shadow-level-6:
    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-app-elevation-shadow-level-7:
    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-app-elevation-shadow-level-8:
    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-app-elevation-shadow-level-9:
    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-app-elevation-shadow-level-10:
    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-app-elevation-shadow-level-11:
    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-app-elevation-shadow-level-12:
    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-app-elevation-shadow-level-13:
    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-app-elevation-shadow-level-14:
    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-app-elevation-shadow-level-15:
    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-app-elevation-shadow-level-16:
    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-app-elevation-shadow-level-17:
    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-app-elevation-shadow-level-18:
    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-app-elevation-shadow-level-19:
    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-app-elevation-shadow-level-20:
    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-app-elevation-shadow-level-21:
    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-app-elevation-shadow-level-22:
    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-app-elevation-shadow-level-23:
    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-app-elevation-shadow-level-24:
    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);
}
html {
  --mat-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
}
html {
  --mat-option-selected-state-label-text-color: #0dbb7d;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-option-focus-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-option-selected-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
}
.mat-accent {
  --mat-option-selected-state-label-text-color: #0dbb7d;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-option-focus-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-option-selected-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
}
.mat-warn {
  --mat-option-selected-state-label-text-color: #f44336;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-option-focus-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-option-selected-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
}
html {
  --mat-optgroup-label-text-color: rgba(0, 0, 0, 0.87);
}
html {
  --mat-pseudo-checkbox-full-selected-icon-color: #0dbb7d;
  --mat-pseudo-checkbox-full-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-pseudo-checkbox-full-disabled-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-full-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-minimal-selected-checkmark-color: #0dbb7d;
  --mat-pseudo-checkbox-minimal-disabled-selected-checkmark-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
}
.mat-primary {
  --mat-pseudo-checkbox-full-selected-icon-color: #0dbb7d;
  --mat-pseudo-checkbox-full-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-pseudo-checkbox-full-disabled-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-full-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-minimal-selected-checkmark-color: #0dbb7d;
  --mat-pseudo-checkbox-minimal-disabled-selected-checkmark-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
}
.mat-accent {
  --mat-pseudo-checkbox-full-selected-icon-color: #0dbb7d;
  --mat-pseudo-checkbox-full-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-pseudo-checkbox-full-disabled-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-full-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-minimal-selected-checkmark-color: #0dbb7d;
  --mat-pseudo-checkbox-minimal-disabled-selected-checkmark-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
}
.mat-warn {
  --mat-pseudo-checkbox-full-selected-icon-color: #f44336;
  --mat-pseudo-checkbox-full-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-pseudo-checkbox-full-disabled-selected-checkmark-color: #fafafa;
  --mat-pseudo-checkbox-full-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-full-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-pseudo-checkbox-minimal-selected-checkmark-color: #f44336;
  --mat-pseudo-checkbox-minimal-disabled-selected-checkmark-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
}
html {
  --mat-card-elevated-container-shape: 4px;
  --mat-card-outlined-container-shape: 4px;
  --mat-card-filled-container-shape: 4px;
  --mat-card-outlined-outline-width: 1px;
}
html {
  --mat-card-elevated-container-color: white;
  --mat-card-elevated-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);
  --mat-card-outlined-container-color: white;
  --mat-card-outlined-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-outlined-outline-color: rgba(0, 0, 0, 0.12);
  --mat-card-subtitle-text-color: rgba(0, 0, 0, 0.54);
  --mat-card-filled-container-color: white;
  --mat-card-filled-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);
}
html {
  --mat-progress-bar-active-indicator-height: 4px;
  --mat-progress-bar-track-height: 4px;
  --mat-progress-bar-track-shape: 0;
}
.mat-mdc-progress-bar {
  --mat-progress-bar-active-indicator-color: #0dbb7d;
  --mat-progress-bar-track-color: rgba(13, 187, 125, 0.25);
}
.mat-mdc-progress-bar.mat-accent {
  --mat-progress-bar-active-indicator-color: #0dbb7d;
  --mat-progress-bar-track-color: rgba(13, 187, 125, 0.25);
}
.mat-mdc-progress-bar.mat-warn {
  --mat-progress-bar-active-indicator-color: #f44336;
  --mat-progress-bar-track-color: rgba(244, 67, 54, 0.25);
}
html {
  --mat-tooltip-container-shape: 4px;
  --mat-tooltip-supporting-text-line-height: 16px;
}
html {
  --mat-tooltip-container-color: #424242;
  --mat-tooltip-supporting-text-color: white;
}
html {
  --mat-form-field-filled-active-indicator-height: 1px;
  --mat-form-field-filled-focus-active-indicator-height: 2px;
  --mat-form-field-filled-container-shape: 4px;
  --mat-form-field-outlined-outline-width: 1px;
  --mat-form-field-outlined-focus-outline-width: 2px;
  --mat-form-field-outlined-container-shape: 4px;
}
html {
  --mat-form-field-focus-select-arrow-color: color-mix(in srgb, #0dbb7d 87%, transparent);
  --mat-form-field-filled-caret-color: #0dbb7d;
  --mat-form-field-filled-focus-active-indicator-color: #0dbb7d;
  --mat-form-field-filled-focus-label-text-color: color-mix(in srgb, #0dbb7d 87%, transparent);
  --mat-form-field-outlined-caret-color: #0dbb7d;
  --mat-form-field-outlined-focus-outline-color: #0dbb7d;
  --mat-form-field-outlined-focus-label-text-color: color-mix(in srgb, #0dbb7d 87%, transparent);
  --mat-form-field-disabled-input-text-placeholder-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-form-field-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-error-text-color: #f44336;
  --mat-form-field-select-option-text-color: inherit;
  --mat-form-field-select-disabled-option-text-color: GrayText;
  --mat-form-field-leading-icon-color: unset;
  --mat-form-field-disabled-leading-icon-color: unset;
  --mat-form-field-trailing-icon-color: unset;
  --mat-form-field-disabled-trailing-icon-color: unset;
  --mat-form-field-error-focus-trailing-icon-color: unset;
  --mat-form-field-error-hover-trailing-icon-color: unset;
  --mat-form-field-error-trailing-icon-color: unset;
  --mat-form-field-enabled-select-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-disabled-select-arrow-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-form-field-hover-state-layer-opacity: 0.04;
  --mat-form-field-focus-state-layer-opacity: 0.12;
  --mat-form-field-filled-container-color: #f6f6f6;
  --mat-form-field-filled-disabled-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-form-field-filled-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-filled-hover-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-filled-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-form-field-filled-input-text-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-filled-disabled-input-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-form-field-filled-input-text-placeholder-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-filled-error-hover-label-text-color: #f44336;
  --mat-form-field-filled-error-focus-label-text-color: #f44336;
  --mat-form-field-filled-error-label-text-color: #f44336;
  --mat-form-field-filled-error-caret-color: #f44336;
  --mat-form-field-filled-active-indicator-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-filled-disabled-active-indicator-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-form-field-filled-hover-active-indicator-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-filled-error-active-indicator-color: #f44336;
  --mat-form-field-filled-error-focus-active-indicator-color: #f44336;
  --mat-form-field-filled-error-hover-active-indicator-color: #f44336;
  --mat-form-field-outlined-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-outlined-hover-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-outlined-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-form-field-outlined-input-text-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-outlined-disabled-input-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-form-field-outlined-input-text-placeholder-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-outlined-error-caret-color: #f44336;
  --mat-form-field-outlined-error-focus-label-text-color: #f44336;
  --mat-form-field-outlined-error-label-text-color: #f44336;
  --mat-form-field-outlined-error-hover-label-text-color: #f44336;
  --mat-form-field-outlined-outline-color: rgba(0, 0, 0, 0.38);
  --mat-form-field-outlined-disabled-outline-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-form-field-outlined-hover-outline-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-outlined-error-focus-outline-color: #f44336;
  --mat-form-field-outlined-error-hover-outline-color: #f44336;
  --mat-form-field-outlined-error-outline-color: #f44336;
}
.mat-mdc-form-field.mat-accent {
  --mat-form-field-focus-select-arrow-color: color-mix(in srgb, #0dbb7d 87%, transparent);
  --mat-form-field-filled-caret-color: #0dbb7d;
  --mat-form-field-filled-focus-active-indicator-color: #0dbb7d;
  --mat-form-field-filled-focus-label-text-color: color-mix(in srgb, #0dbb7d 87%, transparent);
  --mat-form-field-outlined-caret-color: #0dbb7d;
  --mat-form-field-outlined-focus-outline-color: #0dbb7d;
  --mat-form-field-outlined-focus-label-text-color: color-mix(in srgb, #0dbb7d 87%, transparent);
}
.mat-mdc-form-field.mat-warn {
  --mat-form-field-focus-select-arrow-color: color-mix(in srgb, #f44336 87%, transparent);
  --mat-form-field-filled-caret-color: #f44336;
  --mat-form-field-filled-focus-active-indicator-color: #f44336;
  --mat-form-field-filled-focus-label-text-color: color-mix(in srgb, #f44336 87%, transparent);
  --mat-form-field-outlined-caret-color: #f44336;
  --mat-form-field-outlined-focus-outline-color: #f44336;
  --mat-form-field-outlined-focus-label-text-color: color-mix(in srgb, #f44336 87%, transparent);
}
html {
  --mat-form-field-container-height: 56px;
  --mat-form-field-filled-label-display: block;
  --mat-form-field-container-vertical-padding: 16px;
  --mat-form-field-filled-with-label-container-padding-top: 24px;
  --mat-form-field-filled-with-label-container-padding-bottom: 8px;
}
html {
  --mat-select-container-elevation-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);
}
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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.54);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-select-focused-arrow-color: #0dbb7d;
  --mat-select-invalid-arrow-color: #f44336;
}
.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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.54);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-select-focused-arrow-color: #0dbb7d;
  --mat-select-invalid-arrow-color: #f44336;
}
.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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.54);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-select-focused-arrow-color: #f44336;
  --mat-select-invalid-arrow-color: #f44336;
}
html {
  --mat-select-arrow-transform: translateY(-8px);
}
html {
  --mat-autocomplete-container-shape: 4px;
  --mat-autocomplete-container-elevation-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);
}
html {
  --mat-autocomplete-background-color: white;
}
html {
  --mat-dialog-container-shape: 4px;
  --mat-dialog-container-elevation-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-dialog-container-max-width: 80vw;
  --mat-dialog-container-small-max-width: 80vw;
  --mat-dialog-container-min-width: 0;
  --mat-dialog-actions-alignment: start;
  --mat-dialog-actions-padding: 8px;
  --mat-dialog-content-padding: 20px 24px;
  --mat-dialog-with-actions-content-padding: 20px 24px;
  --mat-dialog-headline-padding: 0 24px 9px;
}
html {
  --mat-dialog-container-color: white;
  --mat-dialog-subhead-color: rgba(0, 0, 0, 0.87);
  --mat-dialog-supporting-text-color: rgba(0, 0, 0, 0.54);
}
.mat-mdc-standard-chip {
  --mat-chip-container-shape-radius: 16px;
  --mat-chip-disabled-container-opacity: 0.4;
  --mat-chip-disabled-outline-color: transparent;
  --mat-chip-flat-selected-outline-width: 0;
  --mat-chip-focus-outline-color: transparent;
  --mat-chip-hover-state-layer-opacity: 0.04;
  --mat-chip-outline-color: transparent;
  --mat-chip-outline-width: 0;
  --mat-chip-selected-hover-state-layer-opacity: 0.04;
  --mat-chip-selected-trailing-action-state-layer-color: transparent;
  --mat-chip-trailing-action-focus-opacity: 1;
  --mat-chip-trailing-action-focus-state-layer-opacity: 0;
  --mat-chip-trailing-action-hover-state-layer-opacity: 0;
  --mat-chip-trailing-action-opacity: 0.54;
  --mat-chip-trailing-action-state-layer-color: transparent;
  --mat-chip-with-avatar-avatar-shape-radius: 14px;
  --mat-chip-with-avatar-avatar-size: 28px;
  --mat-chip-with-avatar-disabled-avatar-opacity: 1;
  --mat-chip-with-icon-disabled-icon-opacity: 1;
  --mat-chip-with-icon-icon-size: 18px;
  --mat-chip-with-trailing-icon-disabled-trailing-icon-opacity: 1;
}
.mat-mdc-standard-chip {
  --mat-chip-disabled-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-chip-elevated-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-chip-elevated-disabled-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-chip-elevated-selected-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-chip-flat-disabled-selected-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-chip-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-focus-state-layer-opacity: 0.12;
  --mat-chip-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-chip-selected-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-selected-focus-state-layer-color: 0.12;
  --mat-chip-selected-focus-state-layer-opacity: 0.12;
  --mat-chip-selected-hover-state-layer-color: 0.04;
  --mat-chip-selected-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-chip-selected-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-with-icon-disabled-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-with-icon-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-with-icon-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-with-trailing-icon-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-with-trailing-icon-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary,
.mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mat-chip-disabled-label-text-color: white;
  --mat-chip-elevated-container-color: #0dbb7d;
  --mat-chip-elevated-disabled-container-color: #0dbb7d;
  --mat-chip-elevated-selected-container-color: #0dbb7d;
  --mat-chip-flat-disabled-selected-container-color: #0dbb7d;
  --mat-chip-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-focus-state-layer-opacity: 0.12;
  --mat-chip-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-label-text-color: white;
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-focus-state-layer-color: 0.12;
  --mat-chip-selected-focus-state-layer-opacity: 0.12;
  --mat-chip-selected-hover-state-layer-color: 0.04;
  --mat-chip-selected-label-text-color: white;
  --mat-chip-selected-trailing-icon-color: white;
  --mat-chip-with-icon-disabled-icon-color: white;
  --mat-chip-with-icon-icon-color: white;
  --mat-chip-with-icon-selected-icon-color: white;
  --mat-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mat-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 {
  --mat-chip-disabled-label-text-color: white;
  --mat-chip-elevated-container-color: #0dbb7d;
  --mat-chip-elevated-disabled-container-color: #0dbb7d;
  --mat-chip-elevated-selected-container-color: #0dbb7d;
  --mat-chip-flat-disabled-selected-container-color: #0dbb7d;
  --mat-chip-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-focus-state-layer-opacity: 0.12;
  --mat-chip-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-label-text-color: white;
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-focus-state-layer-color: 0.12;
  --mat-chip-selected-focus-state-layer-opacity: 0.12;
  --mat-chip-selected-hover-state-layer-color: 0.04;
  --mat-chip-selected-label-text-color: white;
  --mat-chip-selected-trailing-icon-color: white;
  --mat-chip-with-icon-disabled-icon-color: white;
  --mat-chip-with-icon-icon-color: white;
  --mat-chip-with-icon-selected-icon-color: white;
  --mat-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mat-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 {
  --mat-chip-disabled-label-text-color: white;
  --mat-chip-elevated-container-color: #f44336;
  --mat-chip-elevated-disabled-container-color: #f44336;
  --mat-chip-elevated-selected-container-color: #f44336;
  --mat-chip-flat-disabled-selected-container-color: #f44336;
  --mat-chip-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-focus-state-layer-opacity: 0.12;
  --mat-chip-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-chip-label-text-color: white;
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-focus-state-layer-color: 0.12;
  --mat-chip-selected-focus-state-layer-opacity: 0.12;
  --mat-chip-selected-hover-state-layer-color: 0.04;
  --mat-chip-selected-label-text-color: white;
  --mat-chip-selected-trailing-icon-color: white;
  --mat-chip-with-icon-disabled-icon-color: white;
  --mat-chip-with-icon-icon-color: white;
  --mat-chip-with-icon-selected-icon-color: white;
  --mat-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mat-chip-with-trailing-icon-trailing-icon-color: white;
}
.mat-mdc-chip.mat-mdc-standard-chip {
  --mat-chip-container-height: 32px;
}
html {
  --mat-slide-toggle-disabled-handle-opacity: 0.38;
  --mat-slide-toggle-disabled-selected-handle-opacity: 0.38;
  --mat-slide-toggle-disabled-selected-icon-opacity: 0.38;
  --mat-slide-toggle-disabled-track-opacity: 0.12;
  --mat-slide-toggle-disabled-unselected-handle-opacity: 0.38;
  --mat-slide-toggle-disabled-unselected-icon-opacity: 0.38;
  --mat-slide-toggle-disabled-unselected-track-outline-color: transparent;
  --mat-slide-toggle-disabled-unselected-track-outline-width: 1px;
  --mat-slide-toggle-handle-height: 20px;
  --mat-slide-toggle-handle-shape: 10px;
  --mat-slide-toggle-handle-width: 20px;
  --mat-slide-toggle-hidden-track-opacity: 1;
  --mat-slide-toggle-hidden-track-transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
  --mat-slide-toggle-pressed-handle-size: 20px;
  --mat-slide-toggle-selected-focus-state-layer-opacity: 0.12;
  --mat-slide-toggle-selected-handle-horizontal-margin: 0;
  --mat-slide-toggle-selected-handle-size: 20px;
  --mat-slide-toggle-selected-hover-state-layer-opacity: 0.04;
  --mat-slide-toggle-selected-icon-size: 18px;
  --mat-slide-toggle-selected-pressed-handle-horizontal-margin: 0;
  --mat-slide-toggle-selected-pressed-state-layer-opacity: 0.12;
  --mat-slide-toggle-selected-track-outline-color: transparent;
  --mat-slide-toggle-selected-track-outline-width: 1px;
  --mat-slide-toggle-selected-with-icon-handle-horizontal-margin: 0;
  --mat-slide-toggle-track-height: 14px;
  --mat-slide-toggle-track-outline-color: transparent;
  --mat-slide-toggle-track-outline-width: 1px;
  --mat-slide-toggle-track-shape: 7px;
  --mat-slide-toggle-track-width: 36px;
  --mat-slide-toggle-unselected-focus-state-layer-opacity: 0.12;
  --mat-slide-toggle-unselected-handle-horizontal-margin: 0;
  --mat-slide-toggle-unselected-handle-size: 20px;
  --mat-slide-toggle-unselected-hover-state-layer-opacity: 0.12;
  --mat-slide-toggle-unselected-icon-size: 18px;
  --mat-slide-toggle-unselected-pressed-handle-horizontal-margin: 0;
  --mat-slide-toggle-unselected-pressed-state-layer-opacity: 0.1;
  --mat-slide-toggle-unselected-with-icon-handle-horizontal-margin: 0;
  --mat-slide-toggle-visible-track-opacity: 1;
  --mat-slide-toggle-visible-track-transition: transform 75ms 0ms cubic-bezier(0, 0, 0.2, 1);
  --mat-slide-toggle-with-icon-handle-size: 20px;
  --mat-slide-toggle-touch-target-size: 48px;
}
html {
  --mat-slide-toggle-selected-icon-color: white;
  --mat-slide-toggle-disabled-selected-icon-color: white;
  --mat-slide-toggle-selected-focus-state-layer-color: #0dbb7d;
  --mat-slide-toggle-selected-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-hover-state-layer-color: #0dbb7d;
  --mat-slide-toggle-selected-pressed-state-layer-color: #0dbb7d;
  --mat-slide-toggle-selected-focus-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-hover-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-pressed-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-focus-track-color: #56cfa4;
  --mat-slide-toggle-selected-hover-track-color: #56cfa4;
  --mat-slide-toggle-selected-pressed-track-color: #56cfa4;
  --mat-slide-toggle-selected-track-color: #56cfa4;
  --mat-slide-toggle-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-slide-toggle-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);
  --mat-slide-toggle-disabled-selected-handle-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-disabled-selected-track-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-disabled-unselected-handle-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-disabled-unselected-icon-color: #f6f6f6;
  --mat-slide-toggle-disabled-unselected-track-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-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);
  --mat-slide-toggle-handle-surface-color: white;
  --mat-slide-toggle-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-unselected-hover-handle-color: #424242;
  --mat-slide-toggle-unselected-focus-handle-color: #424242;
  --mat-slide-toggle-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-unselected-focus-track-color: rgba(0, 0, 0, 0.12);
  --mat-slide-toggle-unselected-icon-color: #f6f6f6;
  --mat-slide-toggle-unselected-handle-color: rgba(0, 0, 0, 0.54);
  --mat-slide-toggle-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-unselected-hover-track-color: rgba(0, 0, 0, 0.12);
  --mat-slide-toggle-unselected-pressed-handle-color: #424242;
  --mat-slide-toggle-unselected-pressed-track-color: rgba(0, 0, 0, 0.12);
  --mat-slide-toggle-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-slide-toggle-unselected-track-color: rgba(0, 0, 0, 0.12);
}
.mat-mdc-slide-toggle.mat-accent {
  --mat-slide-toggle-selected-icon-color: white;
  --mat-slide-toggle-disabled-selected-icon-color: white;
  --mat-slide-toggle-selected-focus-state-layer-color: #0dbb7d;
  --mat-slide-toggle-selected-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-hover-state-layer-color: #0dbb7d;
  --mat-slide-toggle-selected-pressed-state-layer-color: #0dbb7d;
  --mat-slide-toggle-selected-focus-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-hover-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-pressed-handle-color: #0dbb7d;
  --mat-slide-toggle-selected-focus-track-color: #56cfa4;
  --mat-slide-toggle-selected-hover-track-color: #56cfa4;
  --mat-slide-toggle-selected-pressed-track-color: #56cfa4;
  --mat-slide-toggle-selected-track-color: #56cfa4;
}
.mat-mdc-slide-toggle.mat-warn {
  --mat-slide-toggle-selected-icon-color: white;
  --mat-slide-toggle-disabled-selected-icon-color: white;
  --mat-slide-toggle-selected-focus-state-layer-color: #f44336;
  --mat-slide-toggle-selected-handle-color: #f44336;
  --mat-slide-toggle-selected-hover-state-layer-color: #f44336;
  --mat-slide-toggle-selected-pressed-state-layer-color: #f44336;
  --mat-slide-toggle-selected-focus-handle-color: #f44336;
  --mat-slide-toggle-selected-hover-handle-color: #f44336;
  --mat-slide-toggle-selected-pressed-handle-color: #f44336;
  --mat-slide-toggle-selected-focus-track-color: #e57373;
  --mat-slide-toggle-selected-hover-track-color: #e57373;
  --mat-slide-toggle-selected-pressed-track-color: #e57373;
  --mat-slide-toggle-selected-track-color: #e57373;
}
html {
  --mat-slide-toggle-state-layer-size: 40px;
  --mat-slide-toggle-touch-target-display: block;
}
html {
  --mat-radio-disabled-selected-icon-opacity: 0.38;
  --mat-radio-disabled-unselected-icon-opacity: 0.38;
  --mat-radio-state-layer-size: 40px;
  --mat-radio-touch-target-size: 48px;
}
.mat-mdc-radio-button.mat-primary {
  --mat-radio-checked-ripple-color: #0dbb7d;
  --mat-radio-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-radio-disabled-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-disabled-unselected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-radio-ripple-color: rgba(0, 0, 0, 0.87);
  --mat-radio-selected-focus-icon-color: #0dbb7d;
  --mat-radio-selected-hover-icon-color: #0dbb7d;
  --mat-radio-selected-icon-color: #0dbb7d;
  --mat-radio-selected-pressed-icon-color: #0dbb7d;
  --mat-radio-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-radio-button.mat-accent {
  --mat-radio-checked-ripple-color: #0dbb7d;
  --mat-radio-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-radio-disabled-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-disabled-unselected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-radio-ripple-color: rgba(0, 0, 0, 0.87);
  --mat-radio-selected-focus-icon-color: #0dbb7d;
  --mat-radio-selected-hover-icon-color: #0dbb7d;
  --mat-radio-selected-icon-color: #0dbb7d;
  --mat-radio-selected-pressed-icon-color: #0dbb7d;
  --mat-radio-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-radio-button.mat-warn {
  --mat-radio-checked-ripple-color: #f44336;
  --mat-radio-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-radio-disabled-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-disabled-unselected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-radio-ripple-color: rgba(0, 0, 0, 0.87);
  --mat-radio-selected-focus-icon-color: #f44336;
  --mat-radio-selected-hover-icon-color: #f44336;
  --mat-radio-selected-icon-color: #f44336;
  --mat-radio-selected-pressed-icon-color: #f44336;
  --mat-radio-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.87);
}
html {
  --mat-radio-state-layer-size: 40px;
  --mat-radio-touch-target-display: block;
}
html {
  --mat-slider-active-track-height: 6px;
  --mat-slider-active-track-shape: 9999px;
  --mat-slider-handle-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);
  --mat-slider-handle-height: 20px;
  --mat-slider-handle-shape: 50%;
  --mat-slider-handle-width: 20px;
  --mat-slider-inactive-track-height: 4px;
  --mat-slider-inactive-track-shape: 9999px;
  --mat-slider-value-indicator-border-radius: 4px;
  --mat-slider-value-indicator-caret-display: block;
  --mat-slider-value-indicator-container-transform: translateX(-50%);
  --mat-slider-value-indicator-height: 32px;
  --mat-slider-value-indicator-padding: 0 12px;
  --mat-slider-value-indicator-text-transform: none;
  --mat-slider-value-indicator-width: auto;
  --mat-slider-with-overlap-handle-outline-width: 1px;
  --mat-slider-with-tick-marks-active-container-opacity: 0.6;
  --mat-slider-with-tick-marks-container-shape: 50%;
  --mat-slider-with-tick-marks-container-size: 2px;
  --mat-slider-with-tick-marks-inactive-container-opacity: 0.6;
  --mat-slider-value-indicator-transform-origin: bottom;
}
html {
  --mat-slider-active-track-color: #0dbb7d;
  --mat-slider-focus-handle-color: #0dbb7d;
  --mat-slider-handle-color: #0dbb7d;
  --mat-slider-hover-handle-color: #0dbb7d;
  --mat-slider-focus-state-layer-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-slider-hover-state-layer-color: color-mix(in srgb, #0dbb7d 4%, transparent);
  --mat-slider-inactive-track-color: #0dbb7d;
  --mat-slider-ripple-color: #0dbb7d;
  --mat-slider-with-tick-marks-active-container-color: white;
  --mat-slider-with-tick-marks-inactive-container-color: #0dbb7d;
  --mat-slider-disabled-active-track-color: rgba(0, 0, 0, 0.87);
  --mat-slider-disabled-handle-color: rgba(0, 0, 0, 0.87);
  --mat-slider-disabled-inactive-track-color: rgba(0, 0, 0, 0.87);
  --mat-slider-label-container-color: #424242;
  --mat-slider-label-label-text-color: white;
  --mat-slider-value-indicator-opacity: 1;
  --mat-slider-with-overlap-handle-outline-color: rgba(0, 0, 0, 0.87);
  --mat-slider-with-tick-marks-disabled-container-color: rgba(0, 0, 0, 0.87);
}
.mat-accent {
  --mat-slider-active-track-color: #0dbb7d;
  --mat-slider-focus-handle-color: #0dbb7d;
  --mat-slider-handle-color: #0dbb7d;
  --mat-slider-hover-handle-color: #0dbb7d;
  --mat-slider-focus-state-layer-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-slider-hover-state-layer-color: color-mix(in srgb, #0dbb7d 4%, transparent);
  --mat-slider-inactive-track-color: #0dbb7d;
  --mat-slider-ripple-color: #0dbb7d;
  --mat-slider-with-tick-marks-active-container-color: white;
  --mat-slider-with-tick-marks-inactive-container-color: #0dbb7d;
}
.mat-warn {
  --mat-slider-active-track-color: #f44336;
  --mat-slider-focus-handle-color: #f44336;
  --mat-slider-handle-color: #f44336;
  --mat-slider-hover-handle-color: #f44336;
  --mat-slider-focus-state-layer-color: color-mix(in srgb, #f44336 12%, transparent);
  --mat-slider-hover-state-layer-color: color-mix(in srgb, #f44336 4%, transparent);
  --mat-slider-inactive-track-color: #f44336;
  --mat-slider-ripple-color: #f44336;
  --mat-slider-with-tick-marks-active-container-color: white;
  --mat-slider-with-tick-marks-inactive-container-color: #f44336;
}
html {
  --mat-menu-container-shape: 4px;
  --mat-menu-divider-bottom-spacing: 0;
  --mat-menu-divider-top-spacing: 0;
  --mat-menu-item-spacing: 16px;
  --mat-menu-item-icon-size: 24px;
  --mat-menu-item-leading-spacing: 16px;
  --mat-menu-item-trailing-spacing: 16px;
  --mat-menu-item-with-icon-leading-spacing: 16px;
  --mat-menu-item-with-icon-trailing-spacing: 16px;
  --mat-menu-container-elevation-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);
}
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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-menu-item-focus-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-menu-container-color: white;
  --mat-menu-divider-color: rgba(0, 0, 0, 0.12);
}
html {
  --mat-list-active-indicator-color: transparent;
  --mat-list-active-indicator-shape: 4px;
  --mat-list-list-item-container-shape: 0;
  --mat-list-list-item-leading-avatar-shape: 50%;
  --mat-list-list-item-container-color: transparent;
  --mat-list-list-item-selected-container-color: transparent;
  --mat-list-list-item-leading-avatar-color: transparent;
  --mat-list-list-item-leading-icon-size: 24px;
  --mat-list-list-item-leading-avatar-size: 40px;
  --mat-list-list-item-trailing-icon-size: 24px;
  --mat-list-list-item-disabled-state-layer-color: transparent;
  --mat-list-list-item-disabled-state-layer-opacity: 0;
  --mat-list-list-item-disabled-label-text-opacity: 0.38;
  --mat-list-list-item-disabled-leading-icon-opacity: 0.38;
  --mat-list-list-item-disabled-trailing-icon-opacity: 0.38;
}
html {
  --mat-list-list-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-supporting-text-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-leading-icon-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-trailing-supporting-text-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-trailing-icon-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-selected-trailing-icon-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-disabled-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-disabled-leading-icon-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-hover-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-hover-leading-icon-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-hover-state-layer-opacity: 0.04;
  --mat-list-list-item-hover-trailing-icon-color: rgba(0, 0, 0, 0.54);
  --mat-list-list-item-focus-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-list-list-item-focus-state-layer-opacity: 0.12;
}
.mdc-list-item__start,
.mdc-list-item__end {
  --mat-radio-checked-ripple-color: #0dbb7d;
  --mat-radio-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-radio-disabled-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-disabled-unselected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-radio-ripple-color: rgba(0, 0, 0, 0.87);
  --mat-radio-selected-focus-icon-color: #0dbb7d;
  --mat-radio-selected-hover-icon-color: #0dbb7d;
  --mat-radio-selected-icon-color: #0dbb7d;
  --mat-radio-selected-pressed-icon-color: #0dbb7d;
  --mat-radio-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-accent .mdc-list-item__start,
.mat-accent .mdc-list-item__end {
  --mat-radio-checked-ripple-color: #0dbb7d;
  --mat-radio-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-radio-disabled-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-disabled-unselected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-radio-ripple-color: rgba(0, 0, 0, 0.87);
  --mat-radio-selected-focus-icon-color: #0dbb7d;
  --mat-radio-selected-hover-icon-color: #0dbb7d;
  --mat-radio-selected-icon-color: #0dbb7d;
  --mat-radio-selected-pressed-icon-color: #0dbb7d;
  --mat-radio-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-warn .mdc-list-item__start,
.mat-warn .mdc-list-item__end {
  --mat-radio-checked-ripple-color: #f44336;
  --mat-radio-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-radio-disabled-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-disabled-unselected-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-radio-ripple-color: rgba(0, 0, 0, 0.87);
  --mat-radio-selected-focus-icon-color: #f44336;
  --mat-radio-selected-hover-icon-color: #f44336;
  --mat-radio-selected-icon-color: #f44336;
  --mat-radio-selected-pressed-icon-color: #f44336;
  --mat-radio-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-list-option {
  --mat-checkbox-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-icon-color: #0dbb7d;
  --mat-checkbox-selected-hover-icon-color: #0dbb7d;
  --mat-checkbox-selected-icon-color: #0dbb7d;
  --mat-checkbox-selected-pressed-icon-color: #0dbb7d;
  --mat-checkbox-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-checkbox-selected-focus-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-hover-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-pressed-state-layer-color: #0dbb7d;
  --mat-checkbox-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-list-option.mat-accent {
  --mat-checkbox-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-icon-color: #0dbb7d;
  --mat-checkbox-selected-hover-icon-color: #0dbb7d;
  --mat-checkbox-selected-icon-color: #0dbb7d;
  --mat-checkbox-selected-pressed-icon-color: #0dbb7d;
  --mat-checkbox-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-checkbox-selected-focus-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-hover-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-pressed-state-layer-color: #0dbb7d;
  --mat-checkbox-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-list-option.mat-warn {
  --mat-checkbox-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-icon-color: #f44336;
  --mat-checkbox-selected-hover-icon-color: #f44336;
  --mat-checkbox-selected-icon-color: #f44336;
  --mat-checkbox-selected-pressed-icon-color: #f44336;
  --mat-checkbox-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-checkbox-selected-focus-state-layer-color: #f44336;
  --mat-checkbox-selected-hover-state-layer-color: #f44336;
  --mat-checkbox-selected-pressed-state-layer-color: #f44336;
  --mat-checkbox-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
}
.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--selected .mdc-list-item__start,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__start {
  color: #0dbb7d;
}
.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;
}
html {
  --mat-list-list-item-leading-icon-start-space: 16px;
  --mat-list-list-item-leading-icon-end-space: 32px;
  --mat-list-list-item-one-line-container-height: 48px;
  --mat-list-list-item-two-line-container-height: 64px;
  --mat-list-list-item-three-line-container-height: 88px;
}
.mdc-list-item__start,
.mdc-list-item__end {
  --mat-radio-state-layer-size: 40px;
  --mat-radio-touch-target-display: block;
}
.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-page-size-select-width: 84px;
  --mat-paginator-page-size-select-touch-target-height: 48px;
}
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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
}
html {
  --mat-paginator-container-size: 56px;
  --mat-paginator-form-field-container-height: 40px;
  --mat-paginator-form-field-container-vertical-padding: 8px;
  --mat-paginator-touch-target-display: block;
}
html {
  --mat-tab-container-height: 48px;
  --mat-tab-divider-color: transparent;
  --mat-tab-divider-height: 0;
  --mat-tab-active-indicator-height: 2px;
  --mat-tab-active-indicator-shape: 0;
}
.mat-mdc-tab-group,
.mat-mdc-tab-nav-bar {
  --mat-tab-disabled-ripple-color: rgba(0, 0, 0, 0.54);
  --mat-tab-pagination-icon-color: rgba(0, 0, 0, 0.87);
  --mat-tab-inactive-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-active-label-text-color: #0dbb7d;
  --mat-tab-active-ripple-color: #0dbb7d;
  --mat-tab-inactive-ripple-color: #0dbb7d;
  --mat-tab-inactive-focus-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-inactive-hover-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-active-focus-label-text-color: #0dbb7d;
  --mat-tab-active-hover-label-text-color: #0dbb7d;
  --mat-tab-active-focus-indicator-color: #0dbb7d;
  --mat-tab-active-hover-indicator-color: #0dbb7d;
  --mat-tab-active-indicator-color: #0dbb7d;
}
.mat-mdc-tab-group.mat-accent,
.mat-mdc-tab-nav-bar.mat-accent {
  --mat-tab-disabled-ripple-color: rgba(0, 0, 0, 0.54);
  --mat-tab-pagination-icon-color: rgba(0, 0, 0, 0.87);
  --mat-tab-inactive-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-active-label-text-color: #0dbb7d;
  --mat-tab-active-ripple-color: #0dbb7d;
  --mat-tab-inactive-ripple-color: #0dbb7d;
  --mat-tab-inactive-focus-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-inactive-hover-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-active-focus-label-text-color: #0dbb7d;
  --mat-tab-active-hover-label-text-color: #0dbb7d;
  --mat-tab-active-focus-indicator-color: #0dbb7d;
  --mat-tab-active-hover-indicator-color: #0dbb7d;
  --mat-tab-active-indicator-color: #0dbb7d;
}
.mat-mdc-tab-group.mat-warn,
.mat-mdc-tab-nav-bar.mat-warn {
  --mat-tab-disabled-ripple-color: rgba(0, 0, 0, 0.54);
  --mat-tab-pagination-icon-color: rgba(0, 0, 0, 0.87);
  --mat-tab-inactive-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-active-label-text-color: #f44336;
  --mat-tab-active-ripple-color: #f44336;
  --mat-tab-inactive-ripple-color: #f44336;
  --mat-tab-inactive-focus-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-inactive-hover-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-tab-active-focus-label-text-color: #f44336;
  --mat-tab-active-hover-label-text-color: #f44336;
  --mat-tab-active-focus-indicator-color: #f44336;
  --mat-tab-active-hover-indicator-color: #f44336;
  --mat-tab-active-indicator-color: #f44336;
}
.mat-mdc-tab-group.mat-background-primary,
.mat-mdc-tab-nav-bar.mat-background-primary {
  --mat-tab-background-color: #0dbb7d;
  --mat-tab-foreground-color: white;
}
.mat-mdc-tab-group.mat-background-accent,
.mat-mdc-tab-nav-bar.mat-background-accent {
  --mat-tab-background-color: #0dbb7d;
  --mat-tab-foreground-color: white;
}
.mat-mdc-tab-group.mat-background-warn,
.mat-mdc-tab-nav-bar.mat-background-warn {
  --mat-tab-background-color: #f44336;
  --mat-tab-foreground-color: white;
}
.mat-mdc-tab-header {
  --mat-tab-container-height: 48px;
}
html {
  --mat-checkbox-disabled-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-state-layer-opacity: 0.12;
  --mat-checkbox-selected-hover-state-layer-opacity: 0.04;
  --mat-checkbox-selected-pressed-state-layer-opacity: 0.12;
  --mat-checkbox-unselected-focus-state-layer-opacity: 0.12;
  --mat-checkbox-unselected-hover-state-layer-opacity: 0.04;
  --mat-checkbox-unselected-pressed-state-layer-opacity: 0.12;
  --mat-checkbox-touch-target-size: 48px;
}
html {
  --mat-checkbox-disabled-label-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-icon-color: #0dbb7d;
  --mat-checkbox-selected-hover-icon-color: #0dbb7d;
  --mat-checkbox-selected-icon-color: #0dbb7d;
  --mat-checkbox-selected-pressed-icon-color: #0dbb7d;
  --mat-checkbox-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-checkbox-selected-focus-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-hover-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-pressed-state-layer-color: #0dbb7d;
  --mat-checkbox-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-checkbox.mat-primary {
  --mat-checkbox-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-icon-color: #0dbb7d;
  --mat-checkbox-selected-hover-icon-color: #0dbb7d;
  --mat-checkbox-selected-icon-color: #0dbb7d;
  --mat-checkbox-selected-pressed-icon-color: #0dbb7d;
  --mat-checkbox-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-checkbox-selected-focus-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-hover-state-layer-color: #0dbb7d;
  --mat-checkbox-selected-pressed-state-layer-color: #0dbb7d;
  --mat-checkbox-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-checkbox.mat-warn {
  --mat-checkbox-disabled-selected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-disabled-unselected-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-checkbox-selected-checkmark-color: white;
  --mat-checkbox-selected-focus-icon-color: #f44336;
  --mat-checkbox-selected-hover-icon-color: #f44336;
  --mat-checkbox-selected-icon-color: #f44336;
  --mat-checkbox-selected-pressed-icon-color: #f44336;
  --mat-checkbox-unselected-focus-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-icon-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-checkbox-selected-focus-state-layer-color: #f44336;
  --mat-checkbox-selected-hover-state-layer-color: #f44336;
  --mat-checkbox-selected-pressed-state-layer-color: #f44336;
  --mat-checkbox-unselected-focus-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-hover-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-checkbox-unselected-pressed-state-layer-color: rgba(0, 0, 0, 0.87);
}
html {
  --mat-checkbox-touch-target-display: block;
  --mat-checkbox-state-layer-size: 40px;
}
html {
  --mat-button-filled-container-shape: 4px;
  --mat-button-filled-horizontal-padding: 16px;
  --mat-button-filled-icon-offset: -4px;
  --mat-button-filled-icon-spacing: 8px;
  --mat-button-filled-touch-target-size: 48px;
  --mat-button-outlined-container-shape: 4px;
  --mat-button-outlined-horizontal-padding: 15px;
  --mat-button-outlined-icon-offset: -4px;
  --mat-button-outlined-icon-spacing: 8px;
  --mat-button-outlined-keep-touch-target: false;
  --mat-button-outlined-outline-width: 1px;
  --mat-button-outlined-touch-target-size: 48px;
  --mat-button-protected-container-elevation-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-button-protected-container-shape: 4px;
  --mat-button-protected-disabled-container-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);
  --mat-button-protected-focus-container-elevation-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-button-protected-horizontal-padding: 16px;
  --mat-button-protected-hover-container-elevation-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-button-protected-icon-offset: -4px;
  --mat-button-protected-icon-spacing: 8px;
  --mat-button-protected-pressed-container-elevation-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-button-protected-touch-target-size: 48px;
  --mat-button-text-container-shape: 4px;
  --mat-button-text-horizontal-padding: 8px;
  --mat-button-text-icon-offset: 0;
  --mat-button-text-icon-spacing: 8px;
  --mat-button-text-with-icon-horizontal-padding: 8px;
  --mat-button-text-touch-target-size: 48px;
  --mat-button-tonal-container-shape: 4px;
  --mat-button-tonal-horizontal-padding: 16px;
  --mat-button-tonal-icon-offset: -4px;
  --mat-button-tonal-icon-spacing: 8px;
  --mat-button-tonal-touch-target-size: 48px;
}
html {
  --mat-button-filled-container-color: white;
  --mat-button-filled-disabled-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-filled-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-filled-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-button-filled-focus-state-layer-opacity: 0.12;
  --mat-button-filled-hover-state-layer-opacity: 0.04;
  --mat-button-filled-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-filled-pressed-state-layer-opacity: 0.12;
  --mat-button-filled-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-filled-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-button-outlined-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-outlined-disabled-outline-color: rgba(0, 0, 0, 0.12);
  --mat-button-outlined-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-button-outlined-focus-state-layer-opacity: 0.12;
  --mat-button-outlined-hover-state-layer-opacity: 0.04;
  --mat-button-outlined-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-outlined-outline-color: rgba(0, 0, 0, 0.12);
  --mat-button-outlined-pressed-state-layer-opacity: 0.12;
  --mat-button-outlined-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-outlined-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-button-protected-container-color: white;
  --mat-button-protected-disabled-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-protected-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-protected-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-button-protected-focus-state-layer-opacity: 0.12;
  --mat-button-protected-hover-state-layer-opacity: 0.04;
  --mat-button-protected-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-protected-pressed-state-layer-opacity: 0.12;
  --mat-button-protected-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-protected-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-button-text-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-text-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-button-text-focus-state-layer-opacity: 0.12;
  --mat-button-text-hover-state-layer-opacity: 0.04;
  --mat-button-text-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-text-pressed-state-layer-opacity: 0.12;
  --mat-button-text-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-text-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-button-tonal-container-color: white;
  --mat-button-tonal-disabled-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-tonal-disabled-label-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-tonal-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-button-tonal-focus-state-layer-opacity: 0.12;
  --mat-button-tonal-hover-state-layer-opacity: 0.04;
  --mat-button-tonal-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-tonal-pressed-state-layer-opacity: 0.12;
  --mat-button-tonal-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-tonal-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-button.mat-primary,
.mat-mdc-unelevated-button.mat-primary,
.mat-mdc-raised-button.mat-primary,
.mat-mdc-outlined-button.mat-primary,
.mat-tonal-button.mat-primary {
  --mat-button-filled-container-color: #0dbb7d;
  --mat-button-filled-label-text-color: white;
  --mat-button-filled-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-filled-state-layer-color: white;
  --mat-button-outlined-label-text-color: #0dbb7d;
  --mat-button-outlined-outline-color: rgba(0, 0, 0, 0.12);
  --mat-button-outlined-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-button-outlined-state-layer-color: #0dbb7d;
  --mat-button-protected-container-color: #0dbb7d;
  --mat-button-protected-label-text-color: white;
  --mat-button-protected-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-protected-state-layer-color: white;
  --mat-button-text-label-text-color: #0dbb7d;
  --mat-button-text-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-button-text-state-layer-color: #0dbb7d;
  --mat-button-tonal-container-color: #0dbb7d;
  --mat-button-tonal-label-text-color: white;
  --mat-button-tonal-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-tonal-state-layer-color: white;
}
.mat-mdc-button.mat-accent,
.mat-mdc-unelevated-button.mat-accent,
.mat-mdc-raised-button.mat-accent,
.mat-mdc-outlined-button.mat-accent,
.mat-tonal-button.mat-accent {
  --mat-button-filled-container-color: #0dbb7d;
  --mat-button-filled-label-text-color: white;
  --mat-button-filled-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-filled-state-layer-color: white;
  --mat-button-outlined-label-text-color: #0dbb7d;
  --mat-button-outlined-outline-color: rgba(0, 0, 0, 0.12);
  --mat-button-outlined-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-button-outlined-state-layer-color: #0dbb7d;
  --mat-button-protected-container-color: #0dbb7d;
  --mat-button-protected-label-text-color: white;
  --mat-button-protected-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-protected-state-layer-color: white;
  --mat-button-text-label-text-color: #0dbb7d;
  --mat-button-text-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-button-text-state-layer-color: #0dbb7d;
  --mat-button-tonal-container-color: #0dbb7d;
  --mat-button-tonal-label-text-color: white;
  --mat-button-tonal-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-tonal-state-layer-color: white;
}
.mat-mdc-button.mat-warn,
.mat-mdc-unelevated-button.mat-warn,
.mat-mdc-raised-button.mat-warn,
.mat-mdc-outlined-button.mat-warn,
.mat-tonal-button.mat-warn {
  --mat-button-filled-container-color: #f44336;
  --mat-button-filled-label-text-color: white;
  --mat-button-filled-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-filled-state-layer-color: white;
  --mat-button-outlined-label-text-color: #f44336;
  --mat-button-outlined-outline-color: rgba(0, 0, 0, 0.12);
  --mat-button-outlined-ripple-color: color-mix(in srgb, #f44336 12%, transparent);
  --mat-button-outlined-state-layer-color: #f44336;
  --mat-button-protected-container-color: #f44336;
  --mat-button-protected-label-text-color: white;
  --mat-button-protected-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-protected-state-layer-color: white;
  --mat-button-text-label-text-color: #f44336;
  --mat-button-text-ripple-color: color-mix(in srgb, #f44336 12%, transparent);
  --mat-button-text-state-layer-color: #f44336;
  --mat-button-tonal-container-color: #f44336;
  --mat-button-tonal-label-text-color: white;
  --mat-button-tonal-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-button-tonal-state-layer-color: white;
}
html {
  --mat-button-filled-container-height: 36px;
  --mat-button-filled-touch-target-display: block;
  --mat-button-outlined-container-height: 36px;
  --mat-button-outlined-touch-target-display: block;
  --mat-button-protected-container-height: 36px;
  --mat-button-protected-touch-target-display: block;
  --mat-button-text-container-height: 36px;
  --mat-button-text-touch-target-display: block;
  --mat-button-tonal-container-height: 36px;
  --mat-button-tonal-touch-target-display: block;
}
html {
  --mat-icon-button-icon-size: 24px;
  --mat-icon-button-container-shape: 50%;
  --mat-icon-button-touch-target-size: 48px;
}
html {
  --mat-icon-button-disabled-icon-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-icon-button-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-icon-button-focus-state-layer-opacity: 0.12;
  --mat-icon-button-hover-state-layer-opacity: 0.04;
  --mat-icon-button-icon-color: inherit;
  --mat-icon-button-pressed-state-layer-opacity: 0.12;
  --mat-icon-button-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-icon-button-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-icon-button.mat-primary {
  --mat-icon-button-icon-color: #0dbb7d;
  --mat-icon-button-state-layer-color: #0dbb7d;
  --mat-icon-button-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
}
.mat-mdc-icon-button.mat-accent {
  --mat-icon-button-icon-color: #0dbb7d;
  --mat-icon-button-state-layer-color: #0dbb7d;
  --mat-icon-button-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
}
.mat-mdc-icon-button.mat-warn {
  --mat-icon-button-icon-color: #f44336;
  --mat-icon-button-state-layer-color: #f44336;
  --mat-icon-button-ripple-color: color-mix(in srgb, #f44336 12%, transparent);
}
html {
  --mat-icon-button-touch-target-display: block;
}
.mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 48px;
  --mat-icon-button-state-layer-size: 48px;
  width: var(--mat-icon-button-state-layer-size);
  height: var(--mat-icon-button-state-layer-size);
  padding: 12px;
}
html {
  --mat-fab-container-elevation-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-fab-container-shape: 50%;
  --mat-fab-touch-target-size: 48px;
  --mat-fab-extended-container-elevation-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-fab-extended-container-height: 48px;
  --mat-fab-extended-container-shape: 24px;
  --mat-fab-extended-focus-container-elevation-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-fab-extended-hover-container-elevation-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-fab-extended-pressed-container-elevation-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-fab-focus-container-elevation-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-fab-hover-container-elevation-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-fab-pressed-container-elevation-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-fab-small-container-elevation-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-fab-small-container-shape: 50%;
  --mat-fab-small-touch-target-size: 48px;
  --mat-fab-small-focus-container-elevation-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-fab-small-hover-container-elevation-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-fab-small-pressed-container-elevation-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);
}
html {
  --mat-fab-container-color: white;
  --mat-fab-disabled-state-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-fab-disabled-state-foreground-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-fab-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-fab-focus-state-layer-opacity: 0.12;
  --mat-fab-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-fab-hover-state-layer-opacity: 0.04;
  --mat-fab-pressed-state-layer-opacity: 0.12;
  --mat-fab-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-fab-small-container-color: white;
  --mat-fab-small-disabled-state-container-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-fab-small-disabled-state-foreground-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-fab-small-disabled-state-layer-color: rgba(0, 0, 0, 0.54);
  --mat-fab-small-focus-state-layer-opacity: 0.12;
  --mat-fab-small-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-fab-small-hover-state-layer-opacity: 0.04;
  --mat-fab-small-pressed-state-layer-opacity: 0.12;
  --mat-fab-small-ripple-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-fab-small-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-fab-state-layer-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-fab.mat-primary,
.mat-mdc-mini-fab.mat-primary {
  --mat-fab-container-color: #0dbb7d;
  --mat-fab-foreground-color: white;
  --mat-fab-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-fab-small-container-color: #0dbb7d;
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-fab-small-state-layer-color: white;
  --mat-fab-state-layer-color: white;
}
.mat-mdc-fab.mat-accent,
.mat-mdc-mini-fab.mat-accent {
  --mat-fab-container-color: #0dbb7d;
  --mat-fab-foreground-color: white;
  --mat-fab-ripple-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-fab-small-container-color: #0dbb7d;
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-fab-small-state-layer-color: white;
  --mat-fab-state-layer-color: white;
}
.mat-mdc-fab.mat-warn,
.mat-mdc-mini-fab.mat-warn {
  --mat-fab-container-color: #f44336;
  --mat-fab-foreground-color: white;
  --mat-fab-ripple-color: color-mix(in srgb, #f44336 12%, transparent);
  --mat-fab-small-container-color: #f44336;
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-ripple-color: color-mix(in srgb, white 12%, transparent);
  --mat-fab-small-state-layer-color: white;
  --mat-fab-state-layer-color: white;
}
html {
  --mat-fab-small-touch-target-display: block;
  --mat-fab-touch-target-display: block;
}
html {
  --mat-snack-bar-container-shape: 4px;
}
html {
  --mat-snack-bar-container-color: #424242;
  --mat-snack-bar-supporting-text-color: white;
  --mat-snack-bar-button-color: #56cfa4;
}
html {
  --mat-table-row-item-outline-width: 1px;
}
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-progress-spinner-active-indicator-width: 4px;
  --mat-progress-spinner-size: 48px;
}
html {
  --mat-progress-spinner-active-indicator-color: #0dbb7d;
}
.mat-accent {
  --mat-progress-spinner-active-indicator-color: #0dbb7d;
}
.mat-warn {
  --mat-progress-spinner-active-indicator-color: #f44336;
}
html {
  --mat-badge-container-shape: 50%;
  --mat-badge-container-size: unset;
  --mat-badge-small-size-container-size: unset;
  --mat-badge-large-size-container-size: unset;
  --mat-badge-legacy-container-size: 22px;
  --mat-badge-legacy-small-size-container-size: 16px;
  --mat-badge-legacy-large-size-container-size: 28px;
  --mat-badge-container-offset: -11px 0;
  --mat-badge-small-size-container-offset: -8px 0;
  --mat-badge-large-size-container-offset: -14px 0;
  --mat-badge-container-overlap-offset: -11px;
  --mat-badge-small-size-container-overlap-offset: -8px;
  --mat-badge-large-size-container-overlap-offset: -14px;
  --mat-badge-container-padding: 0;
  --mat-badge-small-size-container-padding: 0;
  --mat-badge-large-size-container-padding: 0;
}
html {
  --mat-badge-background-color: #0dbb7d;
  --mat-badge-text-color: white;
  --mat-badge-disabled-state-background-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-badge-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
}
.mat-badge-accent {
  --mat-badge-background-color: #0dbb7d;
  --mat-badge-text-color: white;
}
.mat-badge-warn {
  --mat-badge-background-color: #f44336;
  --mat-badge-text-color: white;
}
html {
  --mat-bottom-sheet-container-shape: 4px;
}
html {
  --mat-bottom-sheet-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-bottom-sheet-container-background-color: white;
}
html {
  --mat-button-toggle-focus-state-layer-opacity: 0.12;
  --mat-button-toggle-hover-state-layer-opacity: 0.04;
  --mat-button-toggle-legacy-focus-state-layer-opacity: 1;
  --mat-button-toggle-legacy-height: 36px;
  --mat-button-toggle-legacy-shape: 2px;
  --mat-button-toggle-shape: 4px;
}
html {
  --mat-button-toggle-background-color: white;
  --mat-button-toggle-disabled-selected-state-background-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-toggle-disabled-selected-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-toggle-disabled-state-background-color: white;
  --mat-button-toggle-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-toggle-divider-color: rgba(0, 0, 0, 0.12);
  --mat-button-toggle-legacy-disabled-selected-state-background-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-toggle-legacy-disabled-state-background-color: white;
  --mat-button-toggle-legacy-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-button-toggle-legacy-selected-state-background-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-toggle-legacy-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-toggle-legacy-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-toggle-legacy-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-toggle-selected-state-background-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-button-toggle-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-button-toggle-text-color: rgba(0, 0, 0, 0.87);
}
html {
  --mat-button-toggle-height: 48px;
}
html {
  --mat-datepicker-calendar-container-shape: 4px;
  --mat-datepicker-calendar-container-touch-shape: 4px;
  --mat-datepicker-calendar-container-elevation-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-datepicker-calendar-container-touch-elevation-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);
}
html {
  --mat-datepicker-calendar-date-in-range-state-background-color: color-mix(in srgb, #0dbb7d 20%, transparent);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: color-mix(in srgb, #0dbb7d 20%, transparent);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #0dbb7d;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: color-mix(in srgb, #0dbb7d 38%, transparent);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-datepicker-calendar-date-hover-state-background-color: color-mix(in srgb, #0dbb7d 4%, transparent);
  --mat-datepicker-toggle-active-state-icon-color: #0dbb7d;
  --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-text-color: rgba(0, 0, 0, 0.87);
  --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.54);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-range-input-separator-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-range-input-disabled-state-separator-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-range-input-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --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-toggle-active.mat-accent {
  --mat-datepicker-calendar-date-in-range-state-background-color: color-mix(in srgb, #0dbb7d 20%, transparent);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: color-mix(in srgb, #0dbb7d 20%, transparent);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #0dbb7d;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: color-mix(in srgb, #0dbb7d 38%, transparent);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: color-mix(in srgb, #0dbb7d 12%, transparent);
  --mat-datepicker-calendar-date-hover-state-background-color: color-mix(in srgb, #0dbb7d 4%, transparent);
  --mat-datepicker-toggle-active-state-icon-color: #0dbb7d;
  --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-text-color: rgba(0, 0, 0, 0.87);
  --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.54);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-range-input-separator-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-range-input-disabled-state-separator-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-range-input-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-calendar-container-background-color: white;
  --mat-datepicker-calendar-container-text-color: rgba(0, 0, 0, 0.87);
}
.mat-datepicker-content.mat-warn,
.mat-datepicker-toggle-active.mat-warn {
  --mat-datepicker-calendar-date-in-range-state-background-color: color-mix(in srgb, #f44336 20%, transparent);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: color-mix(in srgb, #0dbb7d 20%, transparent);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
  --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: color-mix(in srgb, #f44336 38%, transparent);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: color-mix(in srgb, #f44336 12%, transparent);
  --mat-datepicker-calendar-date-hover-state-background-color: color-mix(in srgb, #f44336 4%, transparent);
  --mat-datepicker-toggle-active-state-icon-color: #f44336;
  --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-text-color: rgba(0, 0, 0, 0.87);
  --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.54);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-range-input-separator-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-range-input-disabled-state-separator-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-range-input-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --mat-datepicker-calendar-container-background-color: white;
  --mat-datepicker-calendar-container-text-color: rgba(0, 0, 0, 0.87);
}
.mat-calendar-controls {
  --mat-icon-button-touch-target-display: none;
}
.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 40px;
  --mat-icon-button-state-layer-size: 40px;
  width: var(--mat-icon-button-state-layer-size);
  height: var(--mat-icon-button-state-layer-size);
  padding: 8px;
}
html {
  --mat-divider-width: 1px;
}
html {
  --mat-divider-color: rgba(0, 0, 0, 0.12);
}
html {
  --mat-expansion-container-shape: 4px;
  --mat-expansion-container-elevation-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-expansion-legacy-header-indicator-display: inline-block;
  --mat-expansion-header-indicator-display: none;
}
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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-expansion-header-focus-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --mat-expansion-header-disabled-state-text-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 38%, transparent);
  --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: #0dbb7d;
}
.mat-icon.mat-accent {
  --mat-icon-color: #0dbb7d;
}
.mat-icon.mat-warn {
  --mat-icon-color: #f44336;
}
html {
  --mat-sidenav-container-shape: 0;
  --mat-sidenav-container-elevation-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-sidenav-container-width: auto;
}
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-focus-state-layer-shape: 0;
  --mat-stepper-header-hover-state-layer-shape: 0;
}
html {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #0dbb7d;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #0dbb7d;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #0dbb7d;
  --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: color-mix(in srgb, rgba(0, 0, 0, 0.87) 4%, transparent);
  --mat-stepper-header-focus-state-layer-color: color-mix(in srgb, rgba(0, 0, 0, 0.87) 12%, transparent);
  --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;
}
.mat-step-header.mat-accent {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #0dbb7d;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #0dbb7d;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #0dbb7d;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
.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-sort-arrow-color: rgba(0, 0, 0, 0.87);
}
html {
  --mat-toolbar-container-background-color: white;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}
.mat-toolbar.mat-primary {
  --mat-toolbar-container-background-color: #0dbb7d;
  --mat-toolbar-container-text-color: white;
}
.mat-toolbar.mat-accent {
  --mat-toolbar-container-background-color: #0dbb7d;
  --mat-toolbar-container-text-color: white;
}
.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-tree-container-background-color: white;
  --mat-tree-node-text-color: rgba(0, 0, 0, 0.87);
}
html {
  --mat-tree-node-min-height: 48px;
}
html {
  --mat-timepicker-container-shape: 4px;
  --mat-timepicker-container-elevation-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);
}
html {
  --mat-timepicker-container-background-color: white;
}

/* src/assets/css/font.css */
@font-face {
  font-family: "gilroy-bold";
  src: url("./media/Gilroy-Bold-X4QFITK3.WOFF") format("woff");
}
@font-face {
  font-family: "gilroy-medium";
  src: url("./media/Gilroy-Medium-AGQWHBQ7.WOFF") format("woff");
}
@font-face {
  font-family: "gilroy-regular";
  src: url("./media/Gilroy-Regular-6SOF6EZA.WOFF") format("woff");
}
@font-face {
  font-family: "gilroy-semi-bold";
  src: url("./media/Gilroy-SemiBold-7FCPNTLM.WOFF") format("woff");
}
@font-face {
  font-family: "gilroy-light";
  src: url("./media/Gilroy-Light-EVXMDGGI.WOFF") format("woff");
}
@font-face {
  font-family: "gilroy-ultra-light";
  src: url("./media/Gilroy-UltraLight-F33YL4TK.woff") format("woff");
}
@font-face {
  font-family: "gilroy-light-italic";
  src: url("./media/Gilroy-LightItalic-53TNQ3ZB.WOFF") format("woff");
}
@font-face {
  font-family: text-security-disc;
  src: url(https://raw.githubusercontent.com/noppa/text-security/master/dist/text-security-disc.woff);
}
@font-face {
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  src: url("./media/material-icons-X6JW33VP.woff2") format("woff2");
}

/* src/assets/css/filter.css */
.filter-container {
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 12px 20px 12px 8px;
  padding: 4px 16px 4px 0;
  overflow-y: hidden;
}
.filter-container.filter-container-new {
  margin: 0;
  padding: 0 !important;
  gap: 8px;
}
.filter-container.filter-container-column {
  align-items: flex-start;
}
.filter-container .filter > button {
  height: 32px;
  padding: 8px 12px !important;
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  place-content: center;
  align-items: center;
  background-color: transparent;
  font-size: 12px !important;
  margin-left: 5px;
}
.filter.pill-filled > button {
  background-color: #ECF5FD !important;
  border-radius: 32px !important;
  border: 1px solid var(--blue) !important;
}
.filter-container.filter-container-new .filter > button {
  height: auto !important;
  padding: 0 !important;
  margin-left: 0 !important;
}
.filter-container .filter > button:hover,
.filter-container .filter > button.active {
  color: var(--mat-button-text-label-text-color);
}
.filter-container .filter > button [svgIcon=arrowDropDownIcon] {
  transform: rotate(270deg);
}
.filter-container .filter > button.active [svgIcon=arrowDropDownIcon] {
  transform: rotate(0deg);
}
.filter .mat-mdc-menu-trigger.mat-mdc-button .mdc-button__label {
  display: flex;
}
.filter-selected-text {
  margin-left: 5px;
  font-family: gilroy-bold;
  display: inline-block;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.filter-selected-text.marketSectorwidth {
  max-width: unset !important;
}
.filter-selected-text > span:not(:last-child) {
  margin-right: 5px;
}
.filter-container:not(.filter-container-new) .filter > button .mat-icon {
  margin-left: 8px;
}
.reset-filter {
  text-align: center !important;
  color: var(--green-blue) !important;
  font-size: 14px !important;
  font-family: gilroy-semi-bold !important;
}
.reset-filter .mat-mdc-menu-item-text {
  border-bottom: 1px solid var(--color-divider);
  border-radius: 2px;
}
.mat-mdc-menu-item.apply-filter:not([disabled]) {
  background-color: var(--color-button-primary);
  color: var(--color-white);
  text-align: center;
  width: calc(100% - 8px);
  margin: 4px;
  font-family: gilroy-semi-bold !important;
  font-size: 14px !important;
  border-radius: 4px;
}
.mat-mdc-menu-item.apply-filter:not([disabled]):hover {
  background-color: var(--green-blue2);
}
.mat-mdc-menu-item.filter-option {
  padding: 0;
}
.mat-mdc-menu-item.filter-option .mat-mdc-checkbox,
.mat-mdc-menu-item.filter-option .mdc-list-item__primary-text,
.mat-mdc-menu-item.filter-option .mdc-form-field,
.mat-mdc-menu-item.filter-option .mdc-form-field > label {
  width: 100%;
  align-items: center;
  line-height: 1.3;
  display: flex;
  flex-direction: row;
}
.filter-option .mdc-form-field,
.filter-option.single-selectable-option {
  width: 100%;
  padding: 0 8px 0 4px;
}
.filter-option .mat-checkbox-layout .mat-checkbox-label {
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  flex: 1;
}
.filter-option.single-selectable-option {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 8px;
}
.filter-option.single-selectable-option.active {
  color: var(--cool-green);
}
.filter-option.single-selectable-option i {
  font-size: 18px;
  margin-right: 8px;
  visibility: hidden;
}
.filter-option.single-selectable-option .check {
  margin-right: 0;
  visibility: hidden;
}
.filter-option.single-selectable-option.active i,
.filter-option.single-selectable-option.active .check {
  visibility: visible;
}
.filter-menu-content {
  max-height: 400px;
  overflow: auto;
}
.filter-menu-content.date-range-filter-menu-content,
.filter-menu-content-large.filter-menu-content {
  max-height: calc(100% - 81px);
}
.filter-applied .page-container,
.filter-applied.page-wrapper,
.filter-applied.page-container {
  padding-top: 0px;
}
.filter-applied.multiple-filter-container .filter-container {
  padding-bottom: 0px;
  padding-top: 12px;
}
.filter-applied.multiple-filter-container .page-container {
  padding-top: 12px;
}
.filter-container.multiple-filter-row:not(.show-filter) .filter {
  display: none;
}
.filter-menu-search {
  padding: 8px 16px;
}
.filter-menu-search .input-search {
  min-width: 220px;
}
.filter-container .filter .mat-icon .fill-here {
  fill: var(--medium-gray);
}
.filter-container .filter > button.active .mat-icon .fill-here {
  fill: var(--green-blue2);
}
.filter-menu-group-container {
  padding: 8px 0px;
}
.filter-menu-group-container .filter-group-name {
  margin: 8px;
  color: var(--medium-gray);
}
.filter-option-empty-message {
  padding: 16px;
  text-align: center !important;
  display: flex;
  color: var(--medium-gray);
}
.filter-options.mat-mdc-menu-panel {
  max-height: calc(100vh - 48px) !important;
  min-height: 150px;
  min-width: 200px;
}
.filter-option.mat-mdc-menu-item:has(.mat-mdc-checkbox),
.filter-option.mat-mdc-menu-item.mdc-list-item:has(.mat-mdc-checkbox),
.filter-container:not(.filter-container-new) .filter-menu-content .mat-mdc-menu-item:has(.mat-mdc-checkbox),
.filter-menu-content .mat-mdc-menu-item.mdc-list-item:has(.mat-mdc-checkbox) {
  padding: 0;
}
.filter-option .mat-mdc-menu-item.filter-option .mdc-list-item__primary-text {
  padding-left: 0;
}
.filter-options .reset-filter.mat-mdc-menu-item.mdc-list-item,
.filter-options .reset-filter.mat-mdc-menu-item.mdc-list-item .mdc-list-item__primary-text,
.filter-options .apply-filter.mat-mdc-menu-item.mdc-list-item,
.filter-options .apply-filter.mat-mdc-menu-item.mdc-list-item .mdc-list-item__primary-text {
  align-items: center;
  justify-content: center;
}
.priority-filter-icon {
  width: 5px !important;
  height: 5px !important;
  margin: 0 4px;
}
.menu-date-range .mdc-radio__background {
  top: 0px;
}
.menu-date-range .mat-mdc-radio-button {
  line-height: normal;
}
.resource-filter-options .mat-mdc-menu-content {
  min-width: 298px;
}
#dtCloudApp .reset-filter.mat-mdc-menu-item.mdc-list-item .mat-mdc-menu-item-text {
  color: inherit;
  display: flex;
  flex-direction: row;
  align-items: center;
  white-space: normal;
  width: 100%;
}
.reset-filter .mat-mdc-menu-item-text {
  justify-content: center !important;
}
.apply-filter .mat-mdc-menu-item-text {
  justify-content: center !important;
}
.filter-option.single-selectable-option .mat-mdc-menu-item-text {
  justify-content: start !important;
  gap: 0px !important;
}
.filter.filterText .mat-mdc-menu-trigger.mat-mdc-button .mdc-button__label,
.filter.filterText .mat-mdc-menu-trigger.mat-mdc-button .mdc-button__label .filter-selected-text {
  font-family: gilroy-semi-bold !important;
  font-size: 13px;
  line-height: 16px;
  display: flex;
  align-items: center;
  color: #01162F;
}
.filter.filterText .mat-icon {
  min-height: 12px;
  min-width: 12px;
  max-height: 12px;
  max-width: 12px;
}
.filter-option .priority-filter-icon {
  margin: 0px;
}
.date-filter-menu.mat-mdc-menu-panel {
  max-width: 560px;
  height: 510px;
  border-radius: 12px;
}
.date-filter-menu .mat-mdc-menu-item-text {
  font-size: 16px !important;
  font-family: gilroy-regular;
}
.date-range-filter .mat-mdc-form-field-infix {
  width: 120px !important;
}
.import-dropdown .ng-dropdown-panel .ng-dropdown-panel-items:hover::-webkit-scrollbar {
  background-color: white !important;
  visibility: visible !important;
}

/* src/assets/css/kanban.css */
.kanban-overflow-wrapper {
  display: flex;
  overflow-y: hidden;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}
.kanban-overflow-wrapper .kanban-container {
  display: flex;
  flex-direction: column;
  background-color: #ecf0f4;
  margin-right: 10px;
  margin-left: 5px;
  padding: 0 0 5px;
  padding-right: 0;
  max-height: 100%;
}
.kanban-overflow-wrapper .kanban-container:last-child {
  margin-right: 0;
}
.kanban-overflow-wrapper .kanban-container .kanban-column {
  overflow: hidden;
  box-sizing: border-box;
  border-radius: 2.5px;
  border: solid 0.5px rgba(151, 151, 151, 0.05);
  padding: 12px 0 5px;
  min-height: 67px;
  max-height: 67px;
  min-width: 273px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.kanban-overflow-wrapper .kanban-container .kanban-column .kanban-stage-title {
  text-align: center;
  font-family: gilroy-semi-bold;
  opacity: 0.6;
  font-size: 14px;
  color: var(--navy);
  margin-bottom: 7px;
}
.kanban-overflow-wrapper .kanban-container .kanban-column .kanban-stage-title .stg-num {
  font-family: gilroy-regular;
}
.kanban-overflow-wrapper .kanban-container .kanban-column .kanban-stage-sub-title {
  text-align: center;
  opacity: .5;
  font-family: gilroy-regular;
  font-size: 14px;
  color: var(--navy);
  margin-bottom: 7px;
}
.kanban-overflow-wrapper .kanban-container .kanban-column .kanban-column-sort {
  position: absolute;
  right: 0;
}
.kanban-overflow-wrapper .kanban-container .kanban-column .kanban-column-sort mat-icon {
  margin: 0 !important;
}
.mat-mdc-menu-panel.sort-column .mat-mdc-menu-content .active {
  background: var(--light-gray2);
}
.kanban-overflow-wrapper .kanban-container .kanban-column .kanban-datePeriods mat-select {
  background-color: inherit;
  border: none;
  box-shadow: none;
  text-align: center;
  margin-top: -6px;
  height: 30px;
  font-family: gilroy-semi-bold;
  font-size: 14px;
}
.kanban-overflow-wrapper .kanban-container .kanban-button.mat-mdc-button.primary {
  margin-right: 8px !important;
  margin-bottom: 8px;
  min-height: 29px;
  margin-left: 3px !important;
  width: 100%;
}
.kanban-overflow-wrapper .kanban-container .kanban-button.mat-mdc-button.primary mat-icon {
  margin-right: 5px;
  opacity: 0.7;
  height: 20px;
  width: 20px;
}
.kanban-overflow-wrapper .kanban-container .kanban-button.mat-mdc-button.primary mat-icon[svgicon=addIcon] {
  opacity: 1;
}
.kanban-button.mat-mdc-button.primary.opp-btn:after {
  content: "";
  right: 0;
  position: absolute;
  height: calc(100% - 10px);
  color: white;
  z-index: 2;
  border-right: 1px solid;
}
.kanban-overflow-wrapper .kanban-container .kanban-list {
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  overflow: auto;
  overflow-x: hidden;
  min-height: 60px;
  background: white;
  border-radius: 2.5px;
  max-height: calc(100% - 65px);
  background-color: inherit;
}
.kanban-box {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 12px;
  background: white;
  font-size: 14px;
  margin-bottom: 8px;
  border-radius: 4px;
  margin-right: 5px;
  margin-left: 5px;
  width: 268px;
  box-shadow: 0px 0px 4px rgb(1 22 47 / 16%);
}
.kanban-box:not(.cdk-drag-preview) {
  cursor: grab;
}
.kanban-box:active,
.cdk-drop-list-dragging {
  cursor: grabbing;
}
.kanban-overflow-wrapper .kanban-container .kanban-list .kanban-box.archived-box {
  min-height: 152px;
}
.kanban-box.cdk-drag-preview {
  min-width: 262px;
}
.kanban-overflow-wrapper .kanban-container .kanban-list .kanban-box:last-child,
.kanban-box.cdk-drag-preview:last-child {
  margin-bottom: 0;
}
.kanban-overflow-wrapper .kanban-container .kanban-list .kanban-box > *,
.kanban-box.cdk-drag-preview > * {
  width: 100%;
  width: -webkit-fill-available;
}
.kanban-overflow-wrapper .kanban-container .kanban-list .kanban-wrap-info {
  padding: 8px;
  background-color: transparent;
  border: solid 1px var(--silver);
  border-radius: 4px;
  display: flex;
  align-items: center;
  margin-right: 5px;
  margin-left: 5px;
  width: 268px;
}
.kanban-overflow-wrapper .kanban-container .kanban-list .kanban-wrap-info > * {
  opacity: 0.6;
}
.kanban-overflow-wrapper .kanban-container .kanban-list .kanban-wrap-info mat-icon {
  margin-right: 5px;
  margin-left: 8px;
  opacity: .35;
}
.kanban-overflow-wrapper .kanban-container .kanban-list.cdk-drop-list-dragging .kanban-wrap-info {
  display: none;
}
.kanban-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
}
.kanban-block > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.kanban-block > div.flex-align-start {
  align-items: flex-start;
}
.kanban-footer-block mat-icon {
  max-width: 11px;
  max-height: 11px;
  min-height: 11px;
  min-width: 11px;
  margin-right: 5px;
  cursor: default;
  opacity: 1 !important;
}
.status-kanban .kanban-footer-block .resource-avatars mat-icon {
  max-width: 24px !important;
  max-height: 24px !important;
  min-height: 24px !important;
  min-width: 24px !important;
}
.kanban-footer-block > * {
  margin-right: 10px;
  display: flex;
  align-items: center;
  font-size: 11px;
  color: var(--cool-grey);
}
.kanban-footer-block > *:last-child {
  margin-right: 0;
}
.kanban-block .show-on-hover {
  visibility: hidden;
  position: absolute;
  right: 0;
  background-color: white;
}
.kanban-block .show-on-hover > button {
  width: 22px;
  height: 20px;
  line-height: 0;
  padding: 0 0 0 5px;
}
.kanban-box:hover .kanban-block .show-on-hover {
  visibility: visible;
}
.kanban-box.cdk-drag-preview .kanban-block .show-on-hover {
  visibility: hidden;
}
.kanban-block .title {
  font-size: 16px;
  font-family: gilroy-semi-bold;
  margin-right: 5px;
  line-height: 18px;
  max-width: 175px;
  overflow: hidden;
}
.kanban-block .secondary-text {
  font-size: 14px;
}
.kanban-block .kanban-date-block,
.kanban-block .kanban-date-block .secondary-text {
  font-size: 12px;
}
.kanban-block .number {
  color: var(--cool-grey);
  white-space: nowrap;
  margin-right: 5px;
  font-size: 13px;
  font-family: gilroy-medium;
}
.kanban-list.cdk-drop-list-dragging .kanban-box:not(.cdk-drag-placeholder) {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.kanban-box.cdk-drag-preview {
  box-sizing: border-box;
  border-radius: 4px;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, 0.2),
    0 8px 10px 1px rgba(0, 0, 0, 0.14),
    0 3px 14px 2px rgba(0, 0, 0, 0.12);
  width: fit-content !important;
  height: fit-content !important;
}
.kanban-box.cdk-drag-placeholder {
  opacity: 0.1;
  background-color: var(--navy) !important;
}
.kanban-box.cdk-drag-placeholder .status-probability {
  visibility: hidden;
}
.kanban-box.cdk-drag-placeholder:hover .kanban-block .show-on-hover {
  visibility: hidden;
}
.kanban-box.cdk-drag-placeholder > * {
  visibility: hidden;
}
.cdk-drag-animating {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.kanban-box.cdk-drop-list-dragging .kanban-box:not(.cdk-drag-placeholder) {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.kanban-datePeriods .mat-mdc-select-panel .mat-mdc-optgroup-label,
.mat-mdc-select-panel .mat-mdc-option.custom-height {
  height: 35px;
}
.kanban-datePeriods .mat-mdc-select-panel .mat-mdc-optgroup-label,
.mat-mdc-select-panel .mat-mdc-option.custom-height.with-divider::after {
  top: calc(35px - 2px);
}
.kanban-overflow-wrapper .kanban-container .kanban-button.mat-mdc-button.primary {
  margin-right: 0px !important;
  margin-bottom: 8px;
  min-height: 29px;
  margin-left: 0px !important;
  color: var(--white);
  background-color: var(--green-blue2);
  border: 1px solid #03ad71;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .06);
  font-family: gilroy-bold;
  box-sizing: border-box;
}
.kanban-date-gap {
  line-height: 28px;
  font-size: 12px;
  color: var(--medium-gray);
}
.on-dropped {
  opacity: .2;
}
.kanban-overflow-wrapper.status-kanban .kanban-container .kanban-column .kanban-stage-title {
  opacity: 1;
  color: inherit;
  font-size: 16px;
}
.kanban-overflow-wrapper.status-kanban .kanban-container .kanban-column .kanban-stage-sub-title,
.kanban-overflow-wrapper.status-kanban .kanban-container .kanban-column .header-mat-select,
.kanban-overflow-wrapper.status-kanban .kanban-container .kanban-column .kanban-datePeriods mat-select {
  opacity: 1;
  color: inherit;
}
.status-kanban .kanban-container .kanban-column {
  border-radius: 8px 8px 0px 0px;
  margin-bottom: 5px;
  padding: 5px 5px;
  min-height: unset;
  max-height: unset;
  overflow: unset;
  align-items: flex-start;
  padding-left: 15px;
}
.status-kanban .kanban-container .kanban-column.wonOpp {
  padding-bottom: 1px;
}
.kanban-column.wonOpp .kanban-stage-sub-title {
  top: -3px;
  position: relative;
}
.status-kanban .kanban-container {
  border-radius: 8px 8px 8px 8px;
  height: fit-content;
}
.status-kanban .group-divider {
  height: 4px;
  border-radius: 8px;
  padding: 0;
  margin: 5px;
}
.status-kanban .group-name {
  color: var(--navy);
  font-size: 16px;
  text-align: center;
  min-width: 100%;
  font-family: gilroy-regular;
}
.status-kanban .empty-stage {
  height: 106px;
  text-align: center;
  border: none !important;
  border-radius: 0px 0px 8px 8px !important;
  line-height: 18px;
}
.status-kanban .kanban-container [svgIcon=group-filter] {
  display: none;
}
.status-kanban .kanban-container:hover [svgIcon=group-filter] {
  display: block;
}
.status-kanban .kanban-container .kanban-column .kanban-datePeriods mat-select {
  text-align: left !important;
  padding: 0 !important;
}
.status-kanban .kanban-container .kanban-column .kanban-datePeriods .mat-mdc-select:active,
.status-kanban .kanban-container .kanban-column .kanban-datePeriods .mat-mdc-select:focus,
.status-kanban .kanban-container .kanban-column .kanban-datePeriods .mat-mdc-select:hover {
  background-color: transparent !important;
  border: transparent !important;
}
.status-kanban .kanban-container .kanban-column .kanban-datePeriods .mat-mdc-select .mat-mdc-select-value {
  width: auto !important;
  overflow: visible;
  font-family: gilroy-regular;
  font-size: 16px;
}
.status-kanban .kanban-container .kanban-column .kanban-datePeriods.customLabel-kanban .mat-mdc-select .mat-mdc-select-value .stage-name,
.status-kanban .kanban-container .kanban-column .kanban-datePeriods.customLabel-kanban .mat-mdc-select .mat-mdc-select-value .period-text {
  font-family: gilroy-semi-bold;
}
.status-kanban button.primary-icon-button .mdc-button__label {
  width: 100%;
}
.count-seperator-dot {
  height: 4px;
  width: 4px;
  display: inline-block;
  background-color: currentColor;
  margin: auto 8px;
  border-radius: 50%;
  vertical-align: middle;
}

/* src/assets/css/mat-select.css */
.mat-mdc-select.width-auto {
  width: auto;
}
.dt-select.cdk-overlay-pane {
  max-width: unset !important;
}
.mat-mdc-select.width-auto .mat-select-value {
  width: auto;
  max-width: 100%;
}
.mat-mdc-select-panel .mat-mdc-option {
  font-family: gilroy-regular;
  font-size: 14px !important;
  color: var(--navy);
  padding: 0 16px;
  min-height: 32px;
}
.mat-mdc-select-panel .mat-mdc-option.with-tick {
  padding-left: 16px;
}
.mat-mdc-option.mat-active {
  background: rgba(0, 122, 204, 0.08);
}
.mat-mdc-option.mat-selected:not(.mat-mdc-option-multiple):not(.mat-option-disabled) {
  background: rgba(0, 122, 204, 0.08);
}
.mat-primary .mat-mdc-option.mat-selected:not(.mat-option-disabled) {
  color: var(--navy);
}
.mat-primary .mat-mdc-option.mat-selected-green.mat-selected:not(.mat-option-disabled) {
  color: var(--cool-green) !important;
}
.mat-primary .mat-mdc-option.with-tick.mat-selected:not(.mat-option-disabled) {
  background-image: url("./media/check-ZXF7W225.svg");
  background-repeat: no-repeat;
  background-position-y: center;
  background-size: 16px;
  background-position-x: 3px;
}
.mat-primary .mat-mdc-option.with-divider:after {
  content: "";
  width: 100%;
  border-bottom: solid 2px var(--silver);
  opacity: 0.45;
  position: absolute;
  left: 0;
  z-index: 1;
  top: calc(3em - 2px);
}
#dtCloudApp .mat-mdc-select-panel.accessory-option mat-option.mat-mdc-option {
  height: unset;
  max-height: 110px;
  line-height: 1.5em;
}
#dtCloudApp .mat-option-text.mat-option-text {
  white-space: normal;
}
#dtCloudApp .mat-mdc-select-panel .mat-mdc-optgroup-label {
  color: var(--medium-gray);
  letter-spacing: 0.6;
  font-size: 10px;
  font-family: "gilroy-semi-bold";
  text-transform: uppercase;
  min-height: 30px;
}
#dtCloudApp .dt-mat-select.line-clamp-2 .mat-mdc-option {
  height: auto;
  line-height: normal;
  max-height: 48px;
  min-height: 48px;
  border-bottom: 1px solid var(--silver);
}
#dtCloudApp .dt-mat-select.line-clamp-2:hover {
  overflow: auto;
}
#dtCloudApp .dt-mat-select.line-clamp-2 .mat-mdc-option .mat-option-text {
  flex-direction: column;
  display: flex;
}
.paginator-select.mat-mdc-form-field .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix {
  width: fit-content;
}
#dtCloudApp .ng-select .ng-select-container,
#dtCloudApp .ng-select.ng-select-single .ng-select-container {
  height: 33px;
  border: 1px solid var(--silver);
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
}
#dtCloudApp .ng-select.xs-input .ng-select-container,
#dtCloudApp .ng-select.ng-select-single.xs-input .ng-select-container {
  height: 40px;
  font-size: 16px;
}
#dtCloudApp .suggested-info .ng-select .ng-select-container {
  border: 1px solid var(--blue);
}
#dtCloudApp .ng-dropdown-panel {
  box-sizing: border-box;
  border: 1px solid var(--color-divider-dark);
  border-radius: 4px;
  background-color: var(--white);
  box-shadow: 0 2px 12px 0 rgba(1, 22, 47, 0.16) !important;
}
#dtCloudApp .ng-select.auto-grow .ng-dropdown-panel {
  width: max-content !important;
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 310px;
  width: 100%;
}
#dtCloudApp .todoClientdd .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 90px;
  width: 100%;
}
#dtCloudApp .brand-dropdown .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 153px;
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup {
  font-weight: unset;
  text-transform: uppercase;
  color: var(--medium-gray);
  font-family: gilroy-semi-bold;
  font-size: 10px;
  letter-spacing: 0.6px;
}
.ng-select .sub-info {
  font-size: 12px;
  color: var(--medium-gray);
  margin-top: 2px;
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:not(.ng-option-disabled) {
  color: var(--ng-option-text-color);
  font-family: var(--ng-option-text-font);
  font-size: var(--ng-option-text-font-size);
  font-weight: unset;
  letter-spacing: 0;
  background-color: var(--color-white);
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked:hover,
#dtCloudApp .todoClientdd .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked,
#dtCloudApp .todoClientdd .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.keyboard-active {
  background-color: rgba(0, 122, 204, 0.08);
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected {
  color: var(--ng-option-selected-text-color);
  font-family: var(--ng-option-selected-text-font);
}
#dtCloudApp .ng-dropdown-panel.ng-select-top,
#dtCloudApp .mat-mdc-menu-panel.btn-more-menu.mat-menu-above,
#dtCloudApp .mat-mdc-menu-panel.menu-panel-top-padding.mat-menu-above,
#dtCloudApp .mat-mdc-menu-panel.btn-with-more-btn.mat-menu-above {
  margin-bottom: 8px !important;
}
#dtCloudApp .ng-dropdown-panel.ng-select-bottom,
#dtCloudApp .mat-mdc-menu-panel.btn-more-menu.mat-menu-below,
#dtCloudApp .mat-mdc-menu-panel.menu-panel-top-padding.mat-menu-below,
#dtCloudApp .mat-mdc-menu-panel.btn-with-more-btn.mat-menu-below {
  margin-top: 8px !important;
}
#dtCloudApp .ng-select .ng-select-container .ng-value-container .ng-placeholder {
  color: var(--medium-gray);
  font-family: gilroy-regular;
  font-size: 14px;
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
  min-height: 32px;
  white-space: normal !important;
  padding: 8px 16px !important;
  min-width: fit-content;
  text-align: justify;
}
#dtCloudApp .ng-select.ng-select-focused:not(.ng-select-opened) > .ng-select-container {
  border: 1px solid var(--silver);
  box-shadow: inset 0 1px 4px 0 rgba(87, 41, 41, 0.06);
  border-color: var(--silver);
}
#dtCloudApp .mat-mdc-checkbox .mat-checkbox-ripple {
  height: auto !important;
  width: auto !important;
}
.ng-select-info {
  font-size: 11px;
  margin-top: 5px;
  white-space: pre-wrap;
  color: var(--cool-grey);
  min-width: 150px;
}
.left-minus-68 .ng-dropdown-panel {
  left: -68px;
}
#dtCloudApp .place-holder-navy.ng-select .ng-select-container .ng-value-container .ng-placeholder {
  color: var(--navy);
}
#dtCloudApp .ng-select .ng-select-container {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 13px;
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label {
  font-weight: unset;
}
#dtCloudApp .ng-dropdown-panel .ng-dropdown-panel-items .disabled2 {
  color: red;
  text-decoration: line-through;
  cursor: not-allowed;
}
#dtCloudApp .ng-dropdown-panel.supplier-select.append-body {
  margin-top: 1px;
  margin-left: 9px;
  width: 300px !important;
}
#dtCloudApp .ng-select.height-27 .ng-select-container {
  height: 27px !important;
}
#dtCloudApp .ng-select.height-48 .ng-select-container {
  height: 48px !important;
}
.ng-select .ng-select-container .ng-value-container .ng-input > input {
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
}
#dtCloudApp .no-margin .ng-select.custom-select,
.mat-mdc-select.no-margin {
  margin: 0 !important;
}
.ng-select.no-border .ng-select-container {
  border: unset;
  box-shadow: none;
}
#dtCloudApp .ng-select.no-border .ng-select-container,
#dtCloudApp .ng-select.no-border.ng-select-focused:not(.ng-select-opened) > .ng-select-container,
#dtCloudApp .ng-select.no-border.ng-select-opened > .ng-select-container {
  border: unset;
  box-shadow: none;
  background: transparent;
}
#dtCloudApp .no-margin-top .ng-select.custom-select {
  margin-top: 0px !important;
}
.ng-select.use-full-width .ng-dropdown-panel .ng-dropdown-header {
  width: 100%;
}
#dtCloudApp .mat-mdc-form-field-type-mat-select.mat-mdc-select-form-field .mat-mdc-form-field-infix {
  padding-bottom: 8px;
}
.input-with-ng-select .mat-mdc-text-field-wrapper {
  z-index: 1;
}
.supplier-select-container .supplier-select .ng-dropdown-panel-items {
  min-height: 80px;
}
.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input {
  top: 8px !important;
}
#dtCloudApp .ng-select.theme-green .ng-select-container {
  border-color: var(--color-button-primary) !important;
  border-radius: 8px !important;
}
.ng-select.theme-green .ng-arrow-wrapper .ng-arrow {
  border-color: var(--color-button-primary) transparent transparent !important;
}
.ng-select.theme-green.ng-select-opened > .ng-select-container .ng-arrow {
  border-color: transparent transparent var(--color-button-primary) !important;
}
#dtCloudApp ng-select.ng-select.task-detail-group {
  margin-top: 0;
  min-width: 160px;
}
#dtCloudApp ng-select.ng-select.task-detail-group.ng-select-single .ng-select-container {
  height: 36px;
  border-radius: 24px !important;
  padding: 0 16px;
  background-color: transparent !important;
}
#dtCloudApp .task-detail-page ng-select.ng-select.task-detail-group.ng-select-single .ng-select-container {
  border: unset !important;
}
#dtCloudApp ng-select.ng-select.task-detail-group.ng-select-single .ng-value-container {
  padding-left: 0 !important;
}
#dtCloudApp ng-select.ng-select.task-detail-group.ng-select-single .ng-arrow-wrapper {
  padding-right: 0 !important;
}
#dtCloudApp ng-select.ng-select.task-detail-group .ng-dropdown-panel {
  min-width: 180px;
}
#dtCloudApp ng-select.ng-select.task-detail-group.taskgroupmenu .ng-dropdown-panel {
  min-width: 201px;
}
#dtCloudApp .ng-select.task-detail-group.white .ng-select-container {
  color: var(--white);
}
#dtCloudApp .ng-select.task-detail-group.white .ng-arrow-wrapper .ng-arrow {
  border-color: var(--white) transparent transparent !important;
}
#dtCloudApp .ng-select.task-detail-group.ng-select-single:not(.ng-select-disabled) .ng-select-container:active {
  border: unset !important;
  background-color: unset !important;
}

/* src/assets/css/table.css */
.newTableUI-card {
  border: none !important;
}
app-selection-manager,
table {
  height: fit-content;
}
.table-overflow-container {
  overflow-x: auto;
  width: 100%;
}
table {
  position: relative;
  border-spacing: 0 8px;
  background-color: var(--light-gray3);
  border-radius: 4px;
  border-radius: 12px;
  width: 100%;
  padding: 0 8px;
}
table thead tr {
  display: table-row !important;
}
table th,
table td {
  background-color: white;
  color: var(--medium-gray);
  height: 100%;
  padding: 8px 0 8px 12px;
}
table .selected td {
  background-color: var(--light-gray2);
}
table .selected *::selection {
  color: inherit;
  background: transparent;
}
tr.green td,
tr.gray td,
tr.blue td,
tr.orange td,
tr.red td {
  box-shadow: none;
}
tr.green td {
  background-color: rgba(13, 187, 125, 0.1);
}
tr.green .content-primary {
  color: var(--cool-green);
}
tr.green td:first-child {
  border-left: 2px solid var(--cool-green);
}
tr.gray td {
  background-color: rgba(234, 236, 237, 0.1);
}
tr.gray .content-primary {
  color: var(--gray);
}
tr.gray td:first-child {
  border-left: 2px solid var(--light-gray2);
}
tr.blue td {
  background-color: rgba(0, 122, 204, 0.1);
}
tr.blue .content-primary {
  color: var(--blue);
}
tr.blue td:first-child {
  border-left: 2px solid var(--blue);
}
tr.orange td {
  background-color: rgba(251, 128, 48, 0.1);
}
tr.orange .content-primary {
  color: var(--orange);
}
tr.orange td:first-child {
  border-left: 2px solid var(--orange);
}
tr.red td {
  background-color: rgba(224, 49, 49, 0.1);
}
tr.red .content-primary {
  color: var(--red);
}
tr.red td:first-child {
  border-left: 2px solid var(--red);
}
table td.no-style,
table tr.no-style td {
  box-shadow: unset;
  background-color: unset;
}
table th {
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-transform: uppercase;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  z-index: 1;
  text-align: left;
}
.servicecallCalender table th {
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-transform: uppercase;
  position: -webkit-sticky;
  position: unset;
  top: 0;
  z-index: 1;
}
table .dialog-sticky-header th {
  top: -32px !important;
}
table.sticky-header-20 th {
  top: -20px;
}
.header-z-index-3 th {
  z-index: 3;
}
table td {
  cursor: default;
}
table.cursor-pointer td {
  cursor: pointer;
}
.show-on-hover {
  visibility: hidden;
}
.show-on-hover.mat-mdc-checkbox-checked,
tr:hover .show-on-hover,
.dt-grid-item:hover .show-on-hover {
  visibility: visible;
}
td .show-on-hover .mat-mdc-menu-trigger.mat-mdc-icon-button.mat-mdc-button-base {
  height: 28px;
}
.checkbox-cell {
  width: 30px;
  padding: 0;
}
.checkbox-cell .mat-mdc-checkbox-touch-target {
  height: 60px;
  width: 60px;
}
.achronym-cell {
  width: 32px;
}
.date-cell {
  max-width: 110px;
  min-width: 100px;
}
.number-cell {
  max-width: 80px;
}
.price-cell {
  width: 120px;
}
.po-number-cell {
  max-width: 120px;
}
.qty-cell {
  max-width: 70px;
}
.status-dot-cell {
  max-width: 70px;
  width: 70px;
  text-align: center !important;
}
table tr td.menu-container-cell {
  padding: 0 0 0 8px;
}
.header-sortable.align-right,
.header-sortable.align-center {
  padding-right: 18px;
}
.show-on-hover .mat-mdc-icon-button {
  width: 28px;
  height: 15px;
  line-height: 15px;
  padding: 0;
}
.show-on-hover .mat-mdc-icon-button > mat-icon,
.show-on-hover .mat-mdc-icon-button > mat-icon svg {
  min-height: 18px;
  min-width: 18px;
  max-height: 18px;
  max-width: 18px;
  line-height: 1;
}
.dt-grid {
  background-color: var(--light-gray3);
  padding: 0 8px;
  border-radius: 4px;
  width: 100%;
}
.dt-grid .dt-grid-header,
.dt-grid .dt-grid-item {
  margin: 8px 0;
  border-radius: 2px;
  background-color: var(--white);
}
.dt-grid .dt-grid-header > *,
.dt-grid .dt-grid-item > * {
  padding: 8px 0 8px 12px;
}
.dt-grid .dt-grid-item .checkbox-cell,
.dt-grid .dt-grid-header .checkbox-cell {
  padding: 0;
  width: unset;
}
.dt-grid .dt-grid-header {
  margin-bottom: 0;
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-transform: uppercase;
  color: var(--medium-gray);
}
.dt-grid .dt-grid-item {
  box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
}
.dt-grid .dt-grid-item .mat-mdc-icon-button {
  height: 28px !important;
}
table.mat-calendar-table td {
  box-shadow: unset;
}
.table-container {
  box-shadow: unset;
  box-sizing: border-box;
  border: unset;
  border-radius: unset;
  background-color: unset;
  width: 100%;
}
.dt-table,
table.mat-mdc-table.dt-table {
  height: fit-content;
}
.dt-table,
div.table-container,
table.mat-mdc-table.dt-table {
  position: relative;
  border-collapse: separate;
  border-spacing: 0 8px;
}
.dt-table,
div.table-container,
.dt-grid {
  background-color: var(--light-gray3);
  border-radius: 4px;
  width: 100%;
}
.dt-grid .dt-grid-header,
.dt-grid .dt-grid-item {
  margin: 8px 0;
  border-radius: 2px;
  background-color: var(--white);
}
.dt-grid .dt-grid-header {
  margin-bottom: 0;
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-transform: uppercase;
  color: var(--medium-gray);
}
.dt-grid .dt-grid-item {
  box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
}
tr.dt-row,
tr.dt-table-header {
  display: table-row !important;
}
.dt-table .dt-row.selected,
.selected-row {
  background-color: var(--light-gray2);
}
.dt-table .dt-table-header .dt-header-cell,
.dt-table .dt-row .dt-cell {
  border: none;
  text-align: left;
  color: var(--medium-gray);
  padding: 2px 0;
  background-color: var(--white);
  padding: 8px 12px !important;
  box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
  height: 100%;
}
.dt-table .dt-table-header .dt-header-cell .mat-sort-header-sorted {
  color: var(--slate-grey);
}
.dt-table .dt-row.selected .dt-cell {
  background-color: var(--light-gray2);
}
.dt-table .dt-table-header .dt-header-cell:last-child,
.dt-table .dt-row .dt-cell:last-child {
  border-radius: 0 2px 2px 0;
}
.dt-table .dt-table-header .dt-header-cell:first-child,
.dt-table .dt-row .dt-cell:first-child {
  border-radius: 2px 0 0 2px;
}
.dt-table .dt-row .dt-cell .mat-mdc-icon-button {
  width: 28px;
  height: 28px;
  line-height: 28px;
}
.dt-table.dt-table-padding.no-sorting .dt-table-header .dt-header-cell {
  padding-left: 12px;
}
.dt-table.dt-table-padding .dt-row .dt-cell {
  padding: 12px;
}
.dt-table .dt-table-header .dt-header-cell.align-right,
.dt-table .dt-row .dt-cell.align-right {
  text-align: right;
}
.dt-table .dt-table-header .dt-header-cell.align-center,
.dt-table .dt-row .dt-cell.align-center {
  text-align: center;
}
.dt-table .dt-row .dt-cell.header-sortable.align-right,
.dt-table .dt-row .dt-cell.header-sortable.align-center {
  padding-right: 30px !important;
}
.grid-menu-container {
  padding: 12px 18px;
  font-family: "gilroy-semi-bold";
  cursor: pointer;
  height: 100%;
  width: 100%;
  max-width: 160px !important;
  white-space: normal;
  line-height: 16px;
  border-radius: 8px;
}
.grid-menu-container button .mat-button-wrapper {
  display: flex;
  justify-content: space-between;
}
.dt-table .dt-row .dt-cell.menu-container-cell {
  padding: 0 0 0 8px !important;
}
.dt-sortable-table-header {
  min-height: 41px;
}
.dt-sortable-table-header > div {
  padding: 10px 12px;
}
.dt-table .dt-table-header .dt-header-cell {
  position: sticky;
  position: -webkit-sticky;
  padding: 12px 16px;
  padding-right: 0;
  top: 0;
  z-index: 1;
  box-shadow: unset;
}
.dt-dialog.minor-dialog .dt-table .dt-table-header .dt-header-cell {
  top: -24px;
}
.dt-table .dt-table-header .dt-header-cell,
.dt-sortable-table-header,
.list-header,
.list-header > * {
  background-color: white;
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-transform: uppercase;
  color: var(--medium-gray);
}
.dt-table .dt-row .dt-cell.cb-cell-width,
.dt-table .dt-table-header .dt-header-cell.cb-cell-width {
  width: 40px;
  padding-left: 16px;
}
.dt-table .dt-row .show-on-hover,
.dt-sortable-table-body .show-on-hover {
  visibility: hidden;
}
.dt-table .dt-row .show-on-hover.mat-mdc-checkbox-checked,
.dt-sortable-table-body .show-on-hover.mat-mdc-checkbox-checked,
.dt-table .dt-row:hover .show-on-hover,
.dt-sortable-table-body:hover .show-on-hover {
  visibility: visible;
}
.dt-sortable-table-body {
  display: flex;
  background-color: white;
  color: var(--cool-grey);
  border: none;
  border-bottom: 1px solid var(--light-gray2);
  text-align: left;
  color: var(--navy);
}
.dt-sortable-table-body.hide_state {
  display: none !important;
}
.dt-sortable-table-body > div {
  padding: 8px 12px;
}
.dt-sortable-table-placeholder {
  background: var(--light-gray2);
  border: dotted 1px var(--light-gray2);
  min-height: 41px;
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.dt-sortable-table-body .drag-icon,
.dt-sortable-table-header .drag-icon {
  min-width: 30px;
  display: flex;
  align-items: center;
}
.dt-sortable-table-body.sort-disabled .drag-icon {
  visibility: hidden;
}
.grid-img-container {
  height: 28px;
  width: 28px;
  text-align: center;
  max-height: 56px !important;
  max-width: 56px !important;
  align-content: center;
  align-items: center;
  justify-content: center;
  display: flex;
}
.grid-img-container.medium {
  height: 56px;
  width: 56px;
}
.grid-img-container.large {
  height: 96px;
  width: 96px;
  max-height: 96px !important;
  max-width: 96px !important;
}
.grid-img-container.h-w-32px {
  height: 32px;
  width: 32px;
  max-height: 32px !important;
  max-width: 32px !important;
}
.grid-img-container.h-w-88px {
  height: 88px;
  width: 88px;
  max-height: 88px !important;
  max-width: 88px !important;
}
.table-container.no-sticky-header .dt-table .dt-table-header .dt-header-cell {
  position: static;
}
.grid-item .row-header,
.grid-item .row-body {
  min-height: 40px;
  padding: 0 16px;
  background-color: white;
  margin: 4px 0;
  box-shadow: 1px 1px 2px rgb(0 0 0 / 10%);
}
.quote-setting-dialog table {
  border-radius: unset !important;
}
.inventory-table tr:not(.selected) td {
  border-top: 1px solid var(--color-white);
  border-bottom: 1px solid var(--color-white);
}
.inventory-table tr:not(.selected) td:first-child {
  border-left: 1px solid var(--color-white);
}
.inventory-table tr:not(.selected) td:last-child {
  border-right: 1px solid var(--color-white);
}
.inventory-table tr.selected td {
  background:
    linear-gradient(
      0deg,
      rgba(251, 128, 48, 0.08) 0%,
      rgba(251, 128, 48, 0.08) 100%),
    var(--color-white);
  border-top: 1px solid var(--color-warning-high);
  border-bottom: 1px solid var(--color-warning-high);
}
.inventory-table tr.selected td:first-child {
  border-left: 1px solid var(--color-warning-high);
}
.inventory-table tr.selected td:last-child {
  border-right: 1px solid var(--color-warning-high);
}
.dark-mode table {
  background-color: #3A4755;
}
.dark-mode table th,
.dark-mode table td {
  background-color: #1F2933;
  color: var(--white);
}
table.newTableUI {
  width: 100%;
  padding: 0px !important;
  position: relative;
  border-spacing: 0 0px;
  background-color: unset !important;
  border-radius: unset !important;
}
table.newTableUI thead th {
  background-color: #EBF4FB !important;
  color: var(--blue) !important;
  font-family: "gilroy-semi-bold" !important;
  font-size: 12px !important;
  text-transform: unset !important;
  padding: 0 12px 0px 12px !important;
  border-bottom: 1px solid var(--blue) !important;
  min-height: 32px;
  height: 32px !important;
}
table.newTableUI thead th,
table.newTableUI tbody td {
  box-sizing: border-box;
}
table.newTableUI thead th.single-column {
  background-color: #EBF4FB !important;
  color: var(--blue) !important;
  font-family: "gilroy-semi-bold" !important;
  font-size: 12px !important;
  border-right: 1px solid var(--color-divider-dark) !important;
  text-transform: unset !important;
  padding: 0px !important;
  border-bottom: 1px solid var(--blue) !important;
  min-height: 32px;
  height: 32px !important;
}
table.newTableUI th {
  background-color: #EBF4FB !important;
  color: var(--medium-gray);
  height: 100%;
}
table.newTableUI tr td {
  padding: 8px 12px;
  vertical-align: middle;
}
table.newTableUI th.pr-40-i,
table.newTableUI tr td.pr-40-i {
  padding-right: 40px !important;
}
table.newTableUI th.pr-100-i,
table.newTableUI tr td.pr-100-i {
  padding-right: 100px !important;
}
table.newTableUI th.pr-60-i,
table.newTableUI tr td.pr-60-i {
  padding-right: 60px !important;
}
table.newTableUI.border-bottom thead tr th {
  border-bottom: 1px solid var(--blue) !important;
}
table.newTableUI.bs-unset {
  border-spacing: 0 0px !important;
}
table.newTableUI .mdc-data-table__cell,
table.newTableUI .mdc-data-table__header-cell {
  padding: 0 12px !important;
}
table.newTableUI.columnColor thead th:nth-child(even),
table.newTableUI tbody tr td.even-row {
  background-color: #EBF4FB !important;
}
table.newTableUI.columnColor tbody tr td:nth-child(even),
table.newTableUI.paymentTable.columnColor tbody tr td:nth-child(even),
table.newTableUI.rowColor tbody tr:nth-child(even) td,
table.newTableUI.paymentTable.rowColor tbody tr:nth-child(even) td,
table.newTableUI.rowColor tbody tr.even-row td,
table.newTableUI tbody tr.selected td {
  background-color: var(--color-background) !important;
}
table.newTableUI thead tr th:last-child {
  border-right: 0px solid var(--color-divider-dark) !important;
}
table.newTableUI.no-right-border thead tr th:not(.single-column):last-child {
  border-right: unset !important;
}
table.newTableUI tr td.status-cell {
  padding: 4px !important;
  position: sticky;
  right: 0px;
  z-index: 1;
}
table.newTableUI th.status-cell {
  position: sticky;
  right: 32px;
}
@media (min-width: 600px) {
  table.newTableUI th.name-cell,
  table.newTableUI tr td.name-cell {
    position: sticky;
    left: 25px;
  }
  table.newTableUI th.payment-name-cell,
  table.newTableUI tr td.payment-name-cell {
    position: sticky;
    left: 30px;
  }
  table.newTableUI th.timeEntry-name-cell,
  table.newTableUI tr td.timeEntry-name-cell {
    position: sticky;
  }
  table.newTableUI th.name-cell-woCB,
  table.newTableUI tr td.name-cell-woCB {
    position: sticky;
    padding-left: 16px !important;
    left: 0px;
  }
  table.newTableUI th.arrow-name-cell,
  table.newTableUI tr td.arrow-name-cell {
    position: sticky !important;
    left: 28px !important;
    padding: 0 0 0 16px !important;
  }
  .table-no-records table.newTableUI th.arrow-name-cell {
    left: 0 !important;
  }
  #table-container-tasks.table-no-records table.newTableUI th.name-cell,
  #table-container-tasks.table-no-records table.newTableUI tr td.name-cell {
    left: 50px;
  }
  table.newTableUI th.name-cell,
  table.newTableUI th.name-cell-woCB,
  table.newTableUI th.type-cell,
  table.newTableUI th.payment-name-cell {
    z-index: 20;
  }
  table.newTableUI th.timeEntry-name-cell {
    z-index: 20;
  }
  table.newTableUI th {
    z-index: 3;
  }
}
table.newTableUI thead th.newTablecheckBox-cell,
table.newTableUI tr td.newTablecheckBox-cell {
  position: sticky;
  left: 0px;
  padding-left: 0px !important;
  padding-right: 0px !important;
  min-width: unset !important;
}
table.newTableUI thead th.timeEntryType-cell,
table.newTableUI tr td.timeEntryType-cell {
  left: 0px;
  padding-left: 10px !important;
}
table.newTableUI th.type-cell,
table.newTableUI tr td.type-cell {
  position: sticky;
  left: 0px;
}
table.newTableUI th.newTablecheckBox-cell,
table.newTableUI th.timeEntryType-cell {
  z-index: 15;
}
table.newTableUI tbody tr td {
  border-bottom: 1px solid var(--color-divider-dark) !important;
}
table.newTableUI tbody tr td.td-border-right {
  border-right: 1px solid var(--blue) !important;
}
table.newTableUI tbody tr:last-child td {
  border-bottom: unset !important;
}
table.newTableUI thead tr:first-child th:first-child {
  border-top-left-radius: 12px !important;
}
table.newTableUI thead tr:first-child th:last-child {
  border-top-right-radius: 0px !important;
}
table.newTableUI tbody tr:last-child td:first-child {
  border-bottom-left-radius: 12px !important;
}
table.newTableUI tbody tr:last-child td:last-child {
  border-bottom-right-radius: 12px !important;
}
table.newTableUI tbody tr td:last-child {
  border-right: 1px solid var(--color-divider-dark) !important;
}
table.newTableUI.no-right-border tbody tr td:last-child {
  border-right: unset !important;
}
table.newTableUI tbody tr {
  height: 56px !important;
}
.resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  width: 8px;
  height: 100%;
  cursor: col-resize;
  border-right: 2px solid lightgray;
  opacity: 0;
  transition: opacity .3s;
}
th:hover .resize-handle,
th:active .resize-handle {
  opacity: 1;
}
.custom-drag-preview {
  border: 1px solid var(--blue);
  padding: 8px;
  border-radius: 4px;
  background-color: #EBF4FB !important;
  color: var(--blue) !important;
  font-family: "gilroy-semi-bold";
  font-size: 12px;
  min-width: 140px;
  min-height: 28px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
table.newTableUI tr td.select {
  border-left: 3px solid var(--blue) !important;
  border-right: 3px solid var(--blue) !important;
  transition: background-color 0.2s;
}
table.newTableUI th.select {
  border-left: 3px solid var(--blue) !important;
  border-right: 3px solid var(--blue) !important;
  border-top: 3px solid var(--blue) !important;
  transition: background-color 0.2s;
}
table.newTableUI tbody tr:last-child td.select {
  border-bottom: 3px solid var(--blue) !important;
}
.headerRow-drag-handle {
  cursor: move;
  display: inline-block;
}
.column-preview {
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  width: 150px;
  max-height: 300px;
  overflow-y: auto;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, 0.2),
    0 8px 10px 1px rgba(0, 0, 0, 0.14),
    0 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.column-preview .column-header {
  background: #f4f4f4;
  padding: 8px;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
}
.column-preview .column-cell {
  padding: 8px;
  border-bottom: 1px solid #ddd;
}
.column-preview .status-tag.gray {
  background: #e0e0e0;
  color: #333;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 12px;
}
.cdk-drag-placeholder {
  opacity: 0.3;
  background: rgba(0, 0, 0, 0.1);
  border: dashed 1px rgba(0, 0, 0, 0.4);
}
.cdk-drag-animating {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
table.newTableUI .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true]) ~ .mdc-checkbox__background {
  background-color: white !important;
}
table.newTableUI .mat-mdc-checkbox .mdc-form-field {
  height: 28px;
}
table.newTableUI th.moreMenuColumn,
table.newTableUI tr td.moreMenuColumn {
  position: sticky;
  right: 0px;
  min-width: unset !important;
  max-width: 50px !important;
  width: 50px !important;
  padding-right: 16px !important;
}
table.newTableUI th.JCmoreMenuColumn,
table.newTableUI tr td.JCmoreMenuColumn {
  position: sticky;
  right: 0px;
  min-width: unset !important;
  max-width: 100px !important;
  width: 100px !important;
  padding-right: 8px !important;
}
table.newTableUI tr td.timeEntry-options {
  position: sticky;
  right: 0px;
  min-width: unset !important;
  max-width: 80px !important;
  padding-right: 8px !important;
}
.regular-font-td {
  color: var(--navy) !important;
  font-size: 14px !important;
  font-family: "gilroy-regular" !important;
}
.regular-font-td-12 {
  font-size: 12px !important;
  color: var(--medium-gray) !important;
  font-family: "gilroy-regular" !important;
}
.semi-bold-font-td {
  color: var(--navy) !important;
  font-size: 14px !important;
  font-family: "gilroy-semi-bold" !important;
}
.semi-bold-font-link-td {
  color: var(--color-green2) !important;
  font-size: 14px !important;
  font-family: "gilroy-semi-bold" !important;
}
.size12-regular {
  font-size: 12px;
  font-family: gilroy-regular;
}
.regular-font-td-12-link-td {
  font-size: 12px !important;
  color: var(--medium-gray) !important;
  font-family: "gilroy-regular" !important;
}
table.newTableUI th.timeEntry-name-cell,
table.newTableUI tr td.timeEntry-name-cell {
  position: sticky;
}
.regular-price {
  font-family: "gilroy-regular", monospace !important;
  font-variant-numeric: tabular-nums !important;
}

/* src/assets/css/dragDrop.css */
.cdk-drag-preview {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  background-color: white;
  border-radius: 4px;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, 0.2),
    0 8px 10px 1px rgba(0, 0, 0, 0.14),
    0 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.cdk-drag-preview > td:nth-child(n+1) {
  display: none;
}
.cdk-drag-animating {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.custom-placeholder {
  background: #ccc;
  border: dotted 3px #999;
  min-height: 60px;
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}

/* src/assets/css/button-group.css */
.button-group {
  display: flex;
  border: 1px solid transparent;
  border: none;
  min-height: 27px;
  height: 27px;
  overflow: hidden;
}
.button-group .button-group-btn {
  display: flex;
  flex: 1;
  justify-content: center;
  height: 100%;
  min-width: 100px;
  border: 1px solid transparent;
  font-family: gilroy-semi-bold;
  background-color: white;
  cursor: pointer;
  line-height: 22px;
}
.button-group.secondary .button-group-btn {
  border-color: var(--medium-gray);
}
.button-group.primary .button-group-btn {
  border-color: var(--cool-green);
}
.button-group .button-group-btn:hover {
  background-color: rgba(158, 158, 158, 0.1);
}
.button-group .button-group-btn:last-child {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.button-group .button-group-btn:first-child {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.button-group.secondary .button-group-btn {
  border-color: var(--medium-gray);
  color: var(--medium-gray);
}
.button-group.primary .button-group-btn {
  border-color: var(--cool-green);
  color: var(--cool-green);
}
.button-group.secondary .button-group-btn.active {
  background-color: var(--medium-gray);
  color: white;
}
.button-group.primary .button-group-btn.active {
  background-color: var(--cool-green);
  color: white;
}

/* src/assets/css/proposal/layout-structure.css */
.proposal-wrapper {
  display: flex;
  flex-direction: column;
  background-color: white;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  max-width: 100vw;
}
.proposal-wrapper .mat-drawer-content {
  background-color: white;
}
.proposal-wrapper mat-drawer-content app-loading {
  max-width: 1062px;
}
.proposal-wrapper .proposal-header {
  min-height: 64px;
  padding: 0 24px;
  border-bottom: 1px solid #E4E5E6;
}
.proposal-header .input-title input {
  border: 1px solid transparent;
  box-shadow: none;
  font-size: 20px;
  height: 33px;
  font-family: gilroy-semi-bold;
  box-shadow: inset 0 1px 4px 0 transparent;
}
.proposal-header .input-title:hover input {
  box-sizing: border-box;
  border: 1px solid var(--silver);
  border-radius: 2px;
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
}
.proposal-header .input-title input:focus {
  border: 1px solid var(--cool-green);
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06) !important;
}
#dtCloudApp .proposal-wrapper .proposal-header .mat-mdc-tab-link,
#dtCloudApp .proposal-wrapper .proposal-header .mat-tab-label {
  height: 62px;
}
.proposal-wrapper .proposal-header .proposal-type {
  color: #01162F;
  font-family: gilroy-bold;
  font-size: 21px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.proposal-wrapper .proposal-header > div .proposal-header-margin {
  margin-right: 10px;
  min-width: 40px;
}
.proposal-wrapper .proposal-header > div .proposal-header-margin:last-child {
  margin-right: 0px;
}
.proposal-wrapper .proposal-header > div .proposal-header-margin:nth-child(2) {
  margin-right: 24px;
}
.proposal-wrapper .proposal-header .button-group {
  width: 260px;
}
.proposal-wrapper .proposal-sub-header {
  height: 62px;
  border-bottom: 1px solid var(--light-gray2);
  background-color: var(--light-gray);
  text-align: end;
}
.proposal-sub-header .btn-blue {
  outline: none;
  cursor: pointer;
  background-color: var(--blue);
  color: white;
  padding: 8px 8px 7px 8px;
  min-width: 110px;
  border-radius: 3px;
  font-family: gilroy-semi-bold;
}
.proposal-wrapper .proposal-navigation-container {
  display: flex;
  flex: 1;
}
.proposal-wrapper .proposal-navigation-container {
  min-width: 280px;
  max-width: 280px;
  border: none;
  padding-left: 33px;
  padding: 0px;
  overflow-x: hidden;
}
.proposal-edit-container-view {
  min-width: 280px;
  max-width: 280px;
  width: calc((100% - 1062px) / 2);
}
@media only screen and (max-width: 600px) {
  .proposal-edit-container-view {
    min-width: 100%;
    max-width: 100%;
    width: 100%;
  }
  .equal-width {
    max-width: 0 !important;
  }
  .mobile-editor {
    height: 90vh;
  }
}
.proposal-wrapper .proposal-navigation-container > div {
  padding: 15px;
  overflow: auto;
  padding-left: 23px;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree,
.preview-proposal .navigation-tree {
  display: flex;
  flex-direction: column;
  padding-left: 10px;
  transition: padding 0.4s;
}
.navigation-tree mat-icon[svgIcon=moreHorzIcon] {
  visibility: hidden;
}
.navigation-tree:hover mat-icon[svgIcon=moreHorzIcon] {
  visibility: visible;
}
.proposal-mobile-view .navigation-tree mat-icon[svgIcon=moreHorzIcon] {
  visibility: visible !important;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree > div,
.preview-proposal .navigation-tree > div {
  display: flex;
  padding: 5px 0;
  cursor: pointer;
  margin-bottom: 5px;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree > div:hover {
  background-color: #EAECEE;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree:hover .hide-drag {
  display: block;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree:hover .hide-bullet {
  display: none;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree .hide-bullet {
  display: block;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree .hide-drag {
  display: none;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree .navigation-name {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 13px;
  word-break: break-word;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree > div:hover .navigation-name,
.proposal-wrapper .proposal-navigation-container .navigation-tree > div.active .navigation-name,
.proposal-wrapper .proposal-navigation-container .navigation-tree > div:hover span,
.proposal-wrapper .proposal-navigation-container .navigation-tree > div.active span,
.preview-proposal .navigation-tree > div.active .navigation-name,
.preview-proposal .navigation-tree > div.active span {
  color: var(--cool-green);
}
.proposal-wrapper .proposal-navigation-container .navigation-tree > div:hover .navigation-bullet,
.proposal-wrapper .proposal-navigation-container .navigation-tree > div.active .navigation-bullet,
.preview-proposal .navigation-tree > div.active .navigation-bullet {
  background-color: var(--cool-green);
}
.proposal-wrapper .proposal-navigation-container .navigation-tree .navigation-bullet,
.preview-proposal .navigation-tree .navigation-bullet {
  background-color: var(--silver);
  height: 10px;
  max-width: 10px;
  min-width: 10px;
  width: 10px;
  margin-right: 5px;
  margin-top: 2px;
  border-radius: 50%;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree.level-1 .navigation-bullet,
.preview-proposal .navigation-tree.level-1 .navigation-bullet {
  margin-left: 6px;
}
.proposal-wrapper .proposal-navigation-container .navigation-tree.level-2 .navigation-bullet,
.proposal-wrapper .proposal-navigation-container .navigation-tree.level-3 .navigation-bullet,
.proposal-wrapper .proposal-navigation-container .navigation-tree.level-4 .navigation-bullet,
.proposal-wrapper .proposal-navigation-container .navigation-tree.level-5 .navigation-bullet {
  margin-left: 7px;
}
.preview-proposal .navigation-tree.level-2 .navigation-bullet,
.preview-proposal .navigation-tree.level-3 .navigation-bullet,
.preview-proposal .navigation-tree.level-4 .navigation-bullet,
.preview-proposal .navigation-tree.level-5 .navigation-bullet {
  margin-left: 7px;
}
.proposal-wrapper .proposal-navigation-container .navigation-add-btn {
  padding: 5px 20px;
  cursor: pointer;
  color: var(--cool-green);
  font-size: 13px;
  font-weight: unset;
  font-family: gilroy-medium;
  text-decoration: none;
  text-transform: capitalize;
}
.proposal-wrapper .proposal-main-container {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: auto;
  max-width: 1062px;
}
.proposal-wrapper .proposal-main-container.center-content {
  margin: 0 auto;
}
.proposal-wrapper .proposal-main-container > * {
  display: flex;
  flex-direction: column;
  padding-bottom: 200px;
}
.proposal-wrapper .proposal-main-container div.proposal-container > * {
  position: relative;
}
.proposal-container > *:nth-child(1) .btn-up {
  display: none;
}
.proposal-container > *:last-child .btn-down {
  display: none;
}
.choose-template-lable {
  max-height: 350px;
}
.choose-template-lable .mat-radio-label-content {
  padding-left: 20px;
  padding-right: 0;
  margin: 10px 0;
}
.cdk-drag.preview-proposal {
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
}
@media only screen and (min-width: 1382x) {
  .proposal-wrapper .proposal-main-container {
    min-width: 1062px;
    max-width: 1062px;
  }
}
@media only screen and (max-width: 1382x) {
  .proposal-wrapper .proposal-main-container {
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1620px) {
  .proposal-wrapper .proposal-navigation-container {
    min-width: 280px;
    max-width: unset;
    width: calc((100% - 1062px) / 2);
    flex: 1;
  }
  .proposal-wrapper .proposal-main-container {
    min-width: 1062px;
    max-width: 1062px;
  }
  .proposal-wrapper:not(.quick-proposal) mat-drawer-content {
    margin-left: calc((100% - 1062px) / 2) !important;
  }
}
@media only screen and (min-width: 1336x) {
  .drawer-main-content.preview {
    justify-content: start;
  }
}
.drawer-main-content.preview {
  justify-content: center;
}
@media only screen and (max-width: 1062px) {
  .proposal-wrapper .proposal-main-container {
    max-width: 100%;
  }
  .proposal-wrapper .proposal-navigation-container .navigation-tree {
    padding-left: 20px;
  }
  .proposal-wrapper .proposal-navigation-container .navigation-tree .navigation-bullet {
    width: 10px !important;
    min-width: 10px !important;
    max-width: 10px !important;
    border-radius: 50%;
  }
  .proposal-wrapper .proposal-navigation-container .navigation-tree .navigation-name {
    visibility: visible;
  }
}
.proposal-width-100 {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}

/* src/assets/css/proposal/common.css */
.proposal-section {
  margin: 10px 10px 10px 10px;
  border-radius: 5px;
}
.proposal-edit .proposal-section {
  margin: 10px 10px 10px 10px !important;
}
.proposal-section.with-outer-border,
.proposal-section .with-outer-border {
  background-color: white;
  border: 1px solid var(--silver);
}
.proposal-section-header {
  padding: 25px 0;
  color: var(--navy);
  font-family: gilroy-bold;
  font-size: 24px;
  font-weight: unset;
}
.proposal-header {
  color: var(--navy);
  font-family: gilroy-bold;
  font-size: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.proposal-section-header.with-border {
  border-bottom: 1px solid var(--light-gray2);
}
.description-section .description {
  padding-bottom: 20px;
}
.description-section .description,
.proposal-section-description {
  color: var(--navy);
  font-size: 13px;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.description-section .description div,
.proposal-section-description div {
  height: auto !important;
  width: auto !important;
}
.proposal-section-description.with-border {
  margin: 0 0;
  padding: 20px 32px;
  border-bottom: 1px solid var(--light-gray2);
}
.proposal-margin {
  margin: 0px 32px;
}
.cover:hover .action-menu,
.proposal-section:hover .action-menu {
  display: flex;
}
.cover .action-menu {
  top: 0px;
}
.cover .add-action-menu {
  top: 94% !important;
}
.action-menu {
  position: absolute;
  display: none;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: content-box;
  top: 5px;
  right: -65px;
  width: 44px;
  height: 100%;
  z-index: 1;
  font-weight: unset !important;
}
.action-menu .btn-edit,
.add-action-menu .btn-edit {
  width: 40px;
  cursor: pointer;
  min-width: unset;
  min-height: 35px;
  height: 40px;
  text-align: center;
  line-height: 0;
  color: white;
  background-image:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.13),
      rgba(255, 255, 255, 0)),
    linear-gradient(#020e1c, #020e1c);
  box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.11);
  border: none;
  margin: 5px 0;
  font-family: gilroy-semi-bold;
  overflow: hidden;
  border-radius: 50%;
  transition: .2s;
  padding: 0px 8px;
}
.action-menu .sticky-menu {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
}
.add-action-menu {
  position: absolute;
  left: calc(50% - 21px);
  top: calc(100% - 24px);
  height: unset;
}
.action-menu .btn-edit:hover {
  transform: scale(1.2);
}
.proposal-horizontal-line {
  width: 100%;
  margin: 0;
  border: none;
  background-color: var(--light-gray2);
  height: 1px;
}
.proposal-banner {
  color: var(--white);
  font-family: gilroy-medium;
  background-color: var(--blue);
  padding: 10px 20px;
  font-size: 12px;
}
.proposal-toggle-holder {
  display: flex;
  width: auto;
  padding: 5px 10px;
}
.show-on-md {
  display: block;
}
.section-hover {
  cursor: pointer;
  margin: 5px;
  padding: 5px;
  border: 2px dashed transparent;
  transition: .2s;
  border-radius: 5px;
}
.section-hover.cover-section {
  padding: 7px;
}
.section-hover:hover {
  border-color: #7E8A96;
}
.section-hover:before {
  content: "";
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: -1px;
  right: -1px;
  border-radius: 5px;
  z-index: -1;
}
app-proposal-action-menu {
  display: none;
}
.section-hover app-proposal-action-menu {
  display: block !important;
}
.active-edit-section {
  border: 2px dashed #00B575 !important;
}
.proposal-edit app-proposal-quote-cover #proposal-add-icon,
.proposal-edit app-proposal-change-order-cover #proposal-add-icon {
  margin-bottom: 0px !important;
}
@media only screen and (max-width: 779px) {
  .toggle-holder .present-pro-padding {
    padding-top: 50px;
  }
  .proposal-toggle-holder {
    display: flex;
    width: auto;
    padding: 7px 10px;
    position: fixed;
    z-index: 2;
  }
}
.quick-proposal .show-on-md {
  display: none !important;
}
@media only screen and (min-width: 1340px) {
  .show-on-md {
    display: none;
  }
}
@media only screen and (max-width: 600px) {
  .action-menu {
    display: none !important;
  }
  .proposal-margin {
    margin: 0px 20px;
  }
  .plan-additional-note,
  .proposal-plan-feature {
    grid-template-columns: unset !important;
  }
}
.font-design-text {
  height: 47px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
}
.p-0-15 {
  padding: 0 15px;
}
.small-item-image-size {
  max-height: 50px !important;
  min-height: 50px !important;
  max-width: 50px !important;
  min-width: 50px !important;
}
.font-color-picker {
  position: absolute;
  top: 0px;
  height: 36px;
  width: 36px;
  cursor: pointer;
  border-radius: 2px 0 0 2px;
  border: 1px solid var(--silver);
}
.remove-border {
  border: unset !important;
}
.edit-panel-proposal {
  height: 100%;
}
.edit-panel-proposal .mat-icon .labor-icon {
  fill: #7E8A96;
}
.proposal-service-plan.mat-icon path {
  fill: unset !important;
  stroke: #7E8A96;
}
.edit-panel-proposal .mat-icon.active .stroke,
.edit-panel-proposal .mat-icon:hover .stroke,
.icon-container:hover .mat-icon .stroke,
.icon-container:hover .proposal-service-plan.mat-icon path,
app-custom-color-palette .mat-icon:hover .stroke,
.proposal-service-plan.mat-icon:hover path,
.mat-mdc-tab.mdc-tab--active .mat-icon .stroke {
  stroke: var(--cool-green) !important;
}
.edit-panel-proposal .mat-icon.active .fill,
.edit-panel-proposal .mat-icon:hover .fill,
.icon-container:hover .mat-icon .fill,
.mat-mdc-tab.mdc-tab--active .mat-icon .fill {
  fill: var(--cool-green) !important;
}
.icon-container:hover + .icon-label,
.icon-container:hover .grey-color {
  color: var(--cool-green);
}
.icon-container:hover {
  border-color: var(--cool-green) !important;
  box-shadow: 0px 1px 4px #0dbb7db8 !important;
}
app-edit-panel-container app-summary-edit-panel .mat-mdc-tab.mdc-tab,
app-edit-panel-container app-attachment-edit-panel .mat-mdc-tab.mdc-tab,
app-edit-panel-container app-font-edit-panel .mat-mdc-tab.mdc-tab,
app-edit-panel-container app-meet-the-team-edit-panel .mat-mdc-tab.mdc-tab,
app-edit-panel-container app-gallery-edit-panel .mat-mdc-tab.mdc-tab {
  padding: 0 48px !important;
}
app-edit-panel-container app-lineitem-edit-panel .mat-mdc-tab.mdc-tab {
  padding: 0 13px !important;
  min-width: 50px !important;
}
app-edit-panel-container app-executive-summary-edit-panel .mat-mdc-tab.mdc-tab {
  padding: 0 24px !important;
  min-width: 50px !important;
}
app-edit-panel-container app-cover-edit-panel .mat-mdc-tab.mdc-tab {
  padding: 0 24.6px !important;
  min-width: 50px !important;
}
app-edit-panel-container .mat-tab-labels {
  height: 55px;
  display: flex;
  align-items: center;
}
.editor-body .mat-mdc-tab-group {
  font-family: gilroy-medium;
  height: 100% !important;
}
.file-upload-proposal {
  border: 2px dashed #7E8A96 !important;
  height: 136px;
  background: white !important;
  cursor: pointer;
  min-height: 136px !important;
  border-radius: 4px !important;
}
.opp-file-upload-proposal {
  height: 69px;
  margin: 20px 10px;
  border: 2px dashed #7E8A96;
  cursor: pointer;
  border-radius: 4px;
}
app-attachment-edit-panel .mat-tab-body-content {
  overflow-x: hidden !important;
}
.close-icon:hover {
  color: var(--cool-green) !important;
}
.price-display-option {
  height: 48px;
  min-width: 90px;
  text-align: center;
  background: #FBFCFD;
  box-sizing: border-box;
  box-shadow: 0px 1px 4px rgb(0 0 0 / 25%);
  border-radius: 2px;
  border: 1px solid #7E8A96;
  color: var(--medium-gray);
  cursor: pointer;
  padding: 16px;
}
.price-display-option:hover,
.price-display-option.active {
  color: #0DBB7D !important;
  border: 1px solid #00B575 !important;
}
.gallery-files-container .overlay:hover .hover-position {
  display: flex;
  border: 1px solid #00b575;
  z-index: 1;
  color: white;
}
.gallery-files-container .overlay .hover-position {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 10;
  background-color: rgba(44, 61, 82, 0.75);
  border-radius: 4px;
  top: 0;
  left: 0;
  cursor: pointer;
}
.overlay .hover-position button.mat-mdc-icon-button {
  margin: 12px 6px;
}
.gallery-files-container .overlay .hover-position .file-hovr-btn {
  color: var(--white);
  border: 1px solid var(--white);
  border-radius: 3px;
  cursor: pointer;
  min-width: 65px !important;
}
.editor-option-container > div,
app-edit-panel-container form,
app-edit-panel-container .dropdown-with-label,
app-font-edit-panel .dropdown-with-label,
app-download-proposal-edit-panel .dropdown-with-label {
  padding: 0 19px;
}
app-font-edit-panel .mat-mdc-tab.mdc-tab--active,
app-edit-panel-container .mat-mdc-tab.mdc-tab--active {
  background-color: white !important;
  opacity: 1 !important;
  z-index: 0;
}
app-edit-panel-container .mat-tab-body-wrapper {
  height: 100% !important;
}
app-group-header.proposal-margin.description-line {
  margin: unset;
  border-bottom: 1px solid var(--light-gray2);
  padding: 0 32px;
  margin-bottom: 15px;
}
.mobile-count-detail {
  font-size: 16px;
  color: var(--medium-gray);
}
.mobile-proposal-header {
  font-size: 20px;
  font-family: gilroy-semi-bold;
  margin-left: 20px;
}
.proposal-mobileView {
  padding-top: 10px !important;
  border: unset !important;
}
.lineitem-section.header-size .top-total-price {
  padding-top: 10px !important;
  line-height: 33px;
}
.mobile-item-align {
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  place-content: center space-between;
  align-items: center;
}
.proposal-mobile-view .proposal-section {
  margin: 0 !important;
  border-radius: 0 !important;
  border: unset !important;
  border-bottom: 1px solid var(--silver) !important;
}
.mobile-client {
  flex-direction: column-reverse !important;
  padding-top: 0 !important;
}
.mobile-license span {
  opacity: .7;
  display: block;
  padding: 10px 0 5px;
}
.mobile-license div {
  font-size: 20px;
  padding-bottom: 10px;
}
.proposal-social-media {
  padding: 15px 0;
  border-bottom: 1px solid var(--silver);
}
.acronym-75 {
  width: 90px !important;
  height: 90px !important;
  min-height: 90px !important;
  min-width: 90px !important;
  font-size: 25px !important;
  background-color: var(--light-gray2);
  text-align: center;
  vertical-align: middle;
  color: var(--medium-gray);
  text-transform: uppercase;
  line-height: 32px !important;
  margin: 0 25px 25px;
}
.award-img {
  height: 90px !important;
  min-height: 90px !important;
  min-width: 90px !important;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  vertical-align: middle;
  margin: 0 25px 25px;
}
.column-2-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 0 30px;
  column-gap: 50px;
}
.mobile-testimonial {
  display: flex !important;
  transition: .2s;
  transform: translateX(0);
  padding: 0;
  gap: 0;
  width: 100%;
}
.mobile-testimonial .print-testimonial {
  min-width: 100% !important;
}
.testimonial-review {
  margin-left: 30px;
  font-size: 15px;
  line-height: 22px;
}
.social-media-align {
  grid-template-columns: repeat(auto-fit, minmax(80px, 120px));
  display: grid;
  justify-items: center;
  align-items: center;
  grid-row-gap: 50px;
  justify-content: center;
}
app-choose-proposal-template .mat-radio-label-content {
  width: 100%;
}
.proposal-section {
  min-height: 50px;
}
app-proposal-layout-structure .mat-slide-toggle-bar {
  margin-right: 0 !important;
}
app-proposal-layout-structure .mat-mdc-tab-body-wrapper {
  height: 100%;
}
.proposal-accepted app-group-header .primary,
.proposal-accepted app-group-header a {
  display: none !important;
}
.proposal-accepted app-group-header .proposal-section-description .primary,
.proposal-accepted app-group-header .proposal-section-description a {
  display: inline-block !important;
}
.btn-with-more-btn.footer-more-menu-btn {
  margin: unset !important;
  min-height: 36px;
  min-width: 29px !important;
  max-width: 29px !important;
  background-color: white !important;
  border: 2px solid var(--cool-green) !important;
  border-left: 0 !important;
  border-radius: 0px 5px 5px 0px !important;
}
.btn-with-more-btn.footer-more-menu-btn:hover {
  box-shadow: 0 1px 5px 0 rgb(13, 187, 125) !important;
}
.btn-with-more-btn.footer-more-menu-btn:active {
  color: var(--white) !important;
  border: solid 2px #009355 !important;
  background-color: #ffffff !important;
  box-shadow: none !important;
}
.testimonial-container {
  border: 1px solid var(--silver);
  position: relative;
  padding: 90px 20px 20px;
  border-radius: 10px;
  min-width: 88%;
  margin: 100px 1% 0;
}
.testimonial-img-container {
  position: absolute;
  top: -79px;
  left: 33%;
}
.mobile-view-modus {
  height: 250px !important;
}
.service-contract-des {
  margin-left: 14px !important;
  letter-spacing: .5px !important;
}
.proposal-subscription-sub-header {
  font-size: 15px;
  padding: 10px 0;
}
.item-subscription-image {
  width: 50px;
  height: 50px;
  border-radius: 5px;
  margin-right: 16px;
  min-height: 50px;
  min-width: 50px;
  max-height: 50px;
  max-width: 50px;
  transition: .5s;
}
.item-subscription-image.large-size-img {
  width: 100px;
  height: 100px;
  border-radius: 5px;
  margin-right: 16px;
  min-height: 100px;
  min-width: 100px;
  max-height: 100px;
  max-width: 100px;
}

/* src/assets/css/proposal/cover.css */
.cover {
  background-color: white;
}
.version {
  height: 27px;
  min-width: 41px;
  border-radius: 5px;
  background-color: rgba(0, 0, 0, 0.27);
  color: #ffffff;
  font-size: 16px;
  font-family: gilroy-semi-bold;
  text-align: center;
  vertical-align: text-bottom;
  line-height: 26px;
  margin-left: 0;
}
.base-number {
  font-size: 16px;
  height: 27px;
  line-height: 27px;
  min-width: 41px;
  width: auto;
  padding: 0 5px;
  border-radius: 5px;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  margin-right: 0px;
  color: white;
  background-color: rgba(0, 0, 0, 0.14);
  font-family: gilroy-medium;
}
.version.with-base-number {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.cover.cover-no-image .version {
  background-color: rgba(0, 0, 0, 0.4);
}
.cover.cover-no-image .base-number {
  background-color: rgba(0, 0, 0, 0.3);
  color: rgba(255, 255, 255, 0.80);
}
.cover.quote-cover-section,
.cover.co-cover-section {
  min-height: 310px;
  margin: 10px 10px 10px 10px;
}
.cover .cover-client {
  min-width: 260px;
  max-width: 360px;
  min-height: 108px;
  padding: 10px 20px;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.27);
}
.cover.cover.cover.cover-no-background .cover-client {
  background-color: transparent;
}
.cover .cover-bg-image {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.cover.cover-scale-image .cover-bg-image {
  background-size: contain;
}
.cover.cover-no-image .cover-bg-image {
  background-image: none !important;
}
.cover.cover-no-image .cover-bg-color,
.cover.cover-no-background .cover-bg-color {
  background-color: transparent !important;
}
.cover .cover-client {
  color: white;
}
.cover .cover-client .cover-client-address {
  text-align: left;
  font-size: 16px;
  line-height: 19px;
  margin: 10px 0 0 0;
}
.cover .cover-client .cover-client-name {
  text-align: left;
  font-size: 14px;
  line-height: 19px;
}
.cover .cover-client .cover-client-address {
  font-size: 14px;
  margin: 8px 0 0 0;
}
.cover .cover-proposal-detail {
  padding-left: 20px;
  color: white;
}
.cover .cover-proposal-detail .cover-proposal-date {
  padding-right: 20px;
  padding-top: 10px;
  width: 100%;
  font-size: 14px;
  margin-bottom: 0;
  min-height: 35px;
}
.cover .cover-proposal-detail .cover-proposal-name {
  font-size: 44px;
  font-family: gilroy-regular;
  line-height: 44px;
}
.cover.co-cover-section .cover-proposal-detail .cover-proposal-name {
  font-size: 24px;
  font-family: gilroy-medium;
}
.cover .cover-company {
  color: var(--slate-grey);
  font-size: 16px;
  text-align: left;
  padding-left: 10px;
}
.cover .cover-company .cover-logo {
  min-height: 125px;
  height: 125px;
  min-width: 165px;
  width: 165px;
  position: relative;
  margin-top: 13px;
  margin-right: 10px;
}
.cover .cover-company .cover-logo img {
  position: absolute;
  max-height: 100%;
  max-width: 100%;
  margin-bottom: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;
}
.cover .cover-company div {
  width: 100%;
}
.cover .cover-company .cover-company-details {
  font-size: 14px;
  opacity: 0.8;
}
.cover .cover-company a.website {
  color: #00B575;
  font-size: 13px;
  text-decoration: none;
  display: block;
  word-break: break-word;
}
@media only screen and (max-width: 600px) {
  .cover .cover-company {
    padding-left: 20px;
  }
}
.remove-border-dropdown .ng-select-container {
  border: none !important;
  box-shadow: unset !important;
}
.remove-border-dropdown .ng-select-container .ng-arrow-wrapper {
  padding: 0 !important;
}
.primary-contact-info {
  display: flex;
  flex-direction: column;
}

/* src/assets/css/proposal/lineitem.css */
.lineitem-section {
  display: flex;
  flex-direction: column;
}
.lineitem-section .proposal-section-description {
  margin: 20px 0;
}
.lineitem-section .lineItem-group-header,
.lineitem-section .lineitem-subgroup-header {
  display: flex;
  flex-direction: column;
}
.lineitem-section .lineItem-group-header > div:first-child,
.lineitem-section .lineitem-subgroup-header > div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--navy);
  padding: 20px 0;
  border-bottom: 1px solid var(--light-gray2);
  border-top: 1px solid var(--light-gray2);
}
.lineitem-section .lineItem-group-header > div:first-child {
  padding-top: 60px;
  font-size: 20px;
}
.lineitem-section .lineitem-subgroup-header > div:first-child {
  padding: 10px 0;
  border-top: none;
  font-size: 16px;
}
.quick-proposal .lineitem-section .lineitem-subgroup-header > div:first-child,
.quick-proposal .lineitem-section .lineitem-subgroup-header > .proposal-section-description {
  margin-left: 30px;
}
.lineitem-section .lineItem-group-header label,
.lineitem-section .lineitem-subgroup-header label {
  padding-top: 0;
  font-size: 15px;
  padding: 0 5px;
  opacity: .8;
}
.lineitem-section .lineitem-subgroup-header label {
  font-size: 13px;
}
.lineitem-grid-container {
  display: flex;
  flex-wrap: wrap;
  flex: 1 1 100%;
  padding: 10px 0;
}
.lineitem-grid-container .grid-body-wrapper {
  display: flex;
  width: 100%;
  border-bottom: 1px solid var(--light-gray2);
}
.lineitem-grid-container .grid-body-wrapper:last-child {
  border-bottom: none;
}
.proposal-container:not(.edit-mode) .lineitem-grid-container .grid-body-wrapper.active {
  background-color: var(--grid-item-gray);
}
.lineitem-grid-container .lineitem-grid {
  display: flex;
  flex-direction: column;
  width: 33.33%;
  padding: 10px 0;
}
.proposal-container:not(.edit-mode) .lineitem-grid-container .lineitem-grid {
  cursor: pointer;
}
.proposal-container:not(.edit-mode) .lineitem-grid-container .lineitem-grid:hover {
  background-color: var(--grid-item-gray);
}
.proposal-container:not(.edit-mode) .lineitem-grid-container .grid-body-wrapper .lineitem-grid.active,
.proposal-container:not(.edit-mode) .lineitem-grid-container .grid-body-wrapper .lineitem-grid.active .lineitem-grid-inner {
  background-color: var(--grid-item-gray);
}
.lineitem-grid-container .lineitem-grid .lineitem-grid-inner {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 10px;
}
.lineitem-grid-container .lineitem-grid:nth-child(3n+2) .lineitem-grid-inner {
  border: 1px solid var(--light-gray2);
  border-top: none;
  border-bottom: none;
}
.lineitem-grid-container .lineitem-grid .lineitem-image {
  position: relative;
  height: 200px;
}
.lineitem-grid-container .lineitem-grid .lineitem-image img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  max-width: 90%;
  max-height: 90%;
}
.lineitem-acronym {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  width: 90%;
  height: 90%;
  text-align: center;
  color: var(--medium-gray);
  text-transform: uppercase;
  border: 1px solid var(--light-gray2);
  background-color: var(--cool-grey-three);
  border-radius: 3px;
  margin: 0 auto;
}
.lineitem-grid-container .lineitem-grid .lineitem-detail,
.lineitem-grid-container .lineitem-grid .lineitem-price {
  margin-top: 5px;
}
.lineitem-detail {
  font-size: 13px;
}
.lineitem-price,
.lineitem-description {
  font-size: 15px;
}
.lineitem-description {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  word-break: break-word;
}
.lineitem-price.italic {
  font-size: 12px;
  padding: 0px;
  font-style: italic;
  opacity: 0.8;
}
app-item-alternate .lineitem-price.italic {
  margin-top: 5px;
}
.lineitem-list-container .list-header {
  display: flex;
  align-items: center;
  min-height: 30px;
  max-height: 30px;
  font-size: 12px;
  opacity: .7;
  text-transform: uppercase;
  text-align: end;
  border-bottom: 1px solid var(--light-gray2);
  margin-top: 15px;
}
.lineitem-list-container .text-start {
  text-align: start;
}
.lineitem-list-container .text-center {
  text-align: center;
}
.proposal-container:not(.edit-mode) .lineitem-list-container .list-body-wrapper.active {
  background-color: var(--grid-item-gray);
}
.lineitem-list-container .list-body {
  display: flex;
  text-align: end;
}
.lineitem-list-container.flex-row.start-center {
  border-bottom: 1px solid var(--light-gray2);
}
.proposal-container:not(.edit-mode) .lineitem-list-container .list-body {
  cursor: pointer;
}
.proposal-container:not(.edit-mode) .lineitem-list-container .list-body:not(.sub-alternate):hover {
  background-color: var(--grid-item-gray);
}
.proposal-container:not(.edit-mode) .lineitem-list-container .list-body:hover .item-name {
  color: var(--cool-green);
}
.lineitem-list-container.indent-list {
  padding-left: 60px !important;
}
.lineitem-list-container.indent-list-2 {
  padding-left: 120px !important;
}
.lineitem-list-container .list-body.accessory > div:first-child {
  margin-left: 64px;
}
.lineitem-list-container .list-body > div {
  padding: 20px 0;
  color: var(--navy);
  font-size: 15px;
}
.lineitem-list-container .list-body .list-info-column {
  display: flex;
  flex-direction: column;
  flex: 1 1 100%;
}
.lineitem-list-container .list-body .list-info-column .list-info-row {
  display: flex;
}
.lineitem-list-container .list-body .list-info-column .list-info-row > div,
.lineitem-list-container .list-body > div,
.lineitem-list-container .list-header > div {
  padding-right: 24px;
}
.lineitem-list-container .list-body .list-info-column .list-info-row > div:last-child,
.lineitem-list-container .list-body div:last-child,
.lineitem-list-container .list-header div:last-child {
  padding-right: 0px;
}
.lineitem-list-container .list-detail {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
}
app-item-alternate .lineitem-list-container .list-detail {
  flex-direction: row;
}
.lineitem-list-container .list-body .list-detail {
  line-height: 21px;
}
.lineitem-list-container .list-body .item-name {
  display: flex;
  flex-wrap: wrap;
  line-height: 20px;
}
.lineitem-list-container .list-body .item-name > span {
  margin-right: 5px;
}
.lineitem-list-container .list-body .list-image {
  display: flex;
  position: relative;
  margin-right: 24px;
  height: 100px;
  min-width: 100px;
  width: 100px;
}
app-line-item-drag-and-drop.cdk-drag-preview .lineitem-list-container .list-body > div {
  padding: 10px 24px 10px 0;
  margin: auto;
}
app-line-item-drag-and-drop.cdk-drag-preview app-line-item-drag-and-drop,
app-line-item-drag-and-drop.cdk-drag-preview app-item-alternate {
  display: none !important;
}
app-line-item-drag-and-drop .drag-item-count,
.proposal-accepted .optional-item-toggle {
  display: none !important;
}
app-line-item-drag-and-drop.cdk-drag-preview > .drag-item-count {
  position: absolute;
  bottom: -44px;
  height: 50px;
  background: white;
  border: 1px solid var(--cool-green);
  border-radius: 0px 0px 10px 10px;
  border-top: 1px solid var(--cool-grey);
  display: flex !important;
  box-shadow:
    0 5px 5px -3px rgb(0 0 0 / 20%),
    0 8px 10px 1px rgb(0 0 0 / 14%),
    0 3px 14px 2px rgb(0 0 0 / 12%);
  width: inherit;
  font-size: 15px;
}
.lineitem-list-container .list-body .list-image img,
.cdk-drag.list-body .list-image img {
  max-width: 91%;
  max-height: 91%;
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  left: 0;
  bottom: auto;
}
.lineitem-list-container .list-body .list-image .lineitem-acronym,
.cdk-drag.list-body .list-image .lineitem-acronym {
  height: 91%;
  width: 91%;
}
.lineitem-list-container .list-body .lineitem-description {
  font-size: 14px;
  text-align: start;
}
.lineitem-list-container .list-qty {
  display: flex;
  flex-direction: column;
  flex: 1 1 100%;
  max-width: 85px;
}
.lineitem-list-container .list-price {
  flex: 1 1 100%;
  max-width: 95px;
  display: flex;
  flex-direction: column;
  justify-items: right;
  box-sizing: content-box;
  align-items: flex-end;
}
@media only screen and (max-width: 1280px) {
  .lineitem-list-container .list-price {
    max-width: 85px;
  }
  .lineitem-list-container .list-qty {
    max-width: 75px;
  }
}
@media only screen and (max-width: 900px) {
  .lineitem-list-container .list-body .list-image,
  .cdk-drag.list-body .list-image {
    width: 70px;
    min-width: 70px;
    height: 70px;
  }
}
@media only screen and (max-width: 600px) {
  .lineitem-list-container .list-body > div,
  .lineitem-list-container .list-header > div {
    padding-right: 0px;
    margin-right: 3px;
  }
  .lineitem-section .lineItem-group-header > div:first-child,
  .lineitem-section .lineitem-subgroup-header > div:first-child {
    flex-direction: column;
    align-items: flex-start;
  }
  .lineitem-section .lineItem-group-header .group-name,
  .lineitem-section .lineitem-subgroup-header .group-name {
    margin-bottom: 10;
  }
  .lineitem-list-container .list-price {
    max-width: 75px;
  }
  .lineitem-list-container .list-qty {
    max-width: 70px;
  }
  .lineitem-grid-container .lineitem-grid {
    width: 100%;
  }
  .lineitem-grid-container .lineitem-grid:nth-child(3n+1):after {
    content: none;
  }
  .lineitem-grid-container .lineitem-grid:nth-child(3n+2) .lineitem-grid-inner {
    border: none;
  }
}
.alternate-toggle {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  color: var(--cool-green);
  font-size: 13px;
  margin-top: 5px;
}
.alternate-toggle i {
  font-size: 22px;
  margin-top: 2px;
}
.lineitem-grid-inner .alternate-toggle {
  justify-content: flex-start;
}
.accepted-proposal .alternate-toggle {
  display: none;
}
app-item-alternate {
  padding: 16px;
  display: flex;
  flex-direction: column;
  background-color: var(--grid-item-gray);
}
app-item-alternate .alternate-header {
  font-size: 15px;
  padding-bottom: 10px;
}
app-item-alternate .alternate-description {
  font-family: gilroy-medium;
  font-size: 13px;
  margin-bottom: 10px;
}
app-item-alternate .lineitem-list-container .list-body {
  margin-bottom: 10px;
  border-radius: 5px;
  overflow: hidden;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px 5px;
  border: 1px solid var(--light-gray2);
  margin-right: 3px;
}
app-item-alternate .lineitem-list-container .list-body:not(.sub-alternate):hover {
  background-color: rgba(0, 181, 117, 0.1) !important;
}
app-item-alternate .lineitem-list-container .list-body.active {
  border: 1px solid var(--cool-green);
}
app-item-alternate .lineitem-list-container .list-body > div {
  padding-top: 0;
  padding-bottom: 0;
  font-size: 13px;
  margin: 5px 0px;
}
app-item-alternate .lineitem-list-container .list-body > div:last-child {
  box-sizing: border-box;
  margin-right: -16px;
  padding-right: 21px;
}
app-item-alternate .lineitem-list-container .list-body .list-image,
app-item-alternate .cdk-drag.list-body .list-image {
  width: 54px;
  height: 54px;
  min-width: 54px;
}
.dragDropPlaceholder {
  background: var(--light-gray2);
}
app-line-item-drag-and-drop.cdk-drag-preview {
  height: auto !important;
  border-radius: 10px;
  border: 1px solid var(--cool-green);
}
app-item-alternate .lineitem-list-container .list-body .list-image img,
app-item-alternate .cdk-drag.list-body .list-image img {
  margin: auto;
  top: 0;
  bottom: 0;
}
app-item-alternate .lineitem-list-container .list-body > div .price-difference {
  display: none;
  text-align: center;
}
.lineitem-list-container .list-body > div .price-difference {
  margin-top: 5px;
}
.lineitem-list-container .list-body > div:last-child .price-difference {
  display: block;
}
.lineitem-list-container .list-body > div .price-difference,
.lineitem-grid-container .lineitem-grid .price-difference,
.price-difference {
  font-size: 12px;
  color: var(--cool-green);
  background-color: rgba(14, 158, 39, 0.1);
}
.lineitem-grid-container .lineitem-grid .price-difference,
.price-difference {
  padding: 3px;
  margin-top: 5px;
}
.lineitem-list-container .list-body > div:last-child .price-difference.low,
.lineitem-grid-container .lineitem-grid .price-difference.low,
.price-difference.low {
  color: var(--red);
  background-color: rgba(209, 15, 59, 0.1);
}
.negative-price-diff {
  color: var(--red) !important;
  background-color: rgba(209, 15, 59, 0.1) !important;
}
.lineitem-grid-container app-item-alternate {
  width: 100%;
  border-bottom: 1px solid var(--light-gray2);
}
.lineitem-grid-container app-item-alternate .lineitem-grid {
  border: none !important;
  padding: 20px 10px;
}
.lineitem-grid-container app-item-alternate .lineitem-grid .lineitem-grid-inner {
  border: 1px solid var(--light-gray2) !important;
  background-color: white;
  border-radius: 3px;
}
.lineitem-grid-container app-item-alternate .lineitem-grid.active .lineitem-grid-inner {
  border: 1px solid var(--cool-green) !important;
}
.proposal-container:not(.edit-mode) .lineitem-grid-container app-item-alternate .lineitem-grid:hover .lineitem-grid-inner {
  background-color: rgba(0, 181, 117, 0.1);
  border-bottom: none;
}
.lineitem-grid-container app-item-alternate .lineitem-grid .lineitem-image {
  min-height: 114px;
  height: 114px;
  margin-bottom: 20px;
  display: flex;
}
.lineitem-grid-container app-item-alternate .lineitem-grid .lineitem-image .lineitem-acronym {
  height: 114px;
  width: 114px;
}
.lineitem-grid-container app-item-alternate .lineitem-grid .price-block {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  justify-content: space-between;
}
.radio-button {
  position: relative;
  margin: auto 10px;
  top: 0;
  bottom: 0;
  background: #FFFF;
  z-index: 5;
  border-radius: 50%;
  height: 24px;
  width: 24px;
}
.radio-button.grid-view-radio-button {
  margin: 2px;
}
.radio-button i {
  color: var(--slate-grey);
}
.active.list-body .radio-button i,
.active.lineitem-grid .radio-button i {
  color: var(--cool-green);
}
.disable-alternate .radio-button,
.disable-alternate .destructive {
  display: none;
}
.client-item-preview .proposal-edit-panel {
  top: 0;
}
.bottom-total-price {
  border-top-width: 1px !important;
  border-top-style: solid !important;
  padding: 20px 0 20px 0 !important;
  display: flex;
  justify-content: flex-end !important;
  border-bottom: unset !important;
}
.top-total-price {
  border-top: unset !important;
}
.alternate-border {
  border: unset !important;
  border-bottom: 1px solid var(--silver) !important;
  width: 100%;
  border-radius: unset !important;
  padding-right: 2px !important;
}
.optional-left-tag {
  background: var(--blue);
  width: 32px;
  color: white;
  border-radius: 2px 0px 0px 2px;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
}
.optional-left-tag .rotate-text {
  transform: rotate(-90deg);
  white-space: nowrap;
}
.optional-price {
  clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0% 100%, 30px 50%, 0 0%);
  background: var(--blue);
  padding: 10px 20px 10px 50px;
  color: white !important;
}
.optionalLocAndSys .proposal-optional-item,
.optionalLocAndSys .proposal-optional-item,
.optionalLocAndSys [svgIcon=dragIcon],
.optional-group .optional-header {
  display: none !important;
}
app-proposal-item-template {
  border-bottom: 1px solid var(--light-gray2);
  display: block;
}
.edit-mode .client-select-label {
  display: block !important;
  margin-left: 10px;
}
app-group-header.group-by-none-total .bottom-total-price {
  padding: 0 !important;
  border: none !important;
}
.additional-optional-header {
  font-size: 15px;
  font-family: "gilroy-semi-bold";
  margin-bottom: 10px;
}
.lineitem-list-container .text-start p {
  width: auto !important;
}
.item-sec-tooltip-width .mdc-tooltip__surface {
  max-width: 250px !important;
}

/* src/assets/css/proposal/edit-panel.css */
.proposal-edit-panel {
  display: block;
  flex-direction: column;
  flex: 1 0 100%;
  overflow: hidden;
  left: calc(((100% - 1062px) / 2) + 1062px + 70px);
  height: 100%;
  z-index: 1;
  background-color: white;
}
.proposal-edit-panel .editor-header {
  position: relative;
  display: flex;
  width: 100%;
  height: 55px;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid var(--light-gray2);
  font-size: 15px;
  color: var(--navy);
  font-family: gilroy-medium;
}
.proposal-edit-panel .editor-header .editor-navigation {
  position: absolute;
  left: 10px;
  top: 0;
  bottom: 0;
  margin: auto 0;
  border: 1px solid rgba(32, 48, 65, 0.3);
  border-radius: 5px;
  background-color: var(--cool-grey-three);
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
  height: 25px;
  width: 25px;
  padding: 0px;
  text-align: center;
  cursor: pointer;
}
.proposal-edit-panel .editor-header .editor-navigation i {
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
  color: var(--navy);
}
.proposal-edit-panel .button-group {
  margin: 10px 20px;
}
.proposal-edit-panel .divider {
  height: 1px;
  background-color: var(--light-gray2);
  border: none;
  width: 100%;
}
.proposal-edit-panel .editor-body {
  display: block !important;
  flex-direction: column;
  flex: 1;
  overflow: auto;
  overflow-x: hidden;
  padding-bottom: 30px;
  max-height: calc(100vh - 123px);
  height: 100%;
  width: 280px;
  margin: 0 auto;
}
.proposal-edit-panel .editor-body textarea {
  min-height: 70px;
  padding-top: 5px;
}
.proposal-edit-panel .editor-body .editor-body-header,
.estimate-start-date .editor-body-header {
  font-family: gilroy-medium;
  font-size: 13px;
  color: var(--navy);
  text-transform: uppercase;
  text-align: center;
  margin-top: 20px;
  z-index: 1;
  position: relative;
}
.editor-body-header .edit-option-header {
  background-color: white;
  padding: 0 15px;
  text-transform: capitalize;
  font-family: gilroy-semi-bold;
}
.editor-body-header .split-divider {
  border-bottom: 1px solid #EAECED;
  position: absolute;
  top: 50%;
  width: 100%;
  z-index: -1;
}
.icon-selection-wrapper {
  display: flex;
  flex-wrap: wrap;
  margin-top: 10px;
}
.icon-selection-wrapper > div {
  display: flex;
  flex-direction: column;
  width: 50%;
  justify-content: start;
  align-items: center;
  text-align: center;
  margin-top: 10px;
}
.item-display.icon-selection-wrapper > div {
  width: 25% !important;
}
.extra-margin.icon-selection-wrapper > div {
  margin-top: 25px;
}
.icon-selection-wrapper .icon-container {
  display: flex;
  position: relative;
  height: 52px;
  min-height: 52px;
  width: 52px;
  margin-bottom: 10px;
  border-radius: 2px;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 1px 4px rgb(0 0 0 / 25%);
  border: 1px solid #7E8A96;
  background: #FBFCFD;
}
.item-display.icon-selection-wrapper .icon-container {
  height: 40px !important;
  width: 40px !important;
  min-height: 40px !important;
  font-size: 18px;
  color: var(--medium-gray);
}
app-summary-edit-panel .item-display.icon-selection-wrapper .icon-container {
  height: 48px !important;
  width: 48px !important;
  min-height: 40px !important;
  font-size: 18px;
  color: var(--medium-gray);
}
.item-display .icon-container:hover {
  color: var(--cool-green) !important;
}
.item-display .icon-container.active span {
  color: var(--cool-green) !important;
}
.icon-selection-wrapper .icon-container.active {
  border-color: var(--green-blue);
}
.icon-selection-wrapper .icon-container i {
  font-weight: bold;
}
.proposal-edit-panel form {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.proposal-edit-panel .mat-form-field-wrapper {
  padding-bottom: 0;
}
.proposal-edit-panel .editor-option-container {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.proposal-edit-panel .editor-option-container > * {
  margin: 6px 0;
}
.proposal-edit-panel .editor-option-container .dropdown-with-label {
  height: 35px;
}
#dtCloudApp .proposal-edit-panel .editor-option-container .dropdown-with-label .ng-select.custom-select {
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 0 !important;
}
.proposal-edit-panel .editor-option-container .option-indent {
  margin-left: 20px;
}
.proposal-edit-panel .ng-select.custom-select {
  min-height: 28px;
  margin-top: 0px;
}
.proposal-edit-panel .ng-select.custom-select.option-indent {
  margin-top: 5px;
}
.proposal-edit-panel .editor-option-message {
  margin-top: 0;
  margin-bottom: 5px;
  font-size: 12px;
  color: var(--medium-gray);
}
.flat-button {
  cursor: pointer;
  color: var(--cool-green);
  font-size: 13px;
  font-family: gilroy-medium;
  outline: none;
}
.proposal-edit-panel .editor-empty-message {
  text-align: center;
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 12px;
  font-style: italic;
  margin-top: 10px;
}
.proposal-edit-panel .gallery-files-container {
  display: grid;
  grid-template-columns: auto auto;
  grid-gap: 15px 15px;
  margin: 10px;
}
.proposal-edit-panel .gallery-files-container .gallery-file,
.casestudy-gallery-file {
  position: relative;
  overflow: hidden;
  height: 60px;
  width: 113px;
  background-color: lightgray;
  border-radius: 9px;
}
.proposal-edit-panel .gallery-files-container .gallery-file img,
.casestudy-gallery-file img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  -o-object-fit: cover;
  object-position: center;
  -o-object-position: center;
  vertical-align: middle;
}
.proposal-edit-panel .gallery-files-container .gallery-file video,
.casestudy-gallery-file video {
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.proposal-edit-panel .file-name {
  font-family: gilroy-medium;
  font-size: 13px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--navy);
}
.proposal-edit-panel .attachment-image {
  padding: 0 15px;
  border-bottom: 1px solid var(--light-gray2);
}
.proposal-edit-panel .attachment-image i {
  font-size: 16px;
  cursor: pointer;
}
@media only screen and (max-width: 1762px) {
  .proposal-edit-panel {
    left: auto;
    right: 0;
  }
}
app-proposal-present app-proposal-item-preview .proposal-edit-panel {
  top: 0;
}
app-proposal-whiteboard .proposal-edit-panel,
app-proposal-interconnect .proposal-edit-panel {
  position: absolute;
  top: 65px;
  height: calc(100% - 70px);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 15px 10px 0 rgba(0, 0, 0, 0.19);
  right: 0px;
}
.editor-navigation + span {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
}

/* src/assets/css/proposal/labor.css */
.labor-section .labor-summary-column {
  display: flex;
  height: 75px;
  border-bottom: 1px solid var(--light-gray2);
  font-size: 16px;
}
.labor-section .labor-summary-column:last-child {
  border-bottom: none;
}
.labor-section .labor-summary-column > div {
  display: flex;
  width: 20%;
  text-align: end;
  justify-content: flex-end;
  align-items: center;
  word-break: break-word;
}
@media only screen and (max-width: 600px) {
  .labor-section .labor-summary-column .labor-time {
    display: none !important;
  }
  .labor-section .labor-summary-column > div {
    width: auto !important;
  }
  .labor-section .labor-summary-column > div:not(:last-child) {
    padding-right: 15px;
  }
}
.labor-section .labor-summary-column > div.labor-name,
.labor-section .labor-summary-column > div.labor-total:first-child {
  width: auto;
  flex: 1;
  text-align: start;
  justify-content: flex-start;
}
.labor-section .labor-summary-column > div.labor-total {
  font-size: 18px;
  opacity: 1 !important;
  font-weight: 700 !important;
}
.labor-section .labor-summary-column > div:not(.labor-name) {
  opacity: .8;
}

/* src/assets/css/proposal/gallery.css */
.gallery-section.proposal-section {
  margin: 10px;
}
.gallery-grid-container {
  display: grid;
  grid-template-columns: calc(50% - 5px) calc(50% - 5px);
  grid-gap: 10px 10px;
  padding: 10px;
}
.gallery-grid-item {
  position: relative;
  height: 300px;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.3);
}
.gallery-grid-item:after {
  display: block;
  position: absolute;
  opacity: 0.8;
  top: 0;
  width: 100%;
  content: "";
  z-index: 1;
  border-radius: 8px;
}
.gallery-grid-item.with-overlay-text:after {
  background-color: rgba(0, 0, 0, 0.46);
  background:
    linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(0, 0, 0, 0) 100%);
}
.gallery-grid-container .gallery-grid-item img,
.gallery-grid-container .gallery-grid-item video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  -o-object-fit: cover;
  object-position: center;
  -o-object-position: center;
  vertical-align: middle;
}
.gallery-grid-container .gallery-grid-item.scale-image img,
.gallery-grid-container .gallery-grid-item.scale-image video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  -o-object-fit: contain;
  object-position: center;
  -o-object-position: center;
  vertical-align: middle;
}
.gallery-grid-container .gallery-grid-item img {
  background-color: white;
}
.gallery-grid-container .gallery-grid-item .whiteBoard {
  -o-object-fit: contain;
  object-fit: contain;
}
.gallery-grid-container .gallery-grid-item video {
  object-fit: contain;
  -o-object-fit: contain;
  object-position: center;
  -o-object-position: center;
  background-color: rgba(0, 0, 0, 0.1);
}
.gallery-grid-container .gallery-grid-item app-proposal-hotspot-image {
  display: block;
  height: 100%;
}
.gallery-grid-container .gallery-grid-item app-proposal-hotspot-image .hotspot-component {
  height: 100% !important;
}
.gallery-grid-container .gallery-grid-item .play-button {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.4);
  cursor: pointer;
  width: 95px;
  height: 95px;
  z-index: 2;
}
.gallery-grid-container .gallery-grid-item .gallery-title {
  width: calc(100% - 48px);
  box-sizing: content-box;
  padding: 15px 24px;
  padding-bottom: 0px;
  position: absolute;
  height: 45px;
  max-height: 45px;
  top: 0;
  color: #F2F4F6;
  font-size: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  z-index: 2;
  padding-left: 50px;
}
.gallery-grid-container .gallery-grid-item .gallery-button,
.modus360FullViewBtn {
  text-transform: unset;
  position: absolute;
  background-color: white;
  border-radius: 5px;
  min-width: 91px;
  height: 29px;
  color: var(--green-blue);
  font-size: 14px;
  line-height: 15px;
  left: 10px;
  bottom: 10px;
  z-index: 2;
  border: none;
  cursor: pointer;
}
.gallery-grid-container .gallery-grid-item .play-button:after {
  content: "";
  display: block;
  width: 0px;
  height: 0px;
  border: 25px solid white;
  border-bottom: 15px solid transparent;
  border-top: 15px solid transparent;
  border-right: 15px solid transparent;
  background-color: transparent;
  opacity: 0.9;
  margin: 33px 0 0px 40px;
}
.gallery-grid-container.three_1 .gallery-grid-item:nth-child(3n+1) {
  grid-column: 1 / span 2;
}
.gallery-grid-container.three_1 .gallery-grid-item {
  grid-column: span 1;
}
.gallery-grid-container.three_2 .gallery-grid-item {
  grid-column: 1 / span 2;
}
.gallery-grid-container.three_3 {
  grid-template-columns: calc((100% / 3) - 6px) calc((100% / 3) - 6px) calc((100% / 3) - 6px);
}
.gallery-grid-container.three_3 .gallery-grid-item {
  grid-column: span 1;
}
.gallery-grid-container.three_4 {
  grid-template-columns: 70% auto;
}
.gallery-grid-container.three_4 .gallery-grid-item {
  height: 150px;
}
.gallery-grid-container.three_4 .gallery-grid-item:nth-child(3n+1) {
  grid-row: span 4;
  grid-column: 1;
  min-height: 310px;
}
.gallery-grid-container.four_1 .gallery-grid-item {
  grid-column: span 1;
}
.gallery-grid-container.four_2 .gallery-grid-item {
  grid-column: 1 / span 2;
}
.gallery-grid-container.four_3 {
  grid-template-columns: calc((100% / 4) - 7px) calc((100% / 4) - 7px) calc((100% / 4) - 6px) calc((100% / 4) - 6px);
}
.gallery-grid-container.four_3 .gallery-grid-item {
  grid-column: span 1;
}
@media screen and (max-width: 600px) {
  .gallery-grid-container {
    grid-template-columns: 100% !important;
  }
  .gallery-grid-container .gallery-grid-item {
    grid-column: span 1 !important;
    height: 200px;
  }
  .gallery-grid-container .gallery-grid-item .gallery-title {
    white-space: nowrap;
    font-size: 15px;
    height: 35px;
    max-height: 35px;
    display: block;
  }
}
.embed-load-img {
  transition: .5s;
  height: 138px;
  width: 100%;
  transform: scale(0);
}
.embed-load-img.new-img {
  transform: scale(1) !important;
}
.gallery-drag {
  cursor: move !important;
  position: absolute;
  top: 15px;
  z-index: 5;
  left: 15px;
  opacity: .8;
  background: white;
  border-radius: 50%;
  box-shadow: 0px 0px 4px 6px white;
}
.proposal-gallery-preview.cdk-drag-preview {
  box-sizing: border-box;
  border-radius: 4px;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, 0.2),
    0 8px 10px 1px rgba(0, 0, 0, 0.14),
    0 3px 14px 2px rgba(0, 0, 0, 0.12);
  height: 200px !important;
  width: 250px !important;
  overflow: hidden;
}
.proposal-gallery-preview.cdk-drag-preview app-proposal-hotspot-image,
.proposal-gallery-preview.cdk-drag-preview img,
.proposal-gallery-preview.cdk-drag-preview video,
.proposal-gallery-preview.cdk-drag-preview iframe {
  height: 200px !important;
  width: 250px !important;
}
.cdk-drag-animating {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.child-selector.gallery-grid-container {
  display: block;
}
.child-selector.three_4.gallery-grid-container {
  display: grid !important;
}
.child-selector .gallery-grid-item {
  margin: 5px 5px;
}
.child-selector.three_1 .gallery-grid-item:nth-child(3n+1) {
  width: 100%;
}
.child-selector.three_1 .gallery-grid-item {
  width: calc(50% - 10px);
  display: inline-block;
}
.child-selector.four_2 .gallery-grid-item,
.child-selector.three_2 .gallery-grid-item {
  width: 100%;
  display: inline-block;
}
.child-selector.three_3 .gallery-grid-item {
  width: 31%;
  display: inline-block;
}
.child-selector.four_1 .gallery-grid-item {
  width: 48%;
  display: inline-block;
}
.child-selector.four_3 .gallery-grid-item {
  width: 23%;
  display: inline-block;
}

/* src/assets/css/proposal/contract.css */
.contract-section {
  display: flex;
  flex-direction: column;
}
.contract-section .contract-column {
  display: flex;
  min-height: 50px;
}
.contract-section .contract-column .contract-stepper {
  position: relative;
  min-width: 50px;
}
.contract-section .contract-column .contract-stepper > div {
  position: absolute;
  height: 15px;
  width: 15px;
  border: 1px solid #a3a6aa;
  border-radius: 50%;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 0;
  z-index: 1;
  background-color: white;
}
.contract-section .contract-column .contract-content {
  display: flex;
  align-items: center;
  flex: 1;
  border-bottom: 1px solid var(--light-gray2);
  min-height: 100%;
  padding: 10px 0;
}
.contract-section .contract-column:last-child .contract-content {
  border: none;
}
.contract-section .contract-column .contract-content .contract-name {
  flex: 1;
  margin: 0px;
  font-weight: 700 !important;
  font-size: 16px;
}
.contract-section .contract-column .contract-content .contract-amount,
.contract-section .contract-column .contract-content .contract-date {
  margin: 0px;
  font-size: 16px;
  flex: 1 1 100%;
  max-width: 20%;
  text-align: end;
  opacity: .8;
}
.header-contract-date {
  max-width: 125px;
  width: 100%;
  text-align: right;
  font-size: 15px;
}
@media (max-width: 599px) {
  .contract-section .contract-column .contract-content .contract-amount {
    min-width: 90px;
  }
}
@media only screen and (max-width: 1062px) {
  .contract-section .contract-column .contract-stepper {
    display: none;
  }
}
.timeline-border {
  border: 1px solid red;
  height: 100%;
  position: absolute;
  left: 6px;
  top: 50%;
}
.contract-column:last-child .timeline-border {
  display: none;
}

/* src/assets/css/proposal/attachment.css */
.attachment-grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-gap: 1rem;
  padding: 20px 0;
}
.attachment-grid-container .attachment-grid {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  background-color: var(--white);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07);
  border: 1px solid var(--light-gray2);
  border-radius: 13px;
}
.attachment-list-container {
  display: flex;
  flex-direction: column;
}
.attachment-list-container .attachment-list-item {
  display: flex;
  cursor: pointer;
}
.attachment-list-container .attachment-list-item {
  border-bottom: 1px solid var(--light-gray2);
  padding: 15px;
}
.attachment-list-container .attachment-list-item:last-child {
  border-bottom: none;
}
.proposal-section app-file-grid {
  width: 100% !important;
  height: 100% !important;
}
.proposal-section app-file-grid .attachments-overlay {
  margin: unset !important;
  border: unset !important;
}
.proposal-section .attachment-list-item app-file-grid .attachments-overlay {
  display: flex;
  flex-direction: column;
}
.proposal-section .attachment-list-item app-file-grid .hover-position {
  display: none !important;
}
.proposal-section app-file-grid .attachment-image-container,
.proposal-section app-file-grid .attachment-name {
  max-width: unset !important;
}
.proposal-section .attachment-list-item app-file-grid .attachment-name {
  display: flex !important;
  align-items: center;
  border: unset !important;
}
app-attachment-edit-panel .editor-body {
  max-height: calc(100% - 100px) !important;
}

/* src/assets/css/proposal/summary.css */
.summary-column {
  display: flex;
  flex: 1;
  font-size: 16px;
  min-height: 75px;
  border-bottom: 1px solid var(--light-gray2);
  align-items: center;
  justify-content: space-between;
}
.summary-column:last-child {
  border-bottom: none;
}
.summary-column:first-child,
.summary-column.summary-subtotal:first-child {
  border-top: none;
}
.summary-column.summary-total {
  font-weight: 700 !important;
  font-size: 18px;
}
.summary-column.summary-subtotal {
  border-top: 1px solid var(--light-gray2);
  font-weight: 700 !important;
}
.summary-column .summary-price {
  opacity: .8;
}
.summary-column.then-system-or-loc {
  font-size: 13px !important;
  padding-left: 20px;
}

/* src/assets/css/proposal/file-upload.css */
.proposal-file-upload .img-upload {
  min-width: 100%;
  height: 200px;
  border-radius: 3px;
  overflow: hidden;
}
.proposal-file-upload.cover-image-container .img-upload {
  min-width: 100%;
  min-height: 138px;
  max-height: 100px;
  border-radius: 3px;
  border-color: transparent;
}
.proposal-file-upload.gallery-image-container {
  margin-bottom: 10px;
}
.proposal-file-upload.gallery-image-container .dropzone {
  border-radius: 9px;
}
.proposal-file-upload.strech-image .img-upload .drop-image-container img {
  position: relative;
  object-fit: cover;
  -o-object-fit: cover;
  object-position: center;
  -o-object-position: center;
  vertical-align: middle;
  width: 100%;
  height: 100%;
}

/* src/assets/css/proposal/print-proposal.css */
body > .print-outlet {
  margin-right: 48px;
  margin-left: 48px;
}
.print-outlet {
  display: none;
}
.print-outlet :not(app-proposal-executive-summary) .proposal-section {
  margin: 0;
  page-break-inside: avoid;
}
.print-outlet app-proposal-print-cover {
  display: block;
}
.print-outlet .proposal-margin {
  margin: 0;
}
.lineitem-grid-container .print-wrapper {
  display: flex;
  flex: 1 1 100%;
  flex-direction: column;
}
.item-grid-print-wrapper .print-wrapper {
  display: flex;
  flex-direction: row;
  flex: 1 1 100%;
}
.print-container {
  display: none;
}
.print-bottom-border .bottom-total-price {
  border: unset !important;
}
@media print {
  .proposal-section-description img {
    display: block !important;
    page-break-inside: avoid !important;
    break-inside: avoid-page !important;
    break-before: auto;
    break-after: auto;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    page-break-inside: avoid !important;
    break-inside: avoid-page !important;
    overflow: visible !important;
    max-height: 250mm !important;
  }
  .portfolio-list {
    position: relative;
  }
  .print-portfolio {
    float: left;
    padding: 10px;
    shape-outside: margin-box;
    margin: 0 15px 10px 0;
  }
  .portfolio-list.portfolio-reverse-order .print-portfolio {
    float: right !important;
    margin: 0 0 10px 15px;
    shape-outside: margin-box;
  }
  .portfolio-list.alternate-gallery:nth-of-type(even) .print-portfolio {
    float: right !important;
    margin: 0 0 10px 15px;
    shape-outside: margin-box;
  }
  .portfolio-list.alternate-gallery:nth-of-type(odd) .print-portfolio {
    float: left !important;
    margin: 0 15px 10px 0;
    shape-outside: margin-box;
  }
  .portfolio-image {
    min-width: 200px !important;
    min-height: 200px !important;
    max-width: 200px !important;
    max-height: 200px !important;
  }
  .portfolio-list::after {
    content: "";
    display: block;
    clear: both;
  }
  * {
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
  }
  .print-cover.cover {
    page-break-after: always !important;
    page-break-inside: avoid !important;
  }
  body#dtCloudApp {
    display: block;
    overflow: auto;
    background-color: white;
  }
  body#dtCloudApp > .print-outlet {
    display: block;
  }
  .continuous .proposal-section {
    margin: 20px 0 0 0 !important;
  }
  .quick-proposal app-print-wrapper .print-wrapper {
    page-break-inside: auto !important;
  }
  app-print-wrapper .print-wrapper,
  app-line-item-drag-and-drop,
  .lineitem-grid-container,
  .portfolio-list {
    page-break-inside: avoid;
  }
  .plan-feature {
    display: block;
  }
  .plan-feature li {
    padding: 9px 0 7px 0;
    margin: 0 !important;
    page-break-inside: avoid !important;
  }
  app-proposal-executive-summary app-group-header,
  .plan-feature li {
    page-break-inside: avoid !important;
  }
  .gallery-grid-item {
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }
  .proposal-gallery-preview > * {
    display: inline-block !important;
    width: 100%;
    page-break-inside: avoid !important;
  }
  .print-outlet app-proposal-description .proposal-section {
    page-break-inside: auto !important;
  }
  app-group-header {
    page-break-inside: auto;
  }
  app-print-wrapper.lineitem-section {
    page-break-inside: auto;
  }
  app-print-wrapper.lineitem-section > .print-wrapper {
    page-break-inside: auto;
  }
  .print-cover-footer > div {
    margin-bottom: 24px;
  }
  .print-outlet:not(.quick-proposal) .proposal-section .with-outer-border,
  app-proposal-signature .proposal-section .with-outer-border,
  .print-outlet:not(.quick-proposal) .proposal-section.with-outer-border,
  app-proposal-signature .proposal-section.with-outer-border {
    border: none;
  }
  .alternate-toggle {
    display: none;
  }
  .lineitem-list-container .list-body .lineitem-description {
    margin-top: 5px;
  }
  .lineitem-grid-inner:hover .lineitem-description {
    display: block;
    max-width: unset;
  }
  .lineitem-description {
    max-height: unset;
    text-overflow: ellipsis;
    display: block !important;
  }
  .section-break app-proposal-print-cover,
  .section-break .lineitem-section,
  .section-break app-proposal-description,
  .section-break app-proposal-summary,
  .section-break app-proposal-labor,
  .section-break app-proposal-summary,
  .section-break app-proposal-contract,
  .section-break app-proposal-professional-license,
  .section-break app-meet-the-team,
  .section-break app-proposal-testimonial,
  .section-break app-proposal-awards,
  .section-break app-proposal-gallery,
  .section-break app-proposal-social-media,
  .section-break app-proposal-portfolio,
  .section-break app-proposal-executive-summary,
  .section-break app-proposal-service-plans,
  .section-break app-proposal-modus360 {
    display: block;
    page-break-after: always;
  }
  .proposal-section-header {
    padding: 0 0 15px 0;
  }
  .lineitem-section .lineItem-group-header > div:first-child {
    padding-top: 20px;
  }
  .lineitem-section .lineItem-group-header > div:first-child,
  .lineitem-section .lineitem-subgroup-header > div:first-child {
    border-top: unset;
  }
  .lineitem-section .lineItem-group-header,
  .lineitem-section .lineitem-subgroup-header {
    margin-top: 15px;
  }
  app-print-wrapper .proposal-section-header {
    border-bottom: 1px solid var(--light-gray2);
  }
  .lineitem-list-container .list-body .list-image img {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .lineitem-list-container .list-body .list-image {
    align-items: center;
  }
  .lineitem-list-container .list-body > div {
    padding: 10px 0;
  }
  .print-wrapper.pdf-padding {
    padding-bottom: 40px;
  }
  iframe.iframe-Embed,
  .optional-item-toggle,
  .optionalLocAndSys .optional-header {
    display: none !important;
  }
  .view-gallery {
    display: none;
  }
  .column-2-grid {
    display: block;
  }
  .print-testimonial {
    padding-top: 1px;
    page-break-inside: avoid;
  }
  .testimonial-container {
    padding: 53px 20px 20px;
    margin: 50px 0px 20px;
  }
  .testimonial-img-container {
    top: -50px;
    transform: translateX(50%);
    right: 50%;
  }
  .quick-proposal .testimonial-container {
    padding: 20px 20px 20px 55px;
    margin: 0 0 15px 20px !important;
  }
  .quick-proposal .testimonial-img-container {
    top: 50%;
    transform: translate(-50%, -50%);
    left: 0;
    right: unset;
  }
  app-proposal-summary,
  app-proposal-executive-summary .summary-detail-section,
  .grid-item {
    display: block !important;
    page-break-inside: avoid;
  }
  .optional-left-tag {
    padding: 10px;
    width: auto;
    margin-right: 0;
    font-size: 13px;
  }
  .quick-proposal .quick-cover-customer span,
  .quick-proposal .prepared-by .cover-company-details > * {
    display: block;
    font-size: 14px;
    line-height: 19px;
  }
  .quick-proposal app-list-header,
  .quick-proposal app-line-item-drag-and-drop .lineitem-list-container {
    border: 1px solid;
  }
  .quick-proposal .top-total-price {
    padding: 0px 0 10px !important;
  }
  app-proposal-executive-summary app-group-header.proposal-margin .top-total-price {
    padding: 5px 30px 5px 0 !important;
  }
  .quick-proposal .lineitem-list-container .list-body,
  app-proposal-portfolio .contract-section {
    border: unset !important;
  }
  .quick-proposal app-line-item-drag-and-drop .lineitem-list-container {
    border-top: 0 !important;
  }
  .quick-proposal .line-item-total {
    margin-bottom: 20px;
  }
  .quick-proposal .print-wrapper.pdf-padding {
    padding-bottom: 0 !important;
  }
  .quick-proposal .line-item-total {
    border: 1px solid;
  }
  .quick-proposal .quick-quote-header {
    margin-top: 20px;
  }
  .print-outlet app-item-alternate .radio-button,
  .print-outlet app-item-alternate .destructive {
    display: none !important;
  }
  .print-outlet .grid-team-image {
    min-height: 100px !important;
    max-height: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
  }
  .print-outlet .gallery-grid-item {
    height: 250px;
    page-break-inside: avoid;
  }
  .print-outlet .gallery-grid-item.mobile-view-modus {
    height: 400px !important;
    page-break-inside: avoid;
  }
  .print-outlet app-meet-the-team {
    display: block;
    margin-bottom: 40px;
  }
  .print-outlet .group-total-none .bottom-total-price {
    border: none !important;
  }
  .print-outlet .group-total-none .group-price > label {
    margin-left: 15px;
  }
  .print-outlet .group-total-none .group-price > span {
    margin-left: 5px;
  }
  .attachments-overlay .hover-position {
    display: none !important;
  }
  .print-cover {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 950px;
    padding: 25px 0px;
    border: none;
  }
  .print-cover > div {
    display: flex;
    width: 100%;
    margin-bottom: 20px;
    flex-direction: column;
  }
  .print-cover-customer,
  .print-cover-footer {
    flex-direction: column;
  }
  .print-cover-footer > div {
    padding-top: 15px;
  }
  .print-cover-footer label {
    color: var(--navy);
    font-size: 14px;
  }
  .print-footer-detail {
    color: var(--navy);
    font-weight: 700 !important;
    font-size: 16px;
    padding-top: 5px;
  }
  .print-cover-customer .cover-client-name,
  .print-cover-customer .cover-client-address {
    display: block;
    font-size: 16px;
    line-height: 19px;
  }
  .print-cover-customer .cover-client-name {
    font-weight: 700 !important;
  }
  .print-cover-name {
    color: #01162F;
    font-size: 40px;
    margin-top: 20px;
  }
  .print-cover-customer .cover-client-address {
    font-size: 14px;
    line-height: 19px;
    margin: 8px 0 0 0;
    -webkit-line-clamp: 3;
  }
  .print-cover-company {
    display: flex;
    flex-direction: row;
  }
  .print-cover-company > div {
    margin-bottom: 5px;
  }
  .print-cover-image {
    height: 300px;
  }
  .print-cover-image .cover-bg-color {
    width: 100%;
    height: 100%;
  }
  .signature-section {
    padding-bottom: 50px;
  }
  .signature-info {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    position: relative;
    font-size: 18px;
    max-height: 185px;
    min-height: 90px;
    border-bottom: 2px solid var(--dark-blue);
    padding-bottom: 10px;
    padding-left: 10px;
    font-weight: 600 !important;
    word-break: break-word;
  }
  .signature-info img {
    position: absolute;
    margin: 0;
    left: 0;
    bottom: 0;
    height: 83%;
  }
  .signature-title {
    min-height: 15px;
    font-size: 13px;
    line-height: 15px;
    text-align: center;
    padding: 5px 0;
    width: 100%;
  }
  .mat-divider {
    display: block;
    margin: 0;
    border-top-style: solid;
    border-top-color: var(--mat-divider-color);
    border-top-width: var(--mat-divider-width);
  }
}

/* src/assets/css/proposal/proposal-font.css */
.proposal-font.font-gilroy .regular,
.proposal-font.font-gilroy .proposal-section-header.regular,
.proposal-font.font-gilroy quick-quote-header.regular,
.proposal-font.font-gilroy app-quick-proposal-side-panel.regular > *,
.proposal-font.font-gilroy .lineitem-list-container .list-body .item-name.regular,
.proposal-font.font-gilroy .lineitem-list-container .list-body .link,
.proposal-font.font-gilroy .lineitem-list-container .list-body .list-info-column.regular,
.proposal-font.font-gilroy app-proposal-quote-cover.regular * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy app-proposal-change-order-cover.regular * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy .summary-detail-section.regular,
.proposal-font.font-gilroy .proposal-attachment.regular,
.proposal-font.font-gilroy .labor-font.regular,
.proposal-font.font-gilroy .column-2-grid.regular,
.proposal-font.font-gilroy app-list-header.regular,
.proposal-font.font-gilroy .gallery-grid-container.regular,
.proposal-font.font-gilroy app-item-alternate .regular,
.proposal-font.font-gilroy app-grid-item .regular,
.proposal-font.font-gilroy .contract-content.regular,
.proposal-font.font-gilroy app-proposal-signature .regular,
.proposal-font.font-gilroy app-group-header label.regular,
.proposal-font.font-gilroy app-proposal-print-cover .print-cover-name,
.cover .cover-company .proposal-font.font-gilroy app-group-header .group-price.regular,
.proposal-font.font-gilroy .group-name.regular,
.proposal-font.font-gilroy app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-gilroy app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy .radio-header > *,
.proposal-font.font-gilroy app-proposal-portfolio > *,
.proposal-font.font-gilroy app-proposal-labor > *,
.proposal-font.font-gilroy app-proposal-labor > * .labor-total,
.proposal-font.font-gilroy app-proposal-professional-license > *,
.proposal-font.font-gilroy app-meet-the-team > *,
.proposal-font.font-gilroy .radio-info,
.proposal-font.font-gilroy label,
.proposal-font.font-gilroy a,
.proposal-font.font-gilroy .status-tag,
.proposal-font.font-gilroy .list-header > * {
  font-family: gilroy-regular !important;
}
.proposal-font.font-gilroy .medium,
.proposal-font.font-gilroy .quick-quote-header.medium,
.proposal-font.font-gilroy .proposal-section-header.medium,
.proposal-font.font-gilroy app-quick-proposal-side-panel.medium > *,
.proposal-font.font-gilroy .lineitem-list-container .list-body .item-name.medium,
.proposal-font.font-gilroy .lineitem-list-container .list-body .link,
.proposal-font.font-gilroy .lineitem-list-container .list-body .list-info-column.medium,
.proposal-font.font-gilroy .summary-detail-section.medium,
.proposal-font.font-gilroy .proposal-attachment.medium,
.proposal-font.font-gilroy .labor-font.medium,
.proposal-font.font-gilroy .column-2-grid.medium,
.proposal-font.font-gilroy app-list-header.medium,
.proposal-font.font-gilroy .contract-content.medium,
.proposal-font.font-gilroy app-proposal-signature .medium,
.proposal-font.font-gilroy .gallery-grid-container.medium,
.proposal-font.font-gilroy app-item-alternate .medium,
.proposal-font.font-gilroy app-grid-item .medium,
.proposal-font.font-gilroy app-group-header label.medium,
.proposal-font.font-gilroy app-group-header .group-price.medium,
.proposal-font.font-gilroy app-proposal-print-cover .cover .cover-company,
.proposal-font.font-gilroy app-proposal-print-cover .print-cover-customer .cover-client-address,
.proposal-font.font-gilroy app-proposal-print-cover .print-cover-customer .print-cover-footer label,
.proposal-font.font-gilroy app-proposal-quote-cover.medium * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy app-proposal-change-order-cover.medium * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy .group-name.medium,
app-font-edit-panel .font-gilroy,
.proposal-font.font-gilroy .description-section,
.proposal-font.font-gilroy app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-gilroy app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy .radio-header > *,
.proposal-font.font-gilroy app-proposal-portfolio > *,
.proposal-font.font-gilroy app-proposal-labor > *,
.proposal-font.font-gilroy app-proposal-labor > * .labor-total,
.proposal-font.font-gilroy app-proposal-professional-license > *,
.proposal-font.font-gilroy app-meet-the-team > *,
.proposal-font.font-gilroy .radio-info,
.proposal-font.font-gilroy label,
.proposal-font.font-gilroy a,
.proposal-font.font-gilroy .status-tag,
.proposal-font.font-gilroy .list-header > * {
  font-family: gilroy-medium !important;
}
.proposal-font.font-gilroy .semi-bold,
.proposal-font.font-gilroy .proposal-section-header.semi-bold,
.proposal-font.font-gilroy .quick-quote-header.semi-bold,
.proposal-font.font-gilroy app-quick-proposal-side-panel.semi-bold > *,
.proposal-font.font-gilroy .lineitem-list-container .list-body .item-name.semi-bold,
.proposal-font.font-gilroy .lineitem-list-container .list-body .link,
.proposal-font.font-gilroy .lineitem-list-container .list-body .list-info-column.semi-bold,
.proposal-font.font-gilroy app-proposal-quote-cover.semi-bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy app-proposal-change-order-cover.semi-bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy .summary-detail-section.semi-bold,
.proposal-font.font-gilroy .proposal-attachment.semi-bold,
.proposal-font.font-gilroy .labor-font.semi-bold,
.proposal-font.font-gilroy app-list-header.semi-bold,
.proposal-font.font-gilroy .column-2-grid.semi-bold,
.proposal-font.font-gilroy .contract-content.semi-bold,
.proposal-font.font-gilroy app-proposal-signature .semi-bold,
.proposal-font.font-gilroy .gallery-grid-container.semi-bold,
.proposal-font.font-gilroy app-item-alternate .semi-bold,
.proposal-font.font-gilroy app-grid-item .semi-bold,
.proposal-font.font-gilroy app-group-header label.semi-bold,
.proposal-font.font-gilroy app-group-header .group-price.semi-bold,
.proposal-font.font-gilroy .group-name.semi-bold,
.proposal-font.font-gilroy app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-gilroy app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy .radio-header > *,
.proposal-font.font-gilroy app-proposal-portfolio > *,
.proposal-font.font-gilroy app-proposal-labor > *,
.proposal-font.font-gilroy app-proposal-labor > * .labor-total,
.proposal-font.font-gilroy app-proposal-professional-license > *,
.proposal-font.font-gilroy app-meet-the-team > *,
.proposal-font.font-gilroy .radio-info,
.proposal-font.font-gilroy label,
.proposal-font.font-gilroy a,
.proposal-font.font-gilroy .status-tag,
.proposal-font.font-gilroy .list-header > * {
  font-family: gilroy-semi-bold !important;
}
.proposal-font.font-gilroy .bold,
.proposal-font.font-gilroy .quick-quote-header.bold,
.proposal-font.font-gilroy .proposal-section-header.bold,
.proposal-font.font-gilroy app-quick-proposal-side-panel.bold > *,
.proposal-font.font-gilroy .lineitem-list-container .list-body .link,
.proposal-font.font-gilroy .lineitem-list-container .list-body .item-name.bold,
.proposal-font.font-gilroy app-proposal-quote-cover.bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy app-proposal-change-order-cover.bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-gilroy .lineitem-list-container .list-body .list-info-column.bold,
.proposal-font.font-gilroy .summary-detail-section.bold,
.proposal-font.font-gilroy .proposal-attachment.bold,
.proposal-font.font-gilroy .labor-font.bold,
.proposal-font.font-gilroy .column-2-grid.bold,
.proposal-font.font-gilroy app-list-header.bold,
.proposal-font.font-gilroy .contract-content.bold,
.proposal-font.font-gilroy app-proposal-signature .bold,
.proposal-font.font-gilroy .gallery-grid-container.bold,
.proposal-font.font-gilroy app-item-alternate .bold,
.proposal-font.font-gilroy app-grid-item .bold,
.proposal-font.font-gilroy app-group-header label.bold,
.proposal-font.font-gilroy app-group-header .group-price.bold,
.proposal-font.font-gilroy app-proposal-print-cover .print-cover-customer .cover-client-name,
.proposal-font.font-gilroy app-proposal-print-cover .print-cover-customer .print-footer-detail,
.proposal-font.font-gilroy .group-name.bold,
.proposal-font.font-gilroy app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-gilroy app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-gilroy .radio-header > *,
.proposal-font.font-gilroy app-proposal-portfolio > *,
.proposal-font.font-gilroy app-proposal-labor > *,
.proposal-font.font-gilroy app-proposal-labor > * .labor-total,
.proposal-font.font-gilroy app-proposal-professional-license > *,
.proposal-font.font-gilroy app-meet-the-team > *,
.proposal-font.font-gilroy .radio-info,
.proposal-font.font-gilroy label,
.proposal-font.font-gilroy a,
.proposal-font.font-gilroy .status-tag,
.proposal-font.font-gilroy .list-header > * {
  font-family: gilroy-bold !important;
}
.proposal-font.font-arial,
.proposal-font.font-arial .proposal-section-header,
.proposal-font.font-arial .quick-quote-header,
.proposal-font.font-arial app-quick-proposal-side-panel > *,
.proposal-font.font-arial .lineitem-list-container .list-body .link,
.proposal-font.font-arial .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-arial .summary-detail-section,
.proposal-font.font-arial .proposal-attachment,
.proposal-font.font-arial .labor-font,
.proposal-font.font-arial app-list-header,
.proposal-font.font-arial .contract-content,
.proposal-font.font-arial app-proposal-signature,
.proposal-font.font-arial .gallery-grid-container,
.proposal-font.font-arial app-item-alternate,
.proposal-font.font-arial app-grid-item,
.proposal-font.font-arial app-proposal-print-cover,
.proposal-font.font-arial app-proposal-print-cover label,
.proposal-font.font-arial app-group-header label,
.proposal-font.font-arial app-group-header .group-price,
.proposal-font.font-arial app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-arial app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-arial .description-section,
.proposal-font.font-arial .group-name,
.proposal-font.font-arial app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-arial app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-arial app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-arial .radio-header > *,
.proposal-font.font-arial app-proposal-portfolio > *,
.proposal-font.font-arial app-proposal-labor > *,
.proposal-font.font-arial app-proposal-labor > * .labor-total,
.proposal-font.font-arial app-proposal-professional-license > *,
.proposal-font.font-arial app-meet-the-team > *,
.proposal-font.font-arial .radio-info,
.proposal-font.font-arial label,
.proposal-font.font-arial a,
.proposal-font.font-arial .status-tag,
.proposal-font.font-arial .list-header > *,
app-font-edit-panel .font-arial {
  font-family: Arial, sans-serif !important;
}
.proposal-font.font-verdana,
.proposal-font.font-verdana .quick-quote-header,
.proposal-font.font-verdana .proposal-section-header,
.proposal-font.font-verdana app-quick-proposal-side-panel > *,
.proposal-font.font-verdana .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-verdana .lineitem-list-container .list-body .link,
.proposal-font.font-verdana .summary-detail-section,
.proposal-font.font-verdana .proposal-attachment,
.proposal-font.font-verdana .labor-font,
.proposal-font.font-verdana app-list-header,
.proposal-font.font-verdana .contract-content,
.proposal-font.font-verdana .column-2-grid,
.proposal-font.font-verdana app-proposal-signature,
.proposal-font.font-verdana .gallery-grid-container,
.proposal-font.font-verdana app-item-alternate,
.proposal-font.font-verdana app-grid-item,
.proposal-font.font-verdana app-proposal-print-cover,
.proposal-font.font-verdana app-proposal-print-cover label,
.proposal-font.font-verdana app-group-header label,
.proposal-font.font-verdana app-group-header .group-price,
.proposal-font.font-verdana app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-verdana app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-verdana .description-section,
.proposal-font.font-verdana .group-name,
.proposal-font.font-verdana app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-verdana app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-verdana app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-verdana .radio-header > *,
.proposal-font.font-verdana app-proposal-portfolio > *,
.proposal-font.font-verdana app-proposal-labor > *,
.proposal-font.font-verdana app-proposal-labor > * .labor-total,
.proposal-font.font-verdana app-proposal-professional-license > *,
.proposal-font.font-verdana app-meet-the-team > *,
.proposal-font.font-verdana .radio-info,
.proposal-font.font-verdana label,
.proposal-font.font-verdana a,
.proposal-font.font-verdana .status-tag,
.proposal-font.font-verdana .list-header > *,
app-font-edit-panel .font-verdana {
  font-family: Verdana, sans-serif !important;
}
.proposal-font.font-helvetica,
.proposal-font.font-helvetica .proposal-section-header,
.proposal-font.font-helvetica .quick-quote-header,
.proposal-font.font-helvetica app-quick-proposal-side-panel > *,
.proposal-font.font-helvetica .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-helvetica .lineitem-list-container .list-body .link,
.proposal-font.font-helvetica .summary-detail-section,
.proposal-font.font-helvetica .proposal-attachment,
.proposal-font.font-helvetica .labor-font,
.proposal-font.font-helvetica .column-2-grid,
.proposal-font.font-helvetica app-list-header,
.proposal-font.font-helvetica .contract-content,
.proposal-font.font-helvetica app-proposal-signature,
.proposal-font.font-helvetica .gallery-grid-container,
.proposal-font.font-helvetica app-item-alternate,
.proposal-font.font-helvetica app-grid-item,
.proposal-font.font-helvetica app-proposal-print-cover,
.proposal-font.font-helvetica app-proposal-print-cover label,
.proposal-font.font-helvetica app-group-header label,
.proposal-font.font-helvetica app-group-header .group-price,
.proposal-font.font-helvetica app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-helvetica app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-helvetica .description-section,
.proposal-font.font-helvetica .group-name,
.proposal-font.font-helvetica app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-helvetica app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-helvetica app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-helvetica .radio-header > *,
.proposal-font.font-helvetica app-proposal-portfolio > *,
.proposal-font.font-helvetica app-proposal-labor > *,
.proposal-font.font-helvetica app-proposal-labor > * .labor-total,
.proposal-font.font-helvetica app-proposal-professional-license > *,
.proposal-font.font-helvetica app-meet-the-team > *,
.proposal-font.font-helvetica .radio-info,
.proposal-font.font-helvetica label,
.proposal-font.font-helvetica a,
.proposal-font.font-helvetica .status-tag,
.proposal-font.font-helvetica .list-header > *,
app-font-edit-panel .font-helvetica {
  font-family: Helvetica, sans-serif !important;
}
.proposal-font.font-tahoma,
.proposal-font.font-tahoma .quick-quote-header,
.proposal-font.font-tahoma .proposal-section-header,
.proposal-font.font-tahoma app-quick-proposal-side-panel > *,
.proposal-font.font-tahoma .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-tahoma .lineitem-list-container .list-body .link,
.proposal-font.font-tahoma .summary-detail-section,
.proposal-font.font-tahoma .proposal-attachment,
.proposal-font.font-tahoma .labor-font,
.proposal-font.font-tahoma .column-2-grid,
.proposal-font.font-tahoma app-list-header,
.proposal-font.font-tahoma .contract-content,
.proposal-font.font-tahoma app-proposal-signature,
.proposal-font.font-tahoma .gallery-grid-container,
.proposal-font.font-tahoma app-item-alternate,
.proposal-font.font-tahoma app-grid-item,
.proposal-font.font-tahoma app-proposal-print-cover,
.proposal-font.font-tahoma app-proposal-print-cover label,
.proposal-font.font-tahoma app-group-header label,
.proposal-font.font-tahoma app-group-header .group-price,
.proposal-font.font-tahoma app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-tahoma app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-tahoma .group-name,
.proposal-font.font-tahoma .description-section,
.proposal-font.font-tahoma app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-tahoma app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-tahoma app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-tahoma .radio-header > *,
.proposal-font.font-tahoma app-proposal-portfolio > *,
.proposal-font.font-tahoma app-proposal-labor > *,
.proposal-font.font-tahoma app-proposal-labor > * .labor-total,
.proposal-font.font-tahoma app-proposal-professional-license > *,
.proposal-font.font-tahoma app-meet-the-team > *,
.proposal-font.font-tahoma .radio-info,
.proposal-font.font-tahoma label,
.proposal-font.font-tahoma a,
.proposal-font.font-tahoma .status-tag,
.proposal-font.font-tahoma .list-header > *,
app-font-edit-panel .font-tahoma {
  font-family: Tahoma, sans-serif !important;
}
.proposal-font.font-Trebuchet-ms,
.proposal-font.font-Trebuchet-ms .proposal-section-header,
.proposal-font.font-Trebuchet-ms .quick-quote-header,
.proposal-font.font-Trebuchet-ms app-quick-proposal-side-panel > *,
.proposal-font.font-Trebuchet-ms .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-Trebuchet-ms .lineitem-list-container .list-body .link,
.proposal-font.font-Trebuchet-ms .summary-detail-section,
.proposal-font.font-Trebuchet-ms .proposal-attachment,
.proposal-font.font-Trebuchet-ms .labor-font,
.proposal-font.font-Trebuchet-ms .column-2-grid,
.proposal-font.font-Trebuchet-ms app-list-header,
.proposal-font.font-Trebuchet-ms .contract-content,
.proposal-font.font-Trebuchet-ms app-proposal-signature,
.proposal-font.font-Trebuchet-ms .gallery-grid-container,
.proposal-font.font-Trebuchet-ms app-item-alternate,
.proposal-font.font-Trebuchet-ms app-grid-item,
.proposal-font.font-Trebuchet-ms app-proposal-print-cover,
.proposal-font.font-Trebuchet-ms app-proposal-print-cover label,
.proposal-font.font-Trebuchet-ms app-group-header label,
.proposal-font.font-Trebuchet-ms app-group-header .group-price,
.proposal-font.font-Trebuchet-ms app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-Trebuchet-ms app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-Trebuchet-ms .description-section,
.proposal-font.font-Trebuchet-ms .group-name,
.proposal-font.font-Trebuchet-ms app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-Trebuchet-ms app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-Trebuchet-ms app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-Trebuchet-ms .radio-header > *,
.proposal-font.font-Trebuchet-ms app-proposal-portfolio > *,
.proposal-font.font-Trebuchet-ms app-proposal-labor > *,
.proposal-font.font-Trebuchet-ms app-proposal-labor > * .labor-total,
.proposal-font.font-Trebuchet-ms app-proposal-professional-license > *,
.proposal-font.font-Trebuchet-ms app-meet-the-team > *,
.proposal-font.font-Trebuchet-ms .radio-info,
.proposal-font.font-Trebuchet-ms label,
.proposal-font.font-Trebuchet-ms a,
.proposal-font.font-Trebuchet-ms .status-tag,
.proposal-font.font-Trebuchet-ms .list-header > *,
app-font-edit-panel .font-Trebuchet-ms {
  font-family: Trebuchet MS, sans-serif !important;
}
.proposal-font.font-times-new-roman,
.proposal-font.font-times-new-roman .quick-quote-header,
.proposal-font.font-times-new-roman .proposal-section-header,
.proposal-font.font-times-new-roman app-quick-proposal-side-panel > *,
.proposal-font.font-times-new-roman .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-times-new-roman .lineitem-list-container .list-body .link,
.proposal-font.font-times-new-roman .summary-detail-section,
.proposal-font.font-times-new-roman .proposal-attachment,
.proposal-font.font-times-new-roman .labor-font,
.proposal-font.font-times-new-roman .column-2-grid,
.proposal-font.font-times-new-roman app-list-header,
.proposal-font.font-times-new-roman .contract-content,
.proposal-font.font-times-new-roman app-proposal-signature,
.proposal-font.font-times-new-roman .gallery-grid-container,
.proposal-font.font-times-new-roman app-item-alternate,
.proposal-font.font-times-new-roman app-grid-item,
.proposal-font.font-times-new-roman app-proposal-print-cover,
.proposal-font.font-times-new-roman app-proposal-print-cover label,
.proposal-font.font-times-new-roman app-group-header label,
.proposal-font.font-times-new-roman app-group-header .group-price,
.proposal-font.font-times-new-roman app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-times-new-roman app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-times-new-roman .description-section,
.proposal-font.font-times-new-roman .group-name,
.proposal-font.font-times-new-roman app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-times-new-roman app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-times-new-roman app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-times-new-roman .radio-header > *,
.proposal-font.font-times-new-roman app-proposal-portfolio > *,
.proposal-font.font-times-new-roman app-proposal-labor > *,
.proposal-font.font-times-new-roman app-proposal-labor > * .labor-total,
.proposal-font.font-times-new-roman app-proposal-professional-license > *,
.proposal-font.font-times-new-roman app-meet-the-team > *,
.proposal-font.font-times-new-roman .radio-info,
.proposal-font.font-times-new-roman label,
.proposal-font.font-times-new-roman a,
.proposal-font.font-times-new-roman .status-tag,
.proposal-font.font-times-new-roman .list-header > *,
app-font-edit-panel .font-times-new-roman {
  font-family: Times New Roman, serif !important;
}
.proposal-font.font-georgia,
.proposal-font.font-georgia .proposal-section-header,
.proposal-font.font-georgia .quick-quote-header,
.proposal-font.font-georgia app-quick-proposal-side-panel > *,
.proposal-font.font-georgia .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-georgia .lineitem-list-container .list-body .link,
.proposal-font.font-georgia .summary-detail-section,
.proposal-font.font-georgia .proposal-attachment,
.proposal-font.font-georgia .labor-font,
.proposal-font.font-georgia .column-2-grid,
.proposal-font.font-georgia app-list-header,
.proposal-font.font-georgia .contract-content,
.proposal-font.font-georgia app-proposal-signature,
.proposal-font.font-georgia .gallery-grid-container,
.proposal-font.font-georgia app-item-alternate,
.proposal-font.font-georgia app-grid-item,
.proposal-font.font-georgia app-proposal-print-cover,
.proposal-font.font-georgia app-proposal-print-cover label,
.proposal-font.font-georgia app-group-header label,
.proposal-font.font-georgia app-group-header .group-price,
.proposal-font.font-georgia app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-georgia app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-georgia .description-section,
.proposal-font.font-georgia .group-name,
.proposal-font.font-georgia app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-georgia app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-georgia app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-georgia .radio-header > *,
.proposal-font.font-georgia app-proposal-portfolio > *,
.proposal-font.font-georgia app-proposal-labor > *,
.proposal-font.font-georgia app-proposal-labor > * .labor-total,
.proposal-font.font-georgia app-proposal-professional-license > *,
.proposal-font.font-georgia app-meet-the-team > *,
.proposal-font.font-georgia .radio-info,
.proposal-font.font-georgia label,
.proposal-font.font-georgia a,
.proposal-font.font-georgia .status-tag,
.proposal-font.font-georgia .list-header > *,
app-font-edit-panel .font-georgia {
  font-family: Georgia, serif !important;
}
.proposal-font.font-garamond,
.proposal-font.font-garamond .quick-quote-header,
.proposal-font.font-garamond .proposal-section-header,
.proposal-font.font-garamond app-quick-proposal-side-panel > *,
.proposal-font.font-garamond .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-garamond .lineitem-list-container .list-body .link,
.proposal-font.font-garamond .summary-detail-section,
.proposal-font.font-garamond .proposal-attachment,
.proposal-font.font-garamond .labor-font,
.proposal-font.font-garamond .column-2-grid,
.proposal-font.font-garamond app-list-header,
.proposal-font.font-garamond .contract-content,
.proposal-font.font-garamond app-proposal-signature,
.proposal-font.font-garamond .gallery-grid-container,
.proposal-font.font-garamond app-item-alternate,
.proposal-font.font-garamond app-grid-item,
.proposal-font.font-garamond app-proposal-print-cover,
.proposal-font.font-garamond app-proposal-print-cover label,
.proposal-font.font-garamond app-group-header label,
.proposal-font.font-garamond app-group-header .group-price,
.proposal-font.font-garamond app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-garamond app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-garamond .description-section,
.proposal-font.font-garamond .group-name,
.proposal-font.font-garamond app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-garamond app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-garamond app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-garamond .radio-header > *,
.proposal-font.font-garamond app-proposal-portfolio > *,
.proposal-font.font-garamond app-proposal-labor > *,
.proposal-font.font-garamond app-proposal-labor > * .labor-total,
.proposal-font.font-garamond app-proposal-professional-license > *,
.proposal-font.font-garamond app-meet-the-team > *,
.proposal-font.font-garamond .radio-info,
.proposal-font.font-garamond label,
.proposal-font.font-garamond a,
.proposal-font.font-garamond .status-tag,
.proposal-font.font-garamond .list-header > *,
app-font-edit-panel .font-garamond {
  font-family: Garamond, serif !important;
}
.proposal-font.font-courier-new,
.proposal-font.font-courier-new .proposal-section-header,
.proposal-font.font-courier-new .quick-quote-header,
.proposal-font.font-courier-new app-quick-proposal-side-panel > *,
.proposal-font.font-courier-new .lineitem-list-container .list-body .list-info-column,
.proposal-font.font-courier-new .lineitem-list-container .list-body .link,
.proposal-font.font-courier-new .summary-detail-section,
.proposal-font.font-courier-new .proposal-attachment,
.proposal-font.font-courier-new .labor-font,
.proposal-font.font-courier-new .column-2-grid,
.proposal-font.font-courier-new app-list-header,
.proposal-font.font-courier-new .contract-content,
.proposal-font.font-courier-new app-proposal-signature,
.proposal-font.font-courier-new .gallery-grid-container,
.proposal-font.font-courier-new app-item-alternate,
.proposal-font.font-courier-new app-grid-item,
.proposal-font.font-courier-new app-proposal-print-cover,
.proposal-font.font-courier-new app-proposal-print-cover label,
.proposal-font.font-courier-new app-group-header label,
.proposal-font.font-courier-new app-group-header .group-price,
.proposal-font.font-courier-new app-proposal-quote-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-courier-new app-proposal-change-order-cover * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font.font-courier-new .description-section,
.proposal-font.font-courier-new .group-name,
.proposal-font.font-courier-new app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font.font-courier-new app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-courier-new app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font.font-courier-new .radio-header > *,
.proposal-font.font-courier-new app-proposal-portfolio > *,
.proposal-font.font-courier-new app-proposal-labor > *,
.proposal-font.font-courier-new app-proposal-labor > * .labor-total,
.proposal-font.font-courier-new app-proposal-professional-license > *,
.proposal-font.font-courier-new app-meet-the-team > *,
.proposal-font.font-courier-new .radio-info,
.proposal-font.font-courier-new label,
.proposal-font.font-courier-new a,
.proposal-font.font-courier-new .status-tag,
.proposal-font.font-courier-new .list-header > *,
app-font-edit-panel .font-courier-new {
  font-family: Courier New, monospace !important;
}
.proposal-font:not(.font-gilroy) .group-name.regular,
.proposal-font:not(.font-gilroy) .regular,
.proposal-font:not(.font-gilroy) .quick-quote-header.regular,
.proposal-font:not(.font-gilroy) .proposal-section-header.regular,
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .list-info-column.regular,
.proposal-font:not(.font-gilroy) .summary-detail-section.regular,
.proposal-font:not(.font-gilroy) .proposal-attachment.regular,
.proposal-font:not(.font-gilroy) .labor-font.regular,
.proposal-font:not(.font-gilroy) .column-2-grid.regular,
.proposal-font:not(.font-gilroy) .contract-content.regular,
.proposal-font:not(.font-gilroy) app-proposal-signature .regular,
.proposal-font:not(.font-gilroy) app-list-header.regular > *,
.proposal-font:not(.font-gilroy) .gallery-grid-container.regular,
.proposal-font:not(.font-gilroy) app-item-alternate .regular,
.proposal-font:not(.font-gilroy) app-grid-item .regular,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .regular,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .regular label,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .regular .print-cover-customer,
.proposal-font:not(.font-gilroy) app-group-header label.regular,
.proposal-font:not(.font-gilroy) app-group-header .group-price.regular,
.proposal-font:not(.font-gilroy) app-proposal-quote-cover.regular * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) app-proposal-change-order-cover.regular * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .item-name.regular,
.proposal-font:not(.font-gilroy) app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font:not(.font-gilroy) app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) .radio-header > *,
.proposal-font:not(.font-gilroy) app-proposal-portfolio > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > * .labor-total,
.proposal-font:not(.font-gilroy) app-proposal-professional-license > *,
.proposal-font:not(.font-gilroy) app-meet-the-team > *,
.proposal-font:not(.font-gilroy) .radio-info,
.proposal-font:not(.font-gilroy) label,
.proposal-font:not(.font-gilroy) a,
.proposal-font:not(.font-gilroy) .status-tag,
.proposal-font:not(.font-gilroy) .list-header > * {
  font-weight: 400 !important;
}
.proposal-font:not(.font-gilroy) .group-name.medium,
.proposal-font:not(.font-gilroy) .medium,
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .list-info-column.medium,
.proposal-font:not(.font-gilroy) .summary-detail-section.medium,
.proposal-font:not(.font-gilroy) .proposal-attachment.medium,
.proposal-font:not(.font-gilroy) .labor-font.medium,
.proposal-font:not(.font-gilroy) .column-2-grid.medium,
.proposal-font:not(.font-gilroy) .contract-content.medium,
.proposal-font:not(.font-gilroy) app-proposal-signature .medium,
.proposal-font:not(.font-gilroy) app-list-header.medium > *,
.proposal-font:not(.font-gilroy) .gallery-grid-container.medium,
.proposal-font:not(.font-gilroy) app-item-alternate .medium,
.proposal-font:not(.font-gilroy) app-grid-item .medium,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .medium,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .medium label,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .medium .print-cover-customer,
.proposal-font:not(.font-gilroy) app-group-header label.medium,
.proposal-font:not(.font-gilroy) app-group-header .group-price.medium,
.proposal-font:not(.font-gilroy) app-proposal-quote-cover.medium * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) app-proposal-change-order-cover.medium * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .item-name.medium,
.proposal-font:not(.font-gilroy) app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font:not(.font-gilroy) app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) .radio-header > *,
.proposal-font:not(.font-gilroy) app-proposal-portfolio > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > * .labor-total,
.proposal-font:not(.font-gilroy) app-proposal-professional-license > *,
.proposal-font:not(.font-gilroy) app-meet-the-team > *,
.proposal-font:not(.font-gilroy) .radio-info,
.proposal-font:not(.font-gilroy) label,
.proposal-font:not(.font-gilroy) a,
.proposal-font:not(.font-gilroy) .status-tag,
.proposal-font:not(.font-gilroy) .list-header > * {
  font-weight: 500 !important;
}
.proposal-font:not(.font-gilroy) .group-name.semi-bold,
.proposal-font:not(.font-gilroy) .semi-bold,
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .list-info-column.semi-bold,
.proposal-font:not(.font-gilroy) .summary-detail-section.semi-bold,
.proposal-font:not(.font-gilroy) .proposal-attachment.semi-bold,
.proposal-font:not(.font-gilroy) .labor-font.semi-bold,
.proposal-font:not(.font-gilroy) .column-2-grid.semi-bold,
.proposal-font:not(.font-gilroy) .contract-content.semi-bold,
.proposal-font:not(.font-gilroy) app-proposal-signature .semi-bold,
.proposal-font:not(.font-gilroy) app-list-header.semi-bold > *,
.proposal-font:not(.font-gilroy) .gallery-grid-container.semi-bold,
.proposal-font:not(.font-gilroy) app-item-alternate .semi-bold,
.proposal-font:not(.font-gilroy) app-grid-item .semi-bold,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .semi-bold,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .semi-bold label,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .semi-bold .print-cover-customer,
.proposal-font:not(.font-gilroy) app-group-header label.semi-bold,
.proposal-font:not(.font-gilroy) app-group-header .group-price.semi-bold,
.proposal-font:not(.font-gilroy) app-proposal-quote-cover.semi-bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) app-proposal-change-order-cover.semi-bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .item-name.semi-bold,
.proposal-font:not(.font-gilroy) app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font:not(.font-gilroy) app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) .radio-header > *,
.proposal-font:not(.font-gilroy) app-proposal-portfolio > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > * .labor-total,
.proposal-font:not(.font-gilroy) app-proposal-professional-license > *,
.proposal-font:not(.font-gilroy) app-meet-the-team > *,
.proposal-font:not(.font-gilroy) .radio-info,
.proposal-font:not(.font-gilroy) label,
.proposal-font:not(.font-gilroy) a,
.proposal-font:not(.font-gilroy) .status-tag,
.proposal-font:not(.font-gilroy) .list-header > * {
  font-weight: 600 !important;
}
.proposal-font:not(.font-gilroy) .group-name.bold,
.proposal-font:not(.font-gilroy) .bold,
.proposal-font:not(.font-gilroy) .summary-detail-section.bold,
.proposal-font:not(.font-gilroy) .proposal-attachment.bold,
.proposal-font:not(.font-gilroy) .labor-font.bold,
.proposal-font:not(.font-gilroy) .column-2-grid.bold,
.proposal-font:not(.font-gilroy) .contract-content.bold,
.proposal-font:not(.font-gilroy) app-proposal-signature .bold,
.proposal-font:not(.font-gilroy) app-list-header.bold > *,
.proposal-font:not(.font-gilroy) .gallery-grid-container.bold,
.proposal-font:not(.font-gilroy) app-item-alternate .bold,
.proposal-font:not(.font-gilroy) app-grid-item .bold,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .bold,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .bold label,
.proposal-font:not(.font-gilroy) app-proposal-print-cover .bold .print-cover-customer,
.proposal-font:not(.font-gilroy) app-group-header label.bold,
.proposal-font:not(.font-gilroy) app-group-header .group-price.bold,
.proposal-font:not(.font-gilroy) app-proposal-quote-cover.bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) app-proposal-change-order-cover.bold * :not(app-proposal-action-menu):not(app-proposal-action-menu *),
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .list-info-column.bold,
.proposal-font:not(.font-gilroy) .lineitem-list-container .list-body .item-name.bold,
.proposal-font:not(.font-gilroy) app-proposal-service-plans > * :is(.bold, .regular, .medium, .semi-bold, .plan-item-header > *, button, .plan-additional-note li),
.proposal-font:not(.font-gilroy) app-proposal-subscription > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) app-item-subgroup > * :is(.bold, .regular, .medium, .semi-bold, .subscription-header > *, button),
.proposal-font:not(.font-gilroy) .radio-header > *,
.proposal-font:not(.font-gilroy) app-proposal-portfolio > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > *,
.proposal-font:not(.font-gilroy) app-proposal-labor > * .labor-total,
.proposal-font:not(.font-gilroy) app-proposal-professional-license > *,
.proposal-font:not(.font-gilroy) app-meet-the-team > *,
.proposal-font:not(.font-gilroy) .radio-info,
.proposal-font:not(.font-gilroy) label,
.proposal-font:not(.font-gilroy) a,
.proposal-font:not(.font-gilroy) .status-tag,
.proposal-font:not(.font-gilroy) .list-header > * {
  font-weight: 700 !important;
}

/* src/assets/css/proposal/meet-the-team.css */
.team-image {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  border-radius: 50%;
  object-fit: cover;
  object-position: center;
  vertical-align: middle;
  margin-left: 10 !important;
}
.proposal-team-member {
  border-bottom: 1px solid var(--light-gray2);
  padding: 10px 0;
}
.grid-3-member {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
.grid-1-member {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
}
.grid-team-image {
  width: 150px !important;
  height: 150px !important;
  min-height: 150px !important;
  min-width: 150px !important;
  max-height: 150px !important;
  max-width: 150px !important;
  border-radius: 50%;
  object-fit: cover;
  object-position: center;
  vertical-align: middle;
  margin-left: 10 !important;
}
.grid-team-image.acronym-background {
  font-size: 40px !important;
}
.grid-team-image.small {
  width: 75px !important;
  height: 75px !important;
  min-height: 75px !important;
  min-width: 75px !important;
  max-height: 75px !important;
  max-width: 75px !important;
  font-size: 25px !important;
}
.grid-member-name {
  font-size: 23px;
  padding: 10px 0 5px 0;
}
.grid-member-role {
  font-size: 16px;
  padding-bottom: 15px;
}
.grid-3-member .team-member:nth-child(3n-1) {
  border-left: 1px solid var(--light-gray2);
  border-right: 1px solid var(--light-gray2);
}
.team-member {
  margin-top: 25px;
  position: relative;
}
.team-member:not(:last-child)::after {
  content: "";
  content: "";
  position: absolute;
  top: 0;
  right: -1px;
  bottom: -12px;
  left: 0;
  border-bottom: 1px solid var(--light-gray2);
}

/* src/assets/css/proposal/service-plan.css */
.plan-detail > div {
  min-height: 48px;
  border-bottom: 1px solid #EAECED;
  display: flex;
  align-items: center;
  margin: 0 36px;
  padding: 10px 0;
}
.plan-detail-key {
  min-width: 150px;
  color: #6F7782;
  font-size: 10px;
}
.length-billing-radio {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 150px));
  grid-gap: 10px;
}
.two-grid-columns {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.service-plan-headers {
  font-size: 15px;
  padding: 10px 0;
}
.plan-price {
  font-size: 18px;
  text-align: center;
}
.plan-container {
  min-height: 150px;
  box-shadow: 0px 0px 4px rgb(1 22 47 / 16%);
  border-radius: 12px;
  margin-bottom: 30px;
  width: 100%;
}
.selected-service-plan {
  font-size: 12px;
  color: var(--cool-green);
  background-color: rgba(14, 158, 39, 0.1);
  padding: 5px;
  margin-top: 5px;
  display: block;
}
.length-billing-radio .mat-mdc-radio-button .mdc-form-field > label {
  align-items: start !important;
  flex-direction: column !important;
}
.hide-radio-button .mdc-radio {
  display: none !important;
}
.selected-plan-bar {
  background: var(--cool-green);
  width: 32px;
  color: white;
  border-radius: 12px 0px 0px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rotate-text {
  transform: rotate(-90deg);
  white-space: nowrap;
}
.plan-additional-note {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  border: unset;
}
.plan-additional-note.single-row {
  grid-template-columns: 1fr;
}
.proposal-plan-feature {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  grid-gap: 15px 10px;
}
.plan-image {
  width: 50px !important;
  height: 50px !important;
  min-height: 50px !important;
  max-height: 50px !important;
  min-width: 50px !important;
  max-width: 50px !important;
  border-radius: 5px;
  border: 1px solid #EAECED;
  margin-right: 16px;
}
.plan-image.plan-acronym {
  padding: 10px;
  background: var(--color-divider);
}
.plan-attachment .attachment-image-container {
  min-height: 57px !important;
  min-width: unset !important;
}
.plan-attachment .attachment-image-container button.file-hovr-btn {
  min-width: 50px !important;
}
.plan-item-header {
  color: var(--cool-grey);
  font-size: 10px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px 7px;
  border-bottom: 1px solid var(--mat-divider-color);
  margin: 0 20px;
}

/* src/assets/css/proposal/portfolio.css */
#portfolio-icon mat-icon path {
  stroke-width: 1;
}
.portfolio-image {
  min-width: 125px;
  min-height: 146px;
  max-width: 425px;
  max-height: 246px;
  border-radius: 10px;
  object-fit: cover;
  height: 100%;
  width: 100%;
}
.portfolio-image-grid {
  min-width: 250px;
  min-height: 250px;
  max-width: 250px;
  max-height: 250px;
  border-radius: 10px;
  object-fit: cover;
}
.img-fit {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  -o-object-fit: contain !important;
  object-position: center !important;
  -o-object-position: center !important;
  vertical-align: middle !important;
}
.portfolio-title {
  font-size: 23px;
  line-height: 28px;
  margin-bottom: 11px;
  display: block;
}
.portfolio-description {
  line-height: 22px;
  word-break: break-word;
}
.portfolio-list.portfolio-reverse-order,
.alternate-gallery:nth-child(even) {
  flex-direction: row-reverse !important;
}
.m-r-45 {
  margin-right: 45px;
}
.m-l-45 {
  margin-left: 45px;
}
.portfolio-list {
  display: flex;
  flex-direction: row !important;
  padding: 25px 0;
  box-sizing: border-box;
  border-bottom: 1px solid rgb(234, 236, 237);
  width: 100%;
}
.grid-portfolio {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  display: grid;
  justify-items: center;
  align-items: center;
  grid-gap: 30px;
  text-align: center;
  justify-content: center;
  padding: 20px 0;
}
.grid-item:hover .hover-grid-position {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 23px;
  color: white;
  font-family: "gilroy-semi-bold";
}
.hover-grid-position {
  display: none;
  position: absolute;
  z-index: 10;
  background-color: #2c3d52bf;
  cursor: pointer;
  min-width: 250px;
  min-height: 250px;
  max-width: 250px;
  max-height: 250px;
  border-radius: 10px;
}
.grid-item {
  position: relative;
}
.gallery-acronym {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 50px;
  text-align: center;
  color: var(--medium-gray);
  text-transform: uppercase;
  border: 1px solid var(--light-gray2);
  background-color: var(--cool-grey-three);
  border-radius: 3px;
  margin: 0 auto;
}
@media (max-width: 599px) {
  .portfolio-list.portfolio-reverse-order,
  .alternate-gallery:nth-child(even) {
    flex-direction: column-reverse !important;
  }
  .portfolio-list {
    flex-direction: column !important;
  }
}

/* src/assets/css/proposal/quick-quote.css */
.quick-proposal.proposal-wrapper .proposal-main-container {
  max-width: unset !important;
  margin-right: 55px;
}
.quick-proposal .summary-column.summary-subtotal,
.quick-proposal .summary-column.summary-total {
  font-size: 16px !important;
}
.quick-proposal .contract-section .proposal-margin {
  min-width: 30px !important;
  padding: 0 20px;
}
.quick-proposal .contract-section .contract-column .contract-stepper {
  min-width: 30px !important;
}
.quick-proposal .contract-section .contract-column .contract-content .contract-amount,
.quick-proposal .contract-section .contract-column .contract-content .contract-date,
.quick-proposal .contract-section .contract-column .contract-content .contract-name {
  font-size: 14px !important;
  opacity: 1;
  text-align: start;
}
.contract-section .contract-column .contract-content .contract-amount,
.contract-section .contract-column .contract-content .contract-date {
  max-width: 125px;
}
.quick-proposal .labor-section .labor-summary-column.proposal-section-header {
  min-height: unset !important;
}
.quick-proposal .summary-column,
.quick-proposal .labor-section .labor-summary-column {
  min-height: 45px !important;
  padding: 0 30px;
  height: unset;
  transition: .2s;
}
.quick-proposal .proposal-margin {
  margin: unset !important;
}
.quick-proposal .proposal-section {
  margin: 15px 10px 15px 10px;
}
.quick-proposal .labor-section .labor-summary-column,
.quick-proposal .labor-section .labor-summary-column > div.labor-total {
  font-size: 14px !important;
}
.quick-proposal app-proposal-social-media .with-border,
.quick-proposal app-proposal-testimonial .with-border,
.quick-proposal app-meet-the-team .with-border,
.quick-proposal app-proposal-awards .with-border {
  border: unset !important;
}
.quick-proposal .mobile-license div {
  font-size: 14px;
  padding-bottom: unset;
  margin-top: 5px;
  word-break: break-word;
}
.quick-proposal .mobile-license div:nth-child(1) {
  margin-top: 25px;
}
.quick-proposal .list-detail .quick-optional {
  display: block !important;
}
:not(.quick-proposal) .list-detail .quick-optional,
.quick-proposal .quick-optional {
  display: none;
}
.quick-proposal app-cover-edit-panel mat-tab-header,
.quick-proposal app-gallery-edit-panel mat-tab-header,
.quick-proposal app-attachment-edit-panel mat-tab-header {
  display: none;
}
.quick-quote-header {
  font-size: 16px;
}
.quick-quote-header.with-border {
  padding-bottom: 15px;
  border-bottom: 1px solid var(--light-gray2);
}
.quick-proposal .proposal-section-header,
.quick-proposal app-group-header .group-price {
  display: none !important;
}
.quick-proposal app-proposal-executive-summary app-group-header .group-price {
  display: block !important;
}
.quick-proposal app-proposal-contract .proposal-section-header,
.quick-proposal app-proposal-labor .proposal-section-header {
  display: flex !important;
}
.quick-quote-header {
  display: none;
}
.quick-proposal .quick-quote-header {
  display: flex !important;
  margin-bottom: 15px;
}
.executive-summary-dollar {
  font-size: 24px;
  color: var(--gray1);
  font-family: "gilroy-medium";
}
.mat-tab-label-active .executive-summary-dollar {
  color: var(--cool-green) !important;
}
app-proposal-executive-summary,
app-proposal-description {
  word-break: break-word;
}
app-proposal-executive-summary app-group-header.proposal-margin.description-line {
  display: flex;
  flex-direction: column;
  padding: 20px 0 0;
  border: unset;
  margin: unset;
}
app-proposal-executive-summary app-group-header.proposal-margin .group-name,
app-proposal-executive-summary app-group-header.proposal-margin .group-price {
  font-size: 16px;
  page-break-inside: avoid !important;
  display: block;
}
app-proposal-executive-summary app-group-header.proposal-margin .top-total-price {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
  border-bottom: 1px solid;
}
app-proposal-executive-summary app-group-header.proposal-margin .group-price label {
  font-size: 14px;
  padding: 0 5px;
  opacity: .8;
}
app-proposal-executive-summary .proposal-section-description {
  padding: 10px 0;
  border-bottom: 1px solid;
}
app-proposal-executive-summary .summary-detail-section {
  border-bottom: 1px solid;
  padding: 40px 30px 10px;
}
.quick-proposal app-proposal-executive-summary .summary-detail-section {
  border-bottom: 1px solid;
  padding: 40px 0 10px;
}
app-proposal-executive-summary .summary-column .summary-price {
  opacity: 1;
  min-width: 130px;
  text-align: end;
  margin-left: 5px;
}
.quick-proposal app-proposal-executive-summary .summary-column.summary-subtotal,
.quick-proposal app-proposal-executive-summary .summary-column.summary-total {
  font-size: 18px !important;
}
app-proposal-executive-summary .description {
  border-bottom: 1px solid;
  border-top: 1px solid;
  padding: 15px 30px;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.quick-proposal app-proposal-executive-summary .description {
  padding: 15px 0px !important;
}
app-proposal-executive-summary .summary-detail-section .summary-column {
  padding: 0;
  padding-left: calc(100% - 450px);
  border: unset;
  min-height: 30px !important;
  font-size: 16px;
}
.quick-proposal app-item-alternate .list-image,
.quick-proposal app-list-item .item-image {
  display: none !important;
}
.quick-proposal app-list-item .list-info-column {
  padding: 10px 0 !important;
}
.quick-proposal .lineitem-list-container .list-header {
  padding: 0 30px;
}
.quick-proposal app-proposal-contract .proposal-section-header > *,
.quick-proposal app-proposal-labor .proposal-section-header > * {
  font-size: 10px;
  color: #7E8A96 !important;
  padding: 10px 0px;
  background-color: white;
  font-family: gilroy-semi-bold;
  text-transform: uppercase;
  max-width: 95px;
  text-align: left;
}
.quick-proposal app-list-item {
  padding: 0 30px 0 10px;
}
.quick-proposal app-proposal-lineitem app-group-header.proposal-margin.description-line {
  padding: unset !important;
}
.quick-proposal app-proposal-lineitem app-group-header.proposal-margin .top-total-price,
.quick-proposal app-proposal-lineitem app-group-header.proposal-margin .proposal-section-description {
  padding: 0 !important;
}
.quick-proposal app-proposal-lineitem app-group-header.proposal-margin .proposal-section-description {
  margin: 5px 0 10px 0;
}
.quick-proposal app-proposal-lineitem app-group-header.proposal-margin.description-line {
  border: unset !important;
}
.quick-proposal app-proposal-executive-summary .proposal-section .with-outer-border,
.quick-proposal app-proposal-description .proposal-section .with-outer-border,
.quick-proposal app-proposal-lineitem .proposal-section .with-outer-border,
.quick-proposal app-proposal-lineitem .top-total-price,
.quick-proposal app-proposal-item-template {
  border: unset !important;
}
.quick-proposal app-proposal-item-template {
  padding-bottom: 20px !important;
}
.quick-proposal .quick-quote-subgroup {
  border: 1px solid;
  border-radius: 8px;
  margin-top: 8px;
}
.quick-proposal .lineitem-section .lineItem-group-header > div:first-child {
  font-size: 16px !important;
}
.quick-proposal .attachment-grid-container {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
}
.quick-proposal .lineitem-list-container.width-100 {
  padding-left: 20px;
}
.quick-proposal .quick-optional {
  display: none !important;
}
.quick-proposal .item-name .quick-optional {
  display: flex !important;
  margin-top: 0;
  align-items: center;
}
.quick-proposal app-proposal-quote-cover,
.quick-proposal app-proposal-change-order-cover {
  margin: 15px 0;
}
.quick-proposal .lineitem-list-container .list-header {
  margin-top: 0 !important;
}
.quick-proposal .lineitem-list-container .list-body > div,
.quick-proposal .cover .cover-company a {
  font-size: 14px !important;
}
.quick-proposal .lineitem-list-container .list-price {
  align-items: flex-start !important;
}
.quick-proposal .lineitem-list-container .list-qty,
.quick-proposal .lineitem-price.italic {
  text-align: start !important;
}
.quick-proposal .optional-header {
  padding: 15px 30px 10px 30px !important;
  border-top: 1px solid;
  border-bottom: 1px solid;
}
.quick-proposal .mat-drawer-content .quick-side-panel {
  background-color: rgba(242, 243, 244, .3) !important;
  max-width: 280px;
  height: 100%;
  padding-right: 10px;
}
.quick-proposal .mat-drawer-content .quick-side-panel .cover .cover-company .cover-logo {
  min-width: unset;
  max-width: 165px;
  width: auto;
}
.quick-proposal .mat-drawer-content .quick-side-panel app-quick-proposal-side-panel .cover {
  background-color: unset !important;
}
.quick-proposal .mobile-license span {
  padding: 0;
}
.quick-proposal app-proposal-professional-license:hover .action-menu {
  display: flex !important;
}
.quick-proposal .optionalLocAndSys .quick-optional,
.quick-proposal app-proposal-professional-license:hover .btn-up,
.quick-proposal app-proposal-professional-license:hover .add-action-menu,
.quick-proposal app-proposal-professional-license:hover .btn-down {
  display: none !important;
}
.quick-proposal app-proposal-summary .summary-section.layout-right-align .summary-column {
  padding-left: calc(100% - 450px);
  border: medium none currentColor;
  border: initial;
  min-height: 30px !important;
  font-size: 16px;
}
.line-item-total {
  display: flex !important;
  flex-direction: row;
  padding: 15px 30px 15px 30px;
  border-top: 1px solid;
  font-weight: 800 !important;
}
.line-item-total > * {
  font-size: 14px;
  padding-right: 24px;
}
.line-item-total > *:last-child {
  padding-right: 0;
}
app-column-total .line-item-total > *:nth-child(2) {
  align-items: center;
}
.quick-proposal app-column-total .line-item-total > *:nth-child(2) {
  align-items: flex-end;
}
.quick-proposal .cover .cover-company .cover-company-details {
  opacity: 1;
  color: black;
  line-height: 19px;
}
.quick-proposal .cover .cover-client {
  color: black;
  background-color: unset;
  padding-left: 10px;
  width: 100%;
}
.quick-proposal app-quick-proposal-side-panel .cover .cover-client {
  min-width: unset !important;
}
.quick-proposal .header-name {
  font-size: 16px !important;
  color: black;
  font-weight: 800 !important;
}
.quick-proposal .cover .cover-client .cover-client-name {
  font-size: 14px;
}
.quick-proposal .cover .cover-company > div,
.quick-proposal .cover-client > span {
  font-size: 14px;
}
.quick-proposal .proposal-name {
  font-family: Gilroy-bold !important;
  font-size: 24px;
}
.quick-proposal .cover section .hedline {
  color: var(--medium-gray);
  min-width: 80px;
  display: inline-block;
  margin-top: 12px;
}
.cover-summary {
  background: #F2F3F4;
  border-radius: 5px;
  padding: 20px 30px;
}
section.cover-summary > div:nth-child(2) {
  margin: 13px 0;
}
section.cover-summary > div:nth-child(3) {
  font-size: 16px;
}
section.cover-summary > div > span:nth-child(1) {
  min-width: 100px;
  display: inline-block;
}
.quick-proposal .cover.quote-cover-section,
.quick-proposal .cover.co-cover-section {
  min-height: unset !important;
}
.quick-proposal .labor-section .labor-summary-column > div:not(.labor-name) {
  opacity: 1 !important;
  max-width: 95px;
  width: 100%;
  justify-content: flex-start;
}
.quick-proposal .acronym-75,
.quick-proposal .award-img {
  width: 70px !important;
  height: 70px !important;
  min-height: 70px !important;
  min-width: 70px !important;
}
.quick-proposal app-proposal-social-media .social-media-align {
  grid-template-columns: repeat(auto-fit, minmax(80px, 100px));
}
.quick-proposal app-proposal-social-media .icon-60 {
  min-height: 50px;
  min-width: 50px;
  max-height: 50px;
  max-width: 50px;
}
.quick-proposal app-proposal-footer .version {
  margin-left: 10px;
}
app-proposal-footer .back-arrow {
  display: none;
}
.quick-proposal app-proposal-footer .back-arrow {
  display: block !important;
}
.quick-proposal app-cover-edit-panel .editor-navigation,
.quick-proposal app-professional-license-edit-panel .editor-navigation {
  transform: rotate(180deg);
}
.summary-padding {
  padding: 0 30px;
}
.quick-proposal .summary-padding {
  padding: 0;
}
.quick-proposal app-item-subgroup {
  padding-top: 15px;
}
.quick-proposal .proposal-section.with-outer-border,
.quick-proposal .proposal-section .with-outer-border {
  border-radius: 8px;
}
.quick-proposal .then-system-or-loc {
  margin-left: 16px;
}

/* src/assets/css/proposal/print-cover.scss */
app-proposal-print-cover .print-cover {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 950px;
  padding: 25px 0px;
  border: none;
}
app-proposal-print-cover .print-cover > div {
  display: flex;
  width: 100%;
  margin-bottom: 20px;
  flex-direction: column;
}
app-proposal-print-cover .print-cover-customer,
app-proposal-print-cover .print-cover-footer {
  flex-direction: column;
}
app-proposal-print-cover .print-cover-footer > div {
  padding-top: 15px;
}
app-proposal-print-cover .print-cover-footer label {
  color: var(--navy);
  font-size: 14px;
}
app-proposal-print-cover .print-footer-detail {
  color: var(--navy);
  font-weight: 700 !important;
  font-size: 16px;
  padding-top: 5px;
}
app-proposal-print-cover .print-cover-customer .cover-client-name,
app-proposal-print-cover .print-cover-customer .cover-client-address {
  display: block;
  font-size: 16px;
  line-height: 16px;
  margin: 5px 0 0 0;
}
app-proposal-print-cover .print-cover-customer .cover-client-name {
  font-weight: 700 !important;
}
app-proposal-print-cover .print-cover-name {
  color: #01162F;
  font-size: 40px;
  margin-top: 20px;
}
app-proposal-print-cover .print-cover-customer .cover-client-address {
  font-size: 14px;
  line-height: 14px;
  margin: 8px 0 0 0;
  -webkit-line-clamp: 3;
}
app-proposal-print-cover .print-cover-company {
  display: flex;
  flex-direction: row;
}
app-proposal-print-cover .print-cover-company > div {
  margin-bottom: 5px;
}
app-proposal-print-cover .print-cover-image {
  height: 300px;
}
app-proposal-print-cover .print-cover-image .cover-bg-color {
  width: 100%;
  height: 100%;
}

/* src/assets/css/proposal/subscription.scss */
.subscription-container .subscription-detail {
  display: flex;
  flex-direction: row;
  flex: 1;
  overflow: hidden;
}
.subscription-container .subscription-header > div {
  padding-right: 24px;
}
.subscription-container .subscription-qty {
  display: flex;
  flex-direction: column;
  flex: 1 1 100%;
  max-width: 85px;
}
.subscription-container .subscription-header,
.subscription-container .subscription-header > * {
  background-color: white;
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-transform: uppercase;
  color: var(--medium-gray);
}
.subscription-header {
  display: flex;
  align-items: center;
  min-height: 30px;
  max-height: 30px;
  font-size: 12px;
  opacity: 0.7;
  text-transform: uppercase;
  text-align: end;
  border-bottom: 1px solid var(--light-gray2);
  margin-top: 15px;
}
.subscription-price {
  flex: 1 1 100%;
  min-width: 120px;
  max-width: 150px;
  display: flex;
  flex-direction: column;
  justify-items: right;
  box-sizing: content-box;
  align-items: flex-end;
}

/* src/assets/css/proposal/proposal-signature.component.scss */
app-proposal-signature .signature-section {
  padding-bottom: 50px;
}
app-proposal-signature .signature-info {
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  position: relative;
  font-size: 18px;
  max-height: 185px;
  min-height: 90px;
  border-bottom: 2px solid var(--dark-blue);
  padding-bottom: 10px;
  padding-left: 10px;
  font-weight: 600 !important;
  word-break: break-word;
}
app-proposal-signature .signature-info img {
  position: absolute;
  margin: 0;
  left: 0;
  bottom: 0;
  height: 83%;
}
app-proposal-signature .signature-title {
  min-height: 15px;
  font-size: 13px;
  line-height: 15px;
  text-align: center;
  padding: 5px 0;
  width: 100%;
}

/* src/assets/css/proposal/main.css */

/* src/assets/css/dialog.css */
.dt-dialog-toolbar .mdc-dialog__title::before {
  height: unset;
  display: none;
}
.dt-dialog.minor-dialog .mdc-dialog .mat-mdc-dialog-content {
  min-height: 105px;
  padding: 32px;
  max-height: calc(100vh - 192px);
}
.dt-dialog.minor-dialog .mdc-dialog .mat-mdc-dialog-content.task-template {
  min-height: 105px;
  padding: 32px;
  max-height: calc(100vh - 132px);
  min-height: calc(100vh - 132px);
}
@media only screen and (min-width: 600px) and (max-width: 959px) {
  .dt-dialog.minor-dialog .mdc-dialog .close-btn {
    border: 1px solid var(--silver);
    margin: 12px 0 0 0 !important;
    right: 15px;
  }
  .dt-dialog.minor-dialog .mdc-dialog .close-btn.isIphone {
    border: 1px solid var(--silver);
    margin: 0px !important;
    right: 0px;
  }
  .dt-dialog.minor-dialog .mdc-dialog.mat-mdc-dialog-container {
    max-height: 85vh;
  }
  .dt-dialog.minor-dialog .mdc-dialog .mat-mdc-dialog-content {
    padding: 32px;
    max-height: calc(85vh - 140px);
  }
  .dt-dialog.minor-dialog.service-item-detail .mdc-dialog.mat-mdc-dialog-container {
    min-height: 100vh;
    max-height: 100vh;
  }
  .dt-dialog.minor-dialog.barcode-scan-detail .mdc-dialog.mat-mdc-dialog-container {
    min-height: 100vh;
    max-height: 100vh;
  }
  .dt-dialog.minor-dialog.search-from-catalog .mdc-dialog.mat-mdc-dialog-container {
    min-height: 100vh;
    max-height: 100vh;
  }
}
@media (max-width: 599px) {
  .dt-dialog.major-dialog,
  .dt-dialog.major-dialog-with-tab {
    height: 100%;
    width: 100%;
  }
  .dt-dialog.minor-dialog {
    width: 100%;
  }
  .dt-dialog.minor-dialog .mdc-dialog .close-btn {
    border: 1px solid var(--silver);
    margin: 12px 0 0 0 !important;
    right: 15px;
  }
  .dt-dialog.minor-dialog .mdc-dialog .close-btn.isIphone {
    border: 1px solid var(--silver);
    margin: 0px !important;
    right: 0px;
  }
  .dt-dialog.minor-dialog .mdc-dialog.mat-mdc-dialog-container {
    max-height: 85vh;
  }
  .dt-dialog.minor-dialog .mdc-dialog .mat-mdc-dialog-content {
    padding: 32px 8px;
    max-height: calc(85vh - 130px);
  }
  .dt-dialog.minor-dialog .mdc-dialog .mat-mdc-dialog-content.todoView {
    padding: 32px 8px;
    max-height: calc(85vh - 246px);
  }
  .dt-dialog.minor-dialog .mdc-dialog .mat-mdc-dialog-actions {
    margin-bottom: 0px !important;
  }
  .dt-dialog.minor-dialog.service-item-detail .mdc-dialog.mat-mdc-dialog-container {
    min-height: 100vh;
    max-height: 100vh;
  }
  .dt-dialog.minor-dialog.barcode-scan-detail .mdc-dialog.mat-mdc-dialog-container {
    min-height: 100vh;
    max-height: 100vh;
  }
  .dt-dialog.minor-dialog.search-from-catalog .mdc-dialog.mat-mdc-dialog-container {
    min-height: 100vh;
    max-height: 100vh;
  }
}
@media (min-width: 600px) {
  .dt-dialog.major-dialog,
  .dt-dialog.major-dialog-with-tab {
    height: 100%;
    width: calc(100% - 20px);
    max-width: 1088px;
  }
  .cdk-overlay-pane.mat-mdc-dialog-panel.dt-dialog.major-dialog,
  .cdk-overlay-pane.mat-mdc-dialog-panel.dt-dialog.major-dialog-with-tab {
    max-width: 1088px !important;
  }
  .cdk-overlay-pane.mat-mdc-dialog-panel.payment-term-edit-dialog {
    max-width: unset;
  }
  .cdk-overlay-pane.mat-mdc-dialog-panel.dt-dialog.accept-proposal {
    max-width: 893px !important;
  }
  .cdk-overlay-pane.mat-mdc-dialog-panel.dt-dialog.major-dialog.client-address-dialog {
    max-width: 1195px !important;
  }
  .dt-dialog.task-major-dialog {
    height: 100%;
    width: calc(100% - 20px);
    max-width: 1200px;
  }
  .dt-dialog.task-major-dialog .close-btn {
    right: 24px;
    border: 1px solid var(--silver);
    margin: 12px 0 0 0 !important;
  }
  .dt-dialog.major-dialog.height-auto {
    height: auto !important;
  }
  .dt-dialog.minor-dialog-960 {
    height: 100%;
    width: 960px;
  }
  .dt-dialog.major-dialog.quote-co-paymentTerm {
    min-height: 600px;
    max-height: 600px;
  }
  .dt-dialog.major-dialog.todo-detail-new {
    min-height: 640px;
    max-height: 640px;
  }
}
.mat-mdc-dialog-container.mdc-dialog .mdc-dialog__content {
  font-family: gilroy-medium;
  color: var(--navy);
  font-size: 13px;
  line-height: normal;
}
@media (max-width: 1080px) {
  .dt-dialog.major-dialog .close-btn,
  .dt-dialog.task-major-dialog .close-btn,
  .dt-dialog.major-dialog-with-tab .close-btn {
    right: 24px;
    border: 1px solid var(--silver);
    margin: 12px 0 0 0 !important;
  }
  .dt-dialog.major-dialog .dialog-more-btn-container,
  .dt-dialog.major-dialog-with-tab .dialog-more-btn-container {
    position: absolute;
    right: 70px;
    top: 15px;
  }
}
.mat-mdc-dialog-container {
  border-radius: 24px !important;
  background: var(--white);
  color: var(--navy);
  box-shadow: 0px 0px 12px 0px rgba(1, 22, 47, 0.24);
}
.dt-dialog .mat-mdc-dialog-container {
  padding: 0;
}
.dt-dialog2 .mat-mdc-dialog-container {
  padding: 0;
}
.dt-dialog-toolbar {
  box-sizing: border-box;
  height: 64px;
  min-height: 64px;
  max-height: 64px !important;
  background-color: var(--white);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.01);
  padding: 0 32px;
  position: relative;
  display: flex;
  align-items: center;
  flex-direction: row;
  border-bottom: 1px solid;
  border-image:
    linear-gradient(
      90deg,
      #59CEDF 0%,
      #007ACC 100%) 25;
}
.dt-dialog-toolbar.with-tab {
  height: auto;
  max-height: none !important;
  padding-top: 24px !important;
}
.dt-dialog-toolbar.with-tab .mat-mdc-tab-header {
  border-bottom: unset;
}
.dt-dialog-tab-toolbar {
  box-sizing: border-box;
  height: 57px;
  min-height: 57px;
  max-height: 57px !important;
  border-bottom: 1px solid var(--silver);
  background-color: var(--white);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.01);
  padding: 0 32px;
  position: relative;
}
.dt-dialog-toolbar .mat-mdc-dialog-title {
  margin: 0;
  font-family: gilroy-semi-bold;
}
#dtCloudApp .mdc-dialog__title,
#dtCloudApp .mat-mdc-dialog-container .dt-dialog-toolbar .mdc-dialog__title {
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 24px;
  padding: 0;
  line-height: 24px;
  letter-spacing: unset;
}
.alert-title {
  margin-bottom: 16px;
}
.dialog-more-btn-container {
  height: 28px;
  width: 34px;
  border: 1px solid var(--silver);
  border-radius: 4px;
  background-color: var(--white);
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
}
#dtCloudApp .dialog-more-btn-container .mat-mdc-menu-trigger.mat-mdc-icon-button.mat-mdc-button-base {
  width: 16px;
  height: 16px;
  line-height: 16px;
}
#dtCloudApp .dialog-more-btn-container.checklist-template-more-btn .mat-mdc-menu-trigger.mat-mdc-icon-button.mat-mdc-button-base {
  width: 18px;
  height: 18px;
  line-height: 18px;
}
.dt-dialog .mdc-dialog .mdc-dialog__content {
  margin: 0;
  padding: 15px;
}
.dt-dialog2 .mdc-dialog .mdc-dialog__content {
  margin: 0;
  padding: 0;
  display: block !important;
}
.major-dialog .mdc-dialog .mdc-dialog__content {
  height: auto;
  max-height: none;
  min-height: 100vh;
}
.major-dialog.sticky-header-and-footer .mdc-dialog .mdc-dialog__content,
.major-dialog.sticky-double-row-header .mdc-dialog .mdc-dialog__content {
  max-height: calc(100vh - 130px) !important;
  min-height: calc(100vh - 130px);
}
.major-dialog.sticky-header .mdc-dialog .mdc-dialog__content {
  max-height: calc(100vh - 96px) !important;
  min-height: calc(100vh - 96px);
}
.major-dialog.sticky-header .mdc-dialog .mdc-dialog__content.paymentTermContainer {
  max-height: calc(600px - 96px) !important;
  min-height: calc(600px - 96px);
}
#dtCloudApp .detail-dialog .mat-tab-label {
  height: 48px;
}
#dtCloudApp .detail-dialog .use-height-32 .mat-tab-label {
  height: 32px;
}
#dtCloudApp .detail-dialog.qb-dialog {
  max-width: 930px !important;
}
.detail-dialog .mat-mdc-tab-header,
.detail-dialog .mat-mdc-tab-nav-bar {
  border-bottom: unset;
}
.dt-dialog.full-page-dialog {
  height: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
}
.dt-dialog.full-page-dialog .dt-dialog-toolbar {
  padding: 0 16px;
}
@media (max-width: 1080px) {
  .dt-dialog.full-page-dialog .dt-dialog-toolbar {
    padding: 0 8px;
  }
}
.dt-dialog .mat-mdc-dialog-actions {
  min-height: 64px;
  padding: 8px 32px;
  margin-bottom: 0;
  border-top: 1px solid;
  border-image:
    linear-gradient(
      90deg,
      #59CEDF 0%,
      #007ACC 100%) 25;
}
.dt-dialog2 .mat-mdc-dialog-actions {
  border-top: 1px solid var(--silver);
  min-height: 64px;
  padding: 8px 32px;
  box-sizing: content-box !important;
}
.info-dialog {
  max-width: 500px !important;
}
.contract-renewal {
  width: 820px;
}
.info-dialog .mat-mdc-dialog-container {
  min-width: 250px;
}
.dt-dialog .dialog-subtitle {
  font-size: 18px;
  font-family: gilroy-medium;
  color: var(--navy);
}
.cdk-overlay-backdrop.dt-backdrop {
  background:
    linear-gradient(
      135deg,
      #FFFF 26.45%,
      #0788DF 100%);
}
.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
  opacity: 0.36 !important;
}
@media only screen and (max-width: 599px) {
  .dt-dialog .mat-mdc-dialog-actions,
  .dt-dialog2 .mat-dialog-actions {
    padding: 8px 16px;
  }
  .dt-dialog-toolbar {
    padding: 0 16px;
  }
}
.dt-dialog .catalog-detail .mat-mdc-dialog-content {
  padding: 24px;
  height: calc(100vh - 300px);
  overflow: auto !important;
  min-height: calc(100vh - 300px);
}
.dt-dialog.major-dialog .dt-dialog-toolbar,
.dt-dialog.major-dialog .dt-dialog-tab-toolbar {
  padding: 0 24px;
}
.mat-mdc-dialog-actions .btn-with-more-btn.mat-mdc-button.mat-mdc-button-base {
  margin-left: 0px;
}
@media (min-width: 1081px) {
  .major-dialog .mdc-dialog__surface .close-btn ~ div:not(.dt-dialog-toolbar),
  .major-dialog-with-tab .mdc-dialog__surface .close-btn ~ div:not(.dt-dialog-toolbar),
  .has-close-btn .mdc-dialog__surface .close-btn ~ div:not(.dt-dialog-toolbar) {
    border-radius: 24px !important;
    box-shadow: 0px 0px 12px 0px rgba(1, 22, 47, 0.24);
    background: var(--white);
    color: var(--navy);
    margin: 16px;
  }
  .major-dialog .mat-mdc-dialog-container .mdc-dialog__surface,
  .task-major-dialog .mat-mdc-dialog-container .mdc-dialog__surface,
  .major-dialog-with-tab .mat-mdc-dialog-container .mdc-dialog__surface,
  .has-close-btn .mat-mdc-dialog-container .mdc-dialog__surface {
    padding: 0 64px;
    background-color: transparent;
    box-shadow: unset;
  }
  .major-dialog .mat-mdc-dialog-container,
  .major-dialog-with-tab .mat-mdc-dialog-container,
  .has-close-btn .mat-mdc-dialog-container {
    background: transparent;
    box-shadow: unset;
  }
  .major-dialog .dt-dialog-toolbar,
  .major-dialog-with-tab .dt-dialog-toolbar,
  .has-close-btn .dt-dialog-toolbar {
    border-radius: 24px;
  }
}
.quote-co-labor-edit-sticky-mat-mdc-tab-body-wrapper .mat-mdc-tab-body-wrapper {
  overflow: auto;
  max-height: calc(770px - 171px);
}
.major-dialog.detail-dialog.height-auto .mat-mdc-dialog-content {
  min-height: auto !important;
}
.mat-mdc-dialog-container .mdc-dialog__surface {
  background-color: unset;
  border-radius: 24px !important;
  box-shadow: unset !important;
}
.full-page-dialog.monthly-calendar .mat-mdc-dialog-container .mdc-dialog__surface {
  border-radius: unset !important;
}
@media (max-width: 599px) {
  .minor-dialog-xs .mat-mdc-dialog-container .mdc-dialog__surface {
    border-radius: 8px !important;
  }
  .dt-dialog.minor-dialog.minor-dialog-xs {
    max-width: calc(100vw - 32px) !important;
  }
  .major-dialog-xs .mat-mdc-dialog-container .mdc-dialog__surface {
    border-radius: 0 !important;
  }
  .major-dialog-container-xs .mat-mdc-dialog-container .mat-mdc-dialog-content {
    max-height: calc(100vh - 130px) !important;
  }
  .major-dialog-container-xs .mat-mdc-dialog-container .mat-mdc-dialog-content.installer-mobile-view {
    max-height: calc(100vh - 275px) !important;
  }
  .major-dialog-container-xs .mat-mdc-dialog-container {
    max-height: 100vh !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .mat-mdc-dialog-container .mdc-dialog__surface {
    position: unset;
  }
}
.back-panel-dialog h4 {
  margin: 15px;
  font-size: 26px;
  font-family: "gilroy-bold";
}
.text-red {
  color: var(--red);
}

/* src/assets/css/popover.css */

/* src/assets/css/color-picker.css */
.color-pallet {
  margin: 5px 0;
  cursor: pointer;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-image: initial;
  padding: 5px;
  border-radius: 4px;
  display: flex;
  width: 70px;
}
.color-pallet mat-icon {
  margin-left: 10px;
}
.color-pallet .display-color {
  width: 24px;
  height: 24px;
  border: 1px solid rgb(151, 151, 151);
  border-radius: 50%;
}
.color-picker {
  border: 1px solid rgba(1, 22, 47, 0.16) !important;
  border-radius: 2px !important;
  box-shadow: 0 2px 13px 0 rgba(0, 0, 0, 0.12) !important;
  z-index: 2000 !important;
}
.color-picker .cursor {
  background-color: white;
  border-color: white !important;
  box-shadow: 0px 0.5px 2px 0px rgba(0, 0, 0, 0.5);
}
.color-picker .type-policy {
  display: none;
}
.color-picker .hex-text .box {
  padding: 0 8px 8px 8px !important;
}
.color-picker .arrow.arrow-top {
  border-color: white transparent transparent !important;
}

/* src/assets/css/base-layout/basic-layout.css */
.base-layout-wrapper {
  display: flex;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  background-color: white;
}
@media (max-width: 1024px) {
  .base-layout-wrapper {
    display: flex;
    flex-direction: column;
    width: 100vw;
    height: 100dvh;
    background-color: white;
  }
}
@media (min-width: 600px) {
  .show-main-navigation .base-layout-wrapper {
    width: calc(100vw - 52px);
  }
  .show-main-navigation-expanded .base-layout-wrapper {
    width: calc(100vw - 160px);
  }
}
.base-layout-wrapper .base-toolbar {
  height: 64px;
  background: white;
  padding: 0 24px;
  width: 100%;
  overflow: hidden;
  max-height: 64px;
  border-bottom: 2px solid var(--light-gray2);
}
.base-layout-wrapper .base-toolbar-left {
  display: flex;
  flex: 1;
  max-width: 60%;
}
.base-layout-wrapper .project-Planning-header {
  font-size: 22px;
  font-family: "gilroy-bold";
  height: 64px;
}
.base-layout-wrapper .base-toolbar-right {
  display: flex;
  flex: 1;
  max-width: 40%;
  justify-content: flex-end;
  align-items: center;
}
.base-toolbar-right .button-with-more > button:first-child {
  border-radius: 4px 0 0 4px !important;
  font-family: "gilroy-bold";
}
#dtCloudApp .base-toolbar-right .button-with-more > button:last-child {
  border-radius: 0 4px 4px 0 !important;
  opacity: 0.7;
  min-height: 29px;
}
.base-toolbar-right .button-with-more > button:last-child mat-icon {
  height: 18px;
  width: 18px;
}
.base-layout-wrapper .back-arrow {
  max-height: 36px;
}
.base-layout-wrapper .base-summary-price,
.design-group-price {
  display: flex;
  justify-content: center;
  min-width: 60px;
  padding: 10px;
  text-align: center;
  font-family: gilroy-semi-bold;
  font-size: 16px;
  color: #0DBB7D;
  border-radius: 3px;
  background-color: #F2F3F4;
  cursor: pointer;
}
.base-layout-wrapper .base-summary-price.base-summary {
  background-color: #FFFFFF !important;
  border: 1px solid #BDC4C7;
}
.base-layout-wrapper .base-toolbar-right .base-summary-price {
  padding: 6.4px 10px;
}
.base-layout-wrapper .base-toolbar-right .base-summary-price .down-arrow,
.design-group-price .down-arrow {
  margin-top: 4px;
  margin-right: 0;
}
.design-group-price {
  cursor: auto;
}
.base-layout-wrapper .more-menu mat-icon svg path {
  fill: var(--cool-grey);
}
.base-layout-wrapper .base-detail-container {
  min-height: 64px;
}
.base-layout-wrapper .base-details {
  min-height: 35px;
}
.base-layout-wrapper .base-number {
  color: var(--cool-grey);
  font-size: 12px;
  background-color: white;
  line-height: 28px;
}
.base-layout-wrapper .base-number.base-summary-number {
  font-size: 24px;
  font-family: gilroy-regular !important;
  color: var(--medium-gray);
}
.base-layout-wrapper .fake-element {
  visibility: hidden;
  position: absolute;
  z-index: -1;
  min-width: 30px;
  padding: 0 4px;
  font-size: 14px;
  font-family: gilroy-medium;
}
.base-client {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--medium-gray);
  font-size: 11px;
  outline: none;
  cursor: pointer;
}
.base-client:hover,
.base-client:hover .acronym {
  color: var(--cool-green);
}
.base-client .acronym {
  display: none;
}
.base-input-container label {
  line-height: 23px;
  padding: 0 2px;
  font-size: 11px;
  font-family: gilroy-semi-bold;
  padding-top: 2px;
}
.base-input-container input:focus,
.base-input-container input:hover {
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
}
.base-input-container input:focus {
  border: 1px solid var(--cool-green) !important;
}
.base-input-container input:hover {
  border: 1px solid var(--light-gray2);
}
.base-input-container input {
  border: 1px solid transparent;
  padding: 0 4px;
  box-shadow: none;
  font-size: 14px;
  font-family: gilroy-semi-bold;
  min-height: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.base-input-container input:disabled {
  color: inherit;
  cursor: default;
  background-color: white;
}
.base-input-container.input-title,
.base-input-container.input-title input,
.base-layout-wrapper .fake-element.input-title {
  font-size: 24px;
  font-family: gilroy-bold;
}
.base-input-container.input-title input {
  max-width: 23vw;
}
.base-input-container.input-version input {
  max-width: 50px;
  padding-left: 0;
}
.base-layout-wrapper .base-drawer {
  min-width: 100px;
  max-width: 100px;
}
.base-layout-wrapper .base-drawer .drawer-nav-wrapper {
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.base-layout-wrapper .base-drawer .drawer-nav-wrapper.active {
  border-color: var(--light-gray2);
}
.base-layout-wrapper .base-drawer .drawer-nav {
  display: flex;
  position: relative;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 70px;
  margin: 6px;
  cursor: pointer;
}
.base-layout-wrapper .base-drawer .drawer-nav div {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 12px;
}
.base-layout-wrapper .base-drawer .drawer-nav.nav-level-1.active::after {
  content: "";
  display: block;
  position: absolute;
  width: 50px;
  height: 50px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  background-color: rgba(0, 181, 117, 0.1);
}
.base-layout-wrapper .base-drawer .drawer-nav.active div,
.base-layout-wrapper .base-drawer .drawer-nav:hover div,
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon svg path,
.base-layout-wrapper .base-drawer .drawer-nav:not(.planning-icon):hover mat-icon svg path,
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon svg .fill-here,
.base-layout-wrapper .base-drawer .drawer-nav:not(.planning-icon):hover mat-icon svg .fill-here {
  color: var(--cool-green);
  fill: var(--cool-green);
}
.base-layout-wrapper .base-drawer .drawer-nav.detailIcon div,
.base-layout-wrapper .base-drawer .drawer-nav.detailIcon mat-icon svg path,
.base-layout-wrapper .base-drawer .drawer-nav.detailIcon mat-icon svg .fill-here {
  font-size: 12px;
  font-family: "gilroy-semi-bold";
  color: #01162F;
  stroke: #01162F;
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=planTasks] svg path,
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=planTasks] svg .fill-here,
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=product] svg path,
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=product] svg .fill-here {
  color: var(--cool-green);
  stroke: var(--cool-green);
}
.base-layout-wrapper .base-drawer .drawer-nav:not(.planning-icon):hover .mat-icon[svgIcon=schedule] svg .stroke,
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon svg .stroke {
  color: var(--cool-green) !important;
  stroke: var(--cool-green) !important;
  fill: unset !important;
}
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon.fill-service-plan-list svg .stroke {
  color: var(--cool-green) !important;
  stroke: var(--cool-green) !important;
  fill: var(--cool-green) !important;
  stroke-width: calc(0.3);
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=changeOrder] svg path,
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=changeOrder] svg .fill-here {
  color: var(--cool-green);
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon.active .mat-icon[svgIcon=product] svg path {
  color: transparent;
  fill: transparent;
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon .mat-icon[svgIcon=changeOrder] svg path + path {
  opacity: .5;
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon.active .mat-icon[svgIcon=product] svg g g {
  stroke: var(--cool-green);
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon.active .mat-icon[svgIcon=pricingIcon] svg g path,
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon:hover .mat-icon[svgIcon=pricingIcon] svg g path {
  fill: var(--cool-green) !important;
  opacity: 1 !important;
  stroke: unset;
}
.base-layout-wrapper .base-drawer .drawer-nav.planning-icon .mat-icon[svgIcon=pricingIcon] svg g path {
  fill: black;
  opacity: .5;
}
.base-layout-wrapper .base-drawer .drawer-nav.image-view.active div,
.base-layout-wrapper .base-drawer .drawer-nav.image-view:hover div,
.base-layout-wrapper .base-drawer .drawer-nav.image-view.active mat-icon svg path,
.base-layout-wrapper .base-drawer .drawer-nav.image-view:hover mat-icon svg path,
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon svg polyline,
.base-layout-wrapper .base-drawer .drawer-nav:hover mat-icon svg polyline,
.base-layout-wrapper .base-drawer .drawer-nav:hover mat-icon svg path.stroke-here,
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon svg path.stroke-here {
  color: var(--cool-green);
  stroke: var(--cool-green);
  fill: none;
}
.base-layout-wrapper .base-drawer .drawer-nav.active mat-icon.camera svg path {
  fill: none !important;
  stroke: var(--cool-green) !important;
}
.drawer-nav.active .mat-icon[svgIcon=schedule] #Group-2 > rect:first-child {
  stroke: var(--cool-green) !important;
}
.drawer-nav.active .mat-icon[svgIcon=schedule] #Group-2 > rect:not(:first-child) {
  fill: var(--cool-green) !important;
}
.drawer-nav.active .mat-icon[svgIcon=schedule] #Group-2 > rect:nth-child(8),
.drawer-nav.active .mat-icon[svgIcon=schedule] #Group-2 > rect:nth-child(9) {
  fill: unset !important;
}
.drawer-nav.drawer-nav:hover .mat-icon[svgIcon=schedule] #Group-2 > rect:first-child {
  stroke: var(--cool-green) !important;
}
.drawer-nav.drawer-nav:hover .mat-icon[svgIcon=schedule] #Group-2 > rect:not(:first-child) {
  fill: var(--cool-green) !important;
}
.drawer-nav.drawer-nav:hover .mat-icon[svgIcon=schedule] #Group-2 > rect:nth-child(8),
.drawer-nav.drawer-nav:hover .mat-icon[svgIcon=schedule] #Group-2 > rect:nth-child(9) {
  fill: unset !important;
}
.summary-menu {
  width: 230px;
}
.summary-menu .summary-menu-row {
  min-height: 25px;
  padding: 0 15px;
}
.summary-menu .summary-menu-row .summary-menu-info {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 13px;
  font-weight: unset;
}
.summary-menu .summary-menu-row .summary-menu-price {
  font-family: gilroy-medium;
  font-size: 13px;
  line-height: 14px;
  text-align: right;
}
.footer-icons {
  align-items: center;
}
.base-layout-wrapper.installer-mode {
  width: 768px !important;
  height: calc(100vh - 60px);
}
@media only screen and (max-width: 599px) {
  .base-layout-wrapper .base-toolbar {
    max-height: 45px;
    border-width: 0;
  }
  .base-layout-wrapper.installer-mode {
    height: calc(100vh - 60px);
    width: 100% !important;
  }
  .base-layout-wrapper .base-drawer {
    max-width: 385px !important;
    width: 100% !important;
  }
  .base-layout-wrapper .base-drawer .base-drawer-detail {
    padding: 15px 20px;
    border-bottom: 1px solid var(--light-gray2);
  }
  .base-layout-wrapper .base-drawer .base-drawer-detail .base-toolbar-left {
    flex-direction: column;
    max-width: 100%;
  }
  .base-layout-wrapper .base-drawer .base-drawer-detail .base-toolbar-left > div:nth-last-child(n+1) {
    margin-bottom: 5px;
  }
  .base-layout-wrapper .base-drawer .base-drawer-detail .base-toolbar-right {
    max-width: 100%;
    justify-content: space-between;
  }
  .base-drawer-detail .breadcrumb-navigations {
    margin-left: 0px;
  }
  .base-layout-wrapper .base-details .more-menu {
    display: none !important;
  }
  .base-drawer-detail .base-input-container.input-title,
  .base-drawer-detail .base-input-container.input-title input {
    padding-left: 0px;
    max-width: 45vw;
  }
  .base-toolbar .base-input-container.input-title input {
    display: block !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
  .base-layout-wrapper .base-drawer .drawer-nav-wrapper .drawer-nav {
    height: 45px;
  }
  .base-layout-wrapper .base-drawer .drawer-nav-wrapper {
    border-color: var(--light-gray2);
  }
  .base-layout-wrapper .base-drawer .drawer-nav {
    display: flex;
    flex-direction: row;
    min-width: calc(100% - 15px);
    width: calc(100% - 15px);
    justify-content: flex-start;
    align-items: center;
    height: 50px;
    padding-left: 15px;
  }
  .base-layout-wrapper .base-drawer .drawer-nav.nav-level-1.active::after {
    content: none;
  }
  .base-layout-wrapper .base-drawer .drawer-nav div {
    font-size: 16px;
    margin-left: 9px;
    font-family: gilroy-semi-bold;
  }
  .drawer-nav mat-icon.mat-icon[svgIcon=imageView] {
    margin-right: 4px;
    margin-left: 4px;
  }
  .base-drawer-navigations {
    height: calc(100vh - 209px) !important;
  }
  @media (max-width: 1024px) {
    .base-drawer-navigations {
      height: calc(100dvh - 209px) !important;
    }
  }
  .base-drawer-navigations.base-drawer-nav {
    max-height: calc(100vh - 360px) !important;
    height: fit-content !important;
    overflow: auto;
  }
}
.footer-icons {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  place-content: start space-between !important;
  margin-right: 20px !important;
  margin: auto 85px 10px 20px !important;
}
.footer-icons > div {
  margin-bottom: 0 !important;
  margin-left: 0;
}
.footer-icons .second-footer-icons {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  place-content: start space-between !important;
}
.footer-icons .second-footer-icons > mat-icon {
  margin-bottom: 0 !important;
  margin-left: 0;
}
.add-resource {
  flex-direction: row !important;
}
.quote-check-list {
  min-width: 16px;
  min-height: 14px;
  height: 14px !important;
  width: 16px !important;
  cursor: pointer;
}
.check-list md-icon:not(.un-checked) {
  opacity: 1;
  animation: moveFromBottom 600ms ease-in-out;
}
.check-list md-icon {
  min-height: 17px;
  height: 17px;
  opacity: 1;
}
.check-list-progressor {
  background-color: #F2F5F7;
  height: 8px;
  border-radius: 4px;
  position: relative;
}
.check-list-progressor-filled {
  background-color: var(--green-blue);
  position: absolute;
  height: 8px;
  border-radius: 4px;
}
.quote-check-list-inner-container {
  padding: 12px 20px;
  font-family: gilroy-bold;
  color: #041932;
  font-size: 12px;
}
.check-list .check-list-text:hover {
  cursor: pointer;
  color: var(--cool-green);
}
.checklist-count {
  top: 4px;
  left: 10px;
  position: absolute;
  font-size: 11px;
  background-color: var(--cool-green);
  color: var(--white);
  padding: 1px 5px;
  border-radius: 50%;
  min-width: 5px;
}
.success-state {
  position: absolute;
  top: 0;
  height: 100%;
  background-color: rgba(255, 255, 255, .95);
  padding: 45px;
}
.success-icon {
  font-size: 71px;
}
.check-lists .radio-with-info .mat-radio-outer-circle,
.check-lists .radio-with-info .mat-radio-inner-circle {
  height: 16px;
  width: 16px;
}
.check-list-container {
  max-width: 306px !important;
  margin-left: 25px;
}
.mat-mdc-card-avatar {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  flex-shrink: 0;
  object-fit: cover;
}
.attachments.design-attachments app-file-grid {
  height: 146px;
  width: 146px;
  max-height: 146px;
  max-width: 146px;
  margin: 20px 10px;
}
.attachments.design-attachments app-upload-file.drop-zone-overview,
.attachments.design-attachments app-upload-file.drop-zone-overview .img-upload {
  margin-left: 0 !important;
  margin-right: 10px !important;
  min-width: 146px !important;
  min-height: 146px !important;
  width: 146px !important;
  max-height: 146px !important;
}
.attachments.design-attachments app-file-grid .attachments-overlay {
  margin: 0;
}
.attachments.design-attachments app-file-grid .attachments-overlay .attachment-name {
  border-top: none;
  padding: 5px 10px;
}
.attachments.design-attachments app-file-grid .attachments-overlay .attachment-image-container {
  min-height: 154px;
}
#ppe-base .base-layout-wrapper .base-drawer {
  min-width: 100px;
  width: unset;
  max-width: 100px;
}
.si-managed {
  padding: 16px !important;
  margin-bottom: 20px;
  border: unset !important;
  border-radius: 3px;
  background:
    linear-gradient(
      90deg,
      #FAD961 0%,
      #F76B1C 100%);
  border: unset;
}
.base-layout-wrapper.base-layout-wrapper-sm .base-toolbar {
  height: 128px !important;
  max-height: 128px !important;
}
.base-layout-wrapper.base-layout-wrapper-sm .base-toolbar-left,
.base-layout-wrapper.base-layout-wrapper-sm .base-toolbar-right {
  max-width: 100%;
}
.base-layout-nav-background {
  background: rgba(13, 187, 125, 0.08);
}

/* src/assets/css/base-layout/router-layout.css */
.router-filter {
  position: relative;
  min-width: 300px;
  max-width: 300px;
  z-index: 1;
  margin-left: -300px;
  border-right: 1px solid #CED0D3;
  transition: margin 0.5s;
  height: 100%;
  background-color: white;
}
.router-filter.hover-on-ipad {
  position: absolute;
}
.router-filter.visible {
  margin-left: 0;
  transition: margin 0.5s;
  background-color: white;
}
.router-filter .filter-toggler {
  display: block;
  position: absolute;
  top: 22px;
  right: -21px;
  height: 40px;
  width: 21px;
  cursor: pointer;
  border: 1px solid rgb(206, 208, 211);
  border-radius: 0px 5px 5px 0px;
  background-color: var(--white);
  transition: display 1s;
}
.project-detail-drawer-content .router-filter .filter-toggler {
  right: -35px;
}
.router-filter .filter-toggler mat-icon {
  transform: rotate(180deg);
  margin: 14px 3px;
}
.router-filter.visible .filter-toggler {
  display: none;
  transition: display 0.5s;
}
.router-filter .router-filter-content {
  max-height: 100%;
  overflow: auto;
  padding-bottom: 10px;
}
.router-filter .filter-title {
  position: relative;
  font-size: 15px;
  padding: 10px 20px;
  margin-top: 20px;
  margin-bottom: 0;
}
.router-filter .filter-title mat-icon {
  position: absolute;
  right: 21px;
  top: 12px;
}
.router-base-container {
  height: calc(100vh - 64px);
  overflow-y: auto;
  overflow-x: hidden;
}
.router-tool-bar {
  height: 56px;
  min-height: 56px;
  border-bottom: 1px solid var(--silver);
  padding: 0 18px;
}
#dtCloudApp .router-tool-bar .added-items,
#dtCloudApp .router-tool-bar .removed-items {
  opacity: 1;
}
#dtCloudApp .router-tool-bar .removed-items {
  color: var(--red);
}
#dtCloudApp .router-tool-bar .added-items {
  color: var(--cool-green);
}
.router-container {
  display: flex;
  height: calc(100vh - 64px);
  padding: 24px 24px 24px 24px !important;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0 auto;
}
.router-base-container.base-with-toolbar .router-container {
  height: calc(100vh - 120px);
}
.router-container .page-header {
  padding: 0;
}
.router-sub-base-container {
  height: calc(100vh - 64px);
}
.router-base-container.base-with-toolbar .router-sub-base-container {
  height: calc(100vh - 120px);
}
.router-main-content {
  width: 100%;
  margin: 0 auto;
  display: block !important;
}
@media (min-width: 2230px) {
  .router-main-content {
    max-width: unset;
  }
}
.router-main-content * {
}
.router-sub-content {
  max-width: 1270px;
  margin: 0 auto;
  margin-top: 20px;
  width: 100%;
}
.filter-scroll-mask {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.5);
}
@media only screen and (min-width: 2240px) {
  .router-container {
    flex-direction: row !important;
  }
  .router-container .router-main-content.margin-R100-on-large {
    margin-right: 100px;
  }
  .router-container .router-sub-content {
    position: relative;
    min-width: 627px;
    max-width: fit-content;
    margin-left: 0;
    margin-top: 0px;
    background-color: var(--light-gray3);
    height: fit-content;
    padding: 5px 50px;
  }
  .router-container .router-sub-content:after {
    content: "";
    height: 30px;
    width: 30px;
    transform: rotate(45deg);
    position: absolute;
    left: -15px;
    top: 30px;
    background-color: var(--light-gray3);
  }
}
@media (min-width: 767px) and (max-width: 920px) {
  .router-container {
    padding: 0 30px;
    padding-top: 40px;
  }
  .router-filter {
    width: 250px;
    min-width: 250px;
    margin-left: -250px;
  }
  .drawing .router-filter {
    margin-left: -300px !important;
  }
}
@media only screen and (max-width: 599px) {
  .router-base-container {
    height: calc(100vh - 145px);
  }
  .router-container {
    height: calc(100vh - 145px);
    padding: 0 16px;
    padding-top: 16px;
  }
  .router-base-container.base-with-toolbar .router-container {
    height: calc(100vh - 101px);
  }
  .router-sub-base-container {
    height: calc(100vh - 45px);
  }
  .router-base-container.base-with-toolbar .router-sub-base-container {
    height: calc(100vh - 101px);
  }
  .router-filter {
    position: fixed;
    height: 100vh;
    max-height: 80vh;
    height: auto;
    bottom: 0;
    margin-left: 0;
    top: 100vh;
    width: 100vw;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    transition: top 0.5s;
  }
  .router-filter.visible {
    top: auto;
    transition: top 0.5s;
    width: 100%;
    min-width: 100%;
    max-height: 70vh;
    overflow-y: auto;
  }
  .drawing .router-filter.visible {
    top: auto !important;
    transition: top 0.5s;
    width: 100%;
    min-width: 100%;
    max-height: 70vh !important;
    overflow-y: auto;
  }
  .router-filter .filter-toggler {
    display: none;
  }
  .drawing .router-filter {
    position: fixed !important;
    top: 100vh !important;
  }
  .drawing .router-filter .filter-toggler {
    display: block !important;
    bottom: 23px;
    position: fixed;
    left: -2px;
    top: 78PX;
  }
  .router-filter .filter-title mat-icon {
    transform: rotate(-90deg);
    right: 30px;
    top: 15px;
  }
  .drawing .router-filter .btn-menu-location {
    right: 14px;
    top: 7px;
  }
}
.base-layout-wrapper-sm .router-base-container,
.base-layout-wrapper-sm .router-sub-base-container,
.base-layout-wrapper-sm .router-container {
  height: calc(100vh - 148px);
}
.drawing .router-filter .filter-toggler mat-icon {
  transform: rotate(180deg);
  margin: 17px 6px;
}
.drawing .router-filter .filter-toggler {
  height: 48px;
  width: 24px;
  border-radius: 0px 15px 15px 0px;
  background-color: var(--cool-green);
  border: 0px;
}

/* src/assets/css/base-layout/skeletons.css */
.base-nav-skeleton:empty {
  margin: auto;
  width: 100%;
  height: 268px;
  background-image:
    linear-gradient(
      92deg,
      rgba(255, 255, 255, 0%),
      rgba(255, 255, 255, 0.5) 25px,
      rgba(255, 255, 255, 0.05) calc(100% - 25px)),
    linear-gradient(var(--skeleton-color) 70px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    linear-gradient(var(--skeleton-color) 70px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    linear-gradient(var(--skeleton-color) 70px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0);
  background-repeat: no-repeat;
  background-size:
    25px 100%,
    calc(100% - 35px) 45px,
    calc(100% - 12px) 13px,
    calc(100% - 34px) 45px,
    calc(100% - 12px) 13px,
    calc(100% - 34px) 45px,
    calc(100% - 12px) 13px;
  background-position:
    0 0,
    17.5px 6px,
    6px 62px,
    17.5px 97px,
    6px 153px,
    17.5px 188px,
    6px 244px;
  -webkit-animation: navShine 1s infinite;
  animation: navShine 1s infinite;
}
@keyframes navShine {
  to {
    background-position:
      120% 0,
      17.5px 6px,
      6px 62px,
      17.5px 97px,
      6px 153px,
      17.5px 188px,
      6px 244px;
  }
}
.base-detail-skeleton:empty {
  margin: 0;
  width: 100%;
  height: 50px;
  background-repeat: no-repeat;
  background-image:
    linear-gradient(
      85deg,
      rgba(255, 255, 255, 0%),
      rgba(255, 255, 255, 0.5) 30px,
      rgba(255, 255, 255, 0.05) calc(100% - 25px)),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    radial-gradient(var(--skeleton-color) 50%, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0),
    radial-gradient(var(--skeleton-color) 50%, transparent 0),
    linear-gradient(var(--skeleton-color) 20px, transparent 0);
  background-size:
    25px 100%,
    106px 10px,
    106px 10px,
    162px 15px,
    106px 15px,
    20px 15px,
    24px 24px,
    55px 15px,
    24px 24px,
    55px 15px;
  background-position:
    0 0,
    0px 6px,
    117.5px 6px,
    0px 26px,
    117.5px 26px,
    243px 26px,
    276px 22px,
    308px 26px,
    373px 22px,
    405px 26px;
  -webkit-animation: detailShine 1.5s infinite;
  animation: detailShine 1.5s infinite;
}
@keyframes detailShine {
  to {
    background-position:
      100% 0,
      0px 6px,
      117.5px 6px,
      0px 26px,
      117.5px 26px,
      243px 26px,
      276px 22px,
      308px 26px,
      373px 22px,
      405px 26px;
  }
}
.item-header-loader {
  height: 66px;
  width: 100%;
  background-image:
    linear-gradient(
      100deg,
      rgba(255, 255, 255, 0),
      rgba(255, 255, 255, 0.5) 50%,
      rgba(255, 255, 255, 0) 80%),
    linear-gradient(#F3F3F4 59px, transparent 0),
    linear-gradient(#F3F3F4 38px, transparent 0);
  background-repeat: repeat-y;
  background-size:
    50px 200px,
    277px 200px,
    105px 200px;
  background-position:
    0 0,
    0px 0px,
    97% 0px;
  animation: itemHeaderShine 1s infinite;
}
@keyframes itemHeaderShine {
  to {
    background-position:
      100% 0,
      0px 0px,
      97% 0px;
  }
}
.item-list-loader {
  height: 166px;
  width: 100%;
  background-image:
    linear-gradient(
      100deg,
      rgba(255, 255, 255, 0),
      rgba(255, 255, 255, 0.5) 50%,
      rgba(255, 255, 255, 0) 80%),
    linear-gradient(#F3F3F4 38px, transparent 0),
    linear-gradient(#F3F3F4 26px, transparent 0),
    linear-gradient(#F3F3F4 26px, transparent 0),
    linear-gradient(#F3F3F4 26px, transparent 0);
  background-repeat: repeat-y;
  background-size:
    50px 200px,
    147px 200px,
    408px 200px,
    344px 200px,
    289px 200px;
  background-position:
    0 0,
    0px 0px,
    0px 55px,
    0px 95px,
    0px 138px;
  animation: itemListShine 1s infinite;
  height: 100%;
  margin-top: 30px;
}
.item-list-loader.overview-loader {
  min-height: 175px;
  background-size:
    50px 200px,
    30% 200px,
    80% 200px,
    60% 200px,
    40% 200px;
}
.load-more-container {
  height: 150px;
  width: 100%;
}
@keyframes itemListShine {
  to {
    background-position:
      100% 0,
      0 0px,
      0 55px,
      0 95px,
      0 138px;
  }
}
.loading-img-container {
  background-color: var(--silver-25);
  height: 230px;
  max-width: 420px;
  min-width: 400px;
  border-bottom: 1px solid var(--silver-25) !important;
}
.loading-div-container {
  padding: 10px 40px 10px 20px;
  border-bottom: 1px solid var(--silver-25);
}
.skeleton-loader-header {
  height: 50px;
  width: 200px;
  background-image:
    linear-gradient(
      100deg,
      rgba(247, 249, 251, 0),
      rgba(247, 249, 251, 0.5) 50%,
      rgba(247, 249, 251, 0) 80%),
    linear-gradient(#E8EBEE 15px, transparent 0),
    linear-gradient(#E8EBEE 15px, transparent 0),
    linear-gradient(#E8EBEE 15px, transparent 0);
  background-repeat: repeat-y;
  background-size:
    300px 150px,
    300px 150px,
    100px 170px;
  background-position:
    0 0,
    20px 19px,
    20px 44px,
    20px 68px;
  animation: shine1 1s infinite;
  display: inline-block;
  padding-bottom: 17px;
}
.skeleton-loader-header-img {
  display: inline-block;
  height: 50px;
  width: 70px;
  background-image:
    linear-gradient(
      100deg,
      rgba(247, 249, 251, 0),
      rgba(247, 249, 251, 0.5) 50%,
      rgba(247, 249, 251, 0) 80%),
    linear-gradient(#E8EBEE 15px, transparent 0),
    linear-gradient(#E8EBEE 15px, transparent 0),
    linear-gradient(#E8EBEE 15px, transparent 0);
  background-repeat: repeat-y;
  background-size: 70px 10px;
  background-position:
    0 0,
    20px 19px,
    20px 44px,
    20px 68px;
  animation: shine1 1s infinite;
  display: inline-block;
  margin-top: 20px;
}
.content-60-350,
.content-25-230,
.content-30-100,
.content-30-375,
.content-30-275 {
  margin: 10px 5px;
  background-color: var(--silver-25);
  border-radius: 2px;
}
.content-60-350 {
  height: 60px;
  width: 350px;
}
.content-25-230 {
  height: 25px;
  width: 230px;
}
.content-30-100 {
  height: 30px;
  width: 100px;
}
.content-30-375 {
  height: 30px;
  width: 375px;
}
.content-30-275 {
  height: 30px;
  width: 275px;
}
.loading-action-container {
  padding: 5px 20px;
}
.loading-btn-div {
  height: 80px;
  width: 25%;
  max-width: 76px;
  border-radius: 2px;
  margin: 6px;
  background-color: #F3F3F4;
  display: inline-block;
}
@media only screen and (max-width: 767px) {
  .base-nav-skeleton:empty {
    background-image:
      linear-gradient(
        92deg,
        rgba(255, 255, 255, 0%),
        rgba(255, 255, 255, 0.5) 25px,
        rgba(255, 255, 255, 0.05) calc(100% - 25px)),
      linear-gradient(var(--skeleton-color) 70px, transparent 0),
      linear-gradient(var(--skeleton-color) 70px, transparent 0),
      linear-gradient(var(--skeleton-color) 70px, transparent 0);
    background-size:
      25px 100%,
      calc(100% - 40px) 70px,
      calc(100% - 40px) 70px,
      calc(100% - 40px) 70px;
    background-position:
      0 0,
      20px 6px,
      20px 82px,
      20px 158px;
  }
  @keyframes navShine {
    to {
      background-position:
        120% 0,
        20px 6px,
        20px 82px,
        20px 158px;
    }
  }
  .base-detail-skeleton:empty {
    height: 74px;
    background-repeat: no-repeat;
    background-image:
      linear-gradient(
        85deg,
        rgba(255, 255, 255, 0%),
        rgba(255, 255, 255, 0.5) 30px,
        rgba(255, 255, 255, 0.05) calc(100% - 25px)),
      linear-gradient(var(--skeleton-color) 20px, transparent 0),
      linear-gradient(var(--skeleton-color) 20px, transparent 0),
      linear-gradient(var(--skeleton-color) 20px, transparent 0),
      linear-gradient(var(--skeleton-color) 20px, transparent 0),
      linear-gradient(var(--skeleton-color) 20px, transparent 0),
      radial-gradient(var(--skeleton-color) 50%, transparent 0),
      linear-gradient(var(--skeleton-color) 20px, transparent 0),
      radial-gradient(var(--skeleton-color) 50%, transparent 0),
      linear-gradient(var(--skeleton-color) 20px, transparent 0);
    background-size:
      25px 100%,
      106px 10px,
      106px 10px,
      162px 15px,
      106px 15px,
      87px 15px,
      24px 24px,
      109px 15px,
      24px 24px,
      110px 15px;
    background-position:
      0 0,
      0px 6px,
      117.5px 6px,
      0px 26px,
      117.5px 26px,
      243px 26px,
      -4px 46px,
      35px 50px,
      189px 46px,
      220px 50px;
  }
  @keyframes detailShine {
    to {
      background-position:
        100% 0,
        0px 6px,
        117.5px 6px,
        0px 26px,
        117.5px 26px,
        243px 26px,
        -4px 46px,
        35px 50px,
        189px 46px,
        220px 50px;
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  .base-nav-skeleton:empty,
  .base-detail-skeleton:empty,
  .item-header-loader,
  .item-list-loader,
  .skeleton-loader-header,
  .skeleton-loader-header-img {
    animation: none;
  }
}

/* src/assets/css/base-layout/item-design.css */
.design-group-header,
.design-sub-group-header {
  min-height: 35px;
  color: #01162f;
  font-family: gilroy-semi-bold;
  font-size: 30px;
  line-height: 35px;
  margin-right: 15px;
}
.down-arrow.mat-icon[svgIcon=menuRightIcon] {
  transform: rotate(90deg);
  min-width: 32px;
}
.design-group-header input.mat-mdc-input-element {
  color: #01162f;
  font-family: gilroy-semi-bold;
  font-size: 30px;
}
.design-group-header input.mat-mdc-input-element.filter-number {
  font-size: 15px;
}
.design-sub-group-header {
  font-size: 24px;
}
.items-group-by-container {
  margin-top: 20px;
}
.items-group-by-container * {
  -webkit-user-select: none;
  user-select: none;
}
.items-group-by-container.empty-block {
  padding: 30px 20px;
}
.item-title {
  font-size: 24px;
  font-family: gilroy-semi-bold;
  color: #01162f;
  margin-bottom: 18px;
}
.item-header-row {
  padding: 10px 5px;
  padding-right: 16px;
  margin-top: 10px;
  padding-top: 0;
}
.group-item-row {
  position: relative;
  cursor: pointer;
  color: var(--navy);
  background-color: var(--grid-item-gray);
  border: 1px solid var(--light-gray2);
  border-right: none;
  border-left: 3px solid #a3a6aa;
  border-radius: 2px;
  min-height: 35px;
  border-left-color: rgb(163, 166, 170);
  padding: 8px 5px;
  padding-right: 30px;
}
.new-table-group-item-row {
  position: relative;
  cursor: pointer;
  color: var(--navy);
  border-bottom: 1px solid var(--light-gray2);
  min-height: 35px;
  padding: 8px 5px;
  padding-right: 30px;
  background-color: white !important;
}
.new-table-group-item-row.even-row {
  background-color: var(--color-background) !important;
}
.group-item-row.density {
  min-height: 71px;
}
.group-item-row:hover {
  background-color: var(--light-gray2);
}
.group-item-row.selected {
  background-color: var(--light-gray2);
}
.group-item-row .show-on-hover {
  visibility: hidden;
}
.group-item-row:hover .show-on-hover {
  visibility: visible;
}
.bom-group-item-row.compact-view {
  padding: 0px 5px;
  padding-right: 30px;
  min-height: 44px;
  height: 100%;
}
.group-item-toggler {
  position: absolute;
  right: 1.5px;
  top: 0;
  bottom: 0;
  margin: auto;
  height: 100%;
  width: 30px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.group-item-toggler2 {
  position: unset !important;
}
.group-item-toggler .mat-icon {
  outline: none;
}
.group-item-toggler.expand .mat-icon {
  transform: rotate(90deg);
}
.group-item-row .group-detail,
.group-item-header {
  display: flex;
  flex: 1 0 100%;
}
.group-detail,
.group-name {
  max-width: calc(100% - 65px);
  overflow: hidden;
}
.group-name > div > div {
  overflow: hidden;
  flex-wrap: wrap;
}
.group-name .group-item {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.group-item-row .group-item .mat-icon[svgIcon=deleteIcon],
.group-item-row .group-item .mat-icon[svgIcon=unDeleteIcon] {
  color: rgb(138, 148, 160);
  margin-top: 2px;
}
.compact-view .group-item.item-bold {
  overflow: visible;
}
.group-item-row.added > div > .group-item {
  color: var(--cool-green);
}
.group-item-row.removed > div > .group-item {
  color: var(--red);
}
.group-item-header {
  color: var(--navy);
  font-size: 15px;
}
.item-header {
  font-family: gilroy-semi-bold;
  font-size: 10px;
  color: var(--cool-grey);
  text-transform: uppercase;
  text-align: left;
  padding: 5px 0px;
  cursor: pointer;
}
.newtableUI-item-header {
  color: var(--blue) !important;
  font-family: "gilroy-semi-bold" !important;
  font-size: 12px !important;
  text-transform: unset !important;
}
.newtableUI-item-header-row {
  background-color: #EBF4FB !important;
  border-right: 1px solid var(--color-divider-dark) !important;
  border-bottom: 1px solid var(--blue) !important;
  height: 32px !important;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 0;
}
.newtableUI-item-header.item-right {
  text-align: right;
  justify-content: flex-end;
}
.item-footer-row {
  border-top: 1px solid var(--light-gray2);
  padding: 5px;
  padding-right: 16px;
  margin-top: 15px;
}
.item-footer {
  font-family: gilroy-semi-bold;
  color: var(--cool-grey);
}
.item-footer .mat-icon[svgIcon=labor] path {
  fill: var(--medium-gray);
}
.group-item-image {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 55px;
  width: 55px;
  min-height: 55px;
  min-width: 55px;
}
.group-item-image img {
  max-width: 100%;
  max-height: 100%;
}
.group-item-image .item-acronym,
.item-preview-package .items-list .item-acronym {
  text-align: center;
  vertical-align: middle;
  background-color: white;
  color: var(--medium-gray);
  text-transform: uppercase;
  font-size: 12px;
  width: 100%;
  height: 100%;
  line-height: 55px;
}
.group-item {
  font-size: 13px;
  font-family: gilroy-regular;
  text-align: left;
  line-height: 20px;
  display: flex;
}
.group-item.item-bold {
  font-family: gilroy-semi-bold;
}
.group-item.item-center,
.item-header.item-center,
.item-footer.item-center {
  text-align: center;
}
.group-item.item-right,
.item-header.item-right,
.item-footer.item-right {
  text-align: right;
  justify-content: flex-end;
}
.group-item.item-gray,
.item-header.item-gray {
  color: var(--medium-gray);
}
app-item-display {
  display: block;
}
app-item-display app-item-display {
  padding-left: 70px;
  background-color: var(--white);
}
.quote-view app-item-display app-item-display {
  padding-left: 70px;
  background-color: var(--white);
}
app-item-display app-item-display app-item-display {
  padding-left: 32px;
  background-color: var(--light-gray2);
}
.product-search {
  position: relative;
  z-index: 5;
}
.product-search .utilize-co {
  position: absolute;
  top: 12px;
  left: 180px;
}
@media only screen and (max-width: 766px) {
  .design-group-header .design-group-name {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 135px;
  }
}
.name-border {
  margin-left: -10px;
  border: 1px solid transparent;
  padding: 0 6px;
  margin-right: -7px;
  cursor: auto;
}
.name-border:hover {
  border: 1px solid var(--light-gray2) !important;
  box-shadow: inset 0 1px 4px 0 rgb(0 0 0 / 6%);
}
.labor-summary-div {
  height: 60px;
  width: 393px;
  border-radius: 4px;
  background-color: #7E8A96;
}
.labor-summary-price {
  height: 39px;
  width: 73px;
  font-family: Gilroy-Bold;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 39px;
  text-align: right;
}
.labor-summary-name {
  height: 39px;
  width: 127px;
  font-family: Gilroy-Bold;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 39px;
}
.item-status {
  height: 44px;
  max-height: 44px;
}
.bom-group-item-row .item-status {
  height: 100%;
  max-height: 44px;
  padding: 4px 0;
}
.item-group-scroll-container {
  display: grid;
  overflow-x: auto;
}
.item-group-scroll-container .items-group-by-container {
}
.item-section {
  z-index: 2;
  position: relative;
  background-color: white;
}
.empty-block-new-design {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  padding: 40px 24px;
  color: var(--color-text-primary);
  font-family: gilroy-regular;
  font-size: 14px;
  border-radius: 12px;
  border: 1px solid var(--color-divider-dark);
  background: var(--color-background);
  line-height: 20px;
}

/* src/assets/css/base-layout/item-preview.css */
.item-preview {
  position: fixed;
  top: 64px;
  width: auto;
  min-width: 420px;
  right: -472px;
  max-width: 472px;
  transition: right 0.3s;
  height: calc(100% - 64px);
  background-color: white;
  overflow: hidden;
  overflow-y: auto;
  z-index: 10;
  box-shadow: 0 6px 9px 0 rgba(0, 0, 0, 0.25);
}
#quoteItemPreview.safari-browser {
  top: 88px;
}
.item-preview .item-preview-container {
  position: relative;
  padding-bottom: 75px;
}
.item-preview.visible {
  right: 0;
  transition: right 0.5s;
}
.item-preview .item-preview-block {
  background-color: white;
  border-bottom: 1px solid var(--silver);
  padding: 15px 25px;
}
.item-preview-block.price-block {
  border-bottom: none;
}
.item-preview-block.description-block {
  border-top: 1px solid var(--silver);
}
.item-preview .item-preview-block.no-border {
  border-color: transparent;
}
.item-preview .image-drop-container {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 230px;
  height: 230px;
  border-bottom: 1px solid var(--silver);
  cursor: pointer;
  overflow: hidden;
  flex-wrap: wrap;
}
.item-preview .image-drop-container.multiple-images {
  justify-content: center;
  align-items: center;
}
.item-preview .image-drop-container img {
  max-width: 97%;
  max-height: 97%;
  object-fit: cover;
}
.item-preview .image-drop-container.multiple-images img {
  min-width: 170px;
  max-height: 100px;
  -o-object-fit: cover;
  object-fit: cover;
}
.item-preview .image-drop-container .close-button {
  position: absolute;
  top: 10px;
  left: 10px;
  box-sizing: border-box;
  height: 28px;
  width: 28px;
  border: 1px solid var(--silver);
  border-radius: 4px;
  background-color: white;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
  margin: 0;
  padding: 0;
  cursor: pointer;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
}
.item-preview .image-drop-container .close-button .mat-icon:hover {
  opacity: 1;
  transform: rotate(90deg);
  transition: all 0.10s;
}
.item-preview .image-drop-container .close-button .mat-icon:hover .stroke-here {
  stroke: #1162ff;
}
.item-preview .image-drop-container .close-button.more {
  right: 13px;
  left: auto;
}
.item-preview .image-drop-container .close-button mat-icon {
  height: 12px;
  width: 12px;
  min-height: 12px;
  min-width: 12px;
  max-width: 12px;
}
.item-preview .image-drop-container.multiple-images .item-selected-count {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  line-height: 230px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
}
.item-preview .upload-btn {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  margin-top: 5px;
  padding-right: 13px;
}
.item-preview .item-name {
  font-size: 20px;
  font-family: gilroy-semi-bold;
  padding-bottom: 5px;
}
.item-preview .item-name mat-icon[svgIcon=editPencil2] {
  margin-left: 5px;
}
.item-preview .item-name mat-icon[svgIcon=editPencil2] path {
  fill: var(--medium-gray);
}
.item-preview .item-short-desc {
  cursor: pointer;
  display: inline;
}
.item-preview .item-detail {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 5px;
}
.item-preview .item-detail > * {
  margin-right: 5px;
  margin-top: 5px;
}
.item-preview .item-detail .qty-label {
  border-radius: 3px;
  background-color: var(--medium-gray);
  color: white;
  padding: 4px 6px;
  font-size: 12px;
}
.item-preview .count-label {
  border-radius: 3px;
  background-color: var(--medium-gray);
  color: white;
  padding: 4px 6px;
  font-size: 12px;
}
.item-preview .item-detail .qty-label > span:first-child {
  margin-right: 5px;
}
.item-preview .item-price {
  display: flex;
  font-family: gilroy-bold;
  font-size: 24px;
}
.item-preview .item-price > span {
  margin-right: 3px;
}
.item-preview .item-price label {
  color: var(--medium-gray);
  font-family: gilroy-semi-bold;
  font-size: 12px;
  line-height: 30px;
}
.number-container {
  word-break: break-word;
  display: inline-block;
  border: 1px solid #C5C8C9;
  background-color: white;
  color: var(--medium-gray);
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 13px;
}
.number-container.navy {
  color: var(--navy);
}
.item-preview .item-action-container {
  display: flex;
  justify-content: center;
}
.item-preview .item-action-container .item-action {
  display: flex;
  width: calc(25% - 10px);
  flex-direction: column;
  align-items: center;
  min-height: 80px;
  margin: 0 5px;
  border-radius: 8px;
  background-color: #F8F8F8;
  text-align: center;
  justify-content: space-around;
  padding: 12px;
  cursor: pointer;
}
.item-preview .item-action-container .item-action:hover {
  background-color: rgba(158, 158, 158, 0.2);
}
.item-preview .item-action-container .item-action .label {
  font-size: 15px;
  margin-bottom: -7px;
}
.item-preview .item-action-container .item-action mat-icon {
  height: 17px;
  width: 17px;
}
.item-preview .item-action-container .item-action mat-icon[svgIcon=replace] {
  height: 30px;
  width: 29px;
  margin-bottom: -13px;
}
.item-preview .item-action-container .item-action mat-icon[svgIcon=package] {
  height: 18px;
  margin-bottom: 2px;
}
.item-preview .item-action-container .item-action mat-icon[svgIcon=copyContent] {
  height: 15px;
}
.item-preview .item-action-container .item-action mat-icon[svgIcon=sendPo] {
  height: 20px;
  width: 20px;
}
.preview-header,
.preview-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.item-preview-block > .preview-row > * {
  flex: 1 1 50%;
}
.item-preview-block .description-container {
  width: 360px;
}
.item-preview-block.labor-summary-block .preview-row {
  background-color: white;
  min-height: 30px;
  margin-top: 10px;
}
.item-preview-block.labor-summary-block .preview-row:last-child {
  font-family: gilroy-semi-bold;
  font-size: 13px;
}
.item-preview-block.price-block > .preview-row > *,
.item-preview-block.group-block > .preview-row > * {
  max-width: 50%;
}
.group-block .preview-row .filter-select {
  flex: 1 1 60%;
  max-width: 60%;
  min-width: 60%;
}
.item-preview-block.price-block.less-pricing > .preview-row > * {
  max-width: 100%;
}
.preview-row.start {
  justify-content: flex-start;
  flex-wrap: wrap;
  min-width: 50%;
}
.preview-row.space-between {
  justify-content: space-between;
  min-width: 50%;
}
.preview-row.end {
  justify-content: flex-end;
  min-width: 50%;
}
.preview-row.start > *,
.preview-row.space-between > *,
.preview-row.end > * {
  flex: 0 0 auto;
}
.preview-header label {
  color: #01162F;
  font-family: gilroy-semi-bold;
  font-size: 16px;
}
.preview-row > label {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  padding-left: 10px;
}
.item-preview-block .preview-header ng-select.custom-select {
  margin-top: 0;
  width: 50%;
}
#dtCloudApp .item-preview-block ng-select.custom-select {
  margin-top: 0 !important;
  width: 100%;
}
#dtCloudApp .item-preview-block app-tax-select ng-select.custom-select {
  margin-top: 10px !important;
  width: 100%;
}
.padding-less * {
  margin: 0 !important;
  padding-bottom: 0px !important;
  padding-top: 0 !important;
  border-top: 1px solid transparent;
  min-height: unset;
}
.padding-less .mat-form-field-hint-spacer {
  display: none;
}
.padding-less.mat-form-field-appearance-standard .mat-form-field-underline {
  display: none;
}
.padding-less {
  margin: 10px 0;
}
.price-block .padding-less {
  margin: 3px 0;
  flex-direction: unset;
}
.preview-row > label {
  color: var(--medium-gray);
  font-family: gilroy-medium;
}
.preview-empty-message {
  font-family: gilroy-medium;
  color: var(--medium-gray);
  padding: 20px 0px;
  text-align: center;
}
.preview-description {
  max-height: 36px;
  font-size: 13px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  margin-top: 7px;
}
.suggested-info {
  max-width: 90%;
}
.suggested-icon {
  border-radius: 50%;
  min-height: 12px;
  min-width: 12px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  font-size: 11px;
  text-align: center;
  background-color: var(--blue);
  color: var(--white);
  margin-left: 3px;
  line-height: 12px;
  cursor: pointer;
}
.suggested-info .mat-form-field-infix input.mat-input-element {
  border-color: var(--blue);
}
.preview-item-row {
  display: flex;
  padding: 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  justify-content: flex-start;
  align-items: center;
  border: 1px solid var(--silver);
  border-bottom: none;
}
.preview-item-row:last-child {
  border-bottom: 1px solid var(--silver);
}
.preview-item-row .alternate-image {
  position: relative;
  min-width: 35px;
  min-height: 30px;
  max-width: 35px;
  max-height: 30px;
  margin-right: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.preview-item-row .alternate-image img {
  position: absolute;
}
.preview-item-row .alternate-image div {
  line-height: 35px;
  text-align: center;
  background: var(--light-gray2);
  color: var(--medium-gray);
  height: 35px;
  width: 35px;
}
.preview-item-row span.statusBtn-green {
  min-width: 95px;
  margin-right: 5px;
}
.preview-item-row .alternate-name {
  min-width: 130px;
  width: 130px;
  margin-right: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.preview-item-row .alternate-difference {
  width: 95px;
  text-align: end;
  color: var(--cool-green);
}
.preview-item-row .alternate-difference.price-low {
  color: var(--red);
}
.preview-item-row .alternate-price {
  width: 85px;
  text-align: end;
}
.sub-preview-content {
  position: absolute;
  visibility: hidden;
  height: 100%;
  width: 100%;
  right: -420px;
  top: 0;
  background-color: white;
  transition: right 0.4s;
  z-index: 8;
}
.sub-preview-content.content-visible {
  right: 0;
  transition: right 0.4s;
  visibility: visible;
}
.project-information {
  padding: 10px;
  background-color: #ffffff;
}
.project-information.active {
  background-color: #4a525b;
}
.project-information label.label-header {
  font-family: gilroy-semi-bold;
  color: black;
  font-size: 18px;
  margin-right: 10px;
}
.project-information.active label.label-header {
  color: white;
}
.project-information .project-info-msg {
  color: white;
  margin: 10px;
  margin-bottom: 15px;
}
.project-information .project-info-container {
  margin: 10px;
  margin-bottom: 15px;
  border-radius: 10px;
}
.project-info-container .description-block {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.project-info-container .group-block {
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}
.bom-pricing-prompt {
  position: relative;
  text-align: center;
  height: 144px;
  width: 100%;
  border-radius: 4px;
  background-color: var(--light-gray2);
  padding: 12px;
  color: var(--medium-gray);
  font-family: gilroy-semi-bold;
  margin: 10px 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.bom-pricing-prompt .statusBtn-blue {
  width: 94px;
  height: 30px;
  font-size: 13px;
  line-height: 20px;
  border-radius: 0;
  cursor: pointer;
}
.bom-pricing-prompt mat-icon {
  position: relative;
  left: 62px;
  top: 2px;
  cursor: pointer;
}
.bom-pricing-prompt .prompt-header {
  font-size: 15px;
  font-family: gilroy-bold;
}
@media only screen and (max-width: 766px) {
  .item-preview {
    top: 0;
    height: 100%;
  }
}
@media only screen and (max-width: 420px) {
  .item-preview {
    top: 0;
    height: 100%;
    min-width: 100%;
    width: 100%;
  }
  .preview-item-row .alternate-name {
    min-width: 76px;
    max-width: 76px;
    margin-right: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.quote-preview-pack-price-section .mat-mdc-card-title {
  font-size: 16px !important;
}

/* src/assets/css/loading.css */
.loading-state-name {
  height: 27px;
  width: 200px;
  border-radius: 4px;
  background-color: var(--light-gray2);
}
.loading-state-button {
  height: 29px;
  width: 98px;
  border-radius: 4px;
  background-color: var(--light-gray2);
}
.loading-state-short-description {
  height: 18px;
  width: 160px;
  border-radius: 4px;
  background-color: var(--light-gray2);
}
.loading-progressor {
  margin-top: 50px;
}
@-webkit-keyframes travel {
  from {
    left: -2px;
  }
  to {
    left: 30px;
  }
}
@-webkit-keyframes spin {
  from {
  }
  to {
    -webkit-transform: rotateZ(360deg);
  }
}
@keyframes travel {
  from {
    left: -4px;
  }
  to {
    left: 30px;
  }
}
@keyframes spin {
  from {
    -moz-transform: rotate(0);
    -o-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.loader_path {
  position: relative;
  margin: auto;
  width: 40px;
  height: 10px;
  border-radius: 10px;
}
.loader_traveler {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  -webkit-animation-name: travel;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  -webkit-animation-duration: .35s;
  animation-name: travel;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: .45s;
}
.spinner {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  -webkit-animation-name: spin;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: .18s;
  animation-name: spin;
  animation-iteration-count: infinite;
  animation-duration: .18s;
}
.loader_path.white {
  background: #f5f5f5;
}
.loader_path.white .loader_traveler .spinner {
  background: var(--white);
}
.loader_path.gray {
  background: var(--light-gray2);
}
.loader_path.gray .loader_traveler .spinner {
  background: var(--medium-gray);
}
.progressor-text {
  margin-top: 5px;
  text-align: center;
  color: var(--medium-gray);
  z-index: 3;
}

/* src/assets/css/filter-panel.css */
.filter-header-content,
.filter-body-container {
  margin-left: 15px;
  width: calc(100% - 30px);
  font-family: gilroy-medium;
  font-size: 13px;
  color: var(--navy);
}
.filter-header-content {
  position: relative;
  font-family: gilroy-bold;
  font-size: 15px;
  cursor: pointer;
  padding: 10px 5px;
  margin-top: 10px;
}
.filter-header-content .all-item-loader {
  background-color: var(--skeleton-color);
  color: var(--skeleton-color);
  margin-top: -10px;
  height: 28px;
  position: absolute;
  right: 5px;
  top: 15.5px;
  width: 65px;
  overflow: hidden;
}
.filter-header-content .show-on-hover {
  visibility: hidden;
}
.filter-header-content:hover .show-on-hover {
  visibility: visible;
}
.filter-header-content.all-items:hover {
  background-color: #f5fffc;
  color: var(--cool-green);
}
.filter-header-content.all-items.active {
  background-color: #f2f3f4;
  color: var(--cool-green);
}
.filter-header-content span {
  font-family: gilroy-medium;
  font-size: 13px;
}
.filter-header-content mat-icon.chevron-down {
  transform: rotate(90deg);
  margin-left: 5px;
  position: relative;
  top: 4px;
}
.filter-header-content mat-icon.chevron-up {
  transform: rotate(-90deg);
  margin-left: 0px;
  position: relative;
  top: 4px;
}
.filter-body-container .filter-body-container {
  margin-left: 5px;
  padding-left: 10px;
  margin-right: 0px;
  width: calc(100% - 10px);
  border-left: 1px solid var(--light-gray2);
}
.filter-body-container app-filter-body {
  display: block;
}
.filter-body-container a.hover-link {
  margin-bottom: 10px;
}
.filter-body-container .filter-body,
.filter-body-container .filter-unassigned {
  cursor: pointer;
  padding: 5px 5px;
  min-height: 35px;
}
.filter-unassigned {
  color: var(--medium-gray);
  font-family: gilroy-regular;
}
.filter-body-container .filter-body:hover,
.filter-body-container .filter-unassigned:hover,
.filter-body-container .filter-body.hover,
.filter-body-container .filter-unassigned.hover {
  background-color: #f5fffc;
  color: var(--cool-green);
}
.filter-body-container .filter-body.active,
.filter-body-container .filter-unassigned.active {
  background-color: #f2f3f4;
  color: var(--cool-green);
}
.filter-body-container .filter-body .filter-info {
  display: flex;
}
.filter-body-container .filter-body div {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.filter-body-container .filter-body .filter-info mat-icon:not(.location-expand-collapse) {
  visibility: hidden;
  position: relative;
  left: 5px;
}
.location-expanded {
  transform: rotate(90deg);
}
.filter-body-container .filter-body .filter-info mat-icon.optional-icon {
  visibility: visible;
  position: relative;
  left: 5px;
}
@media (max-width: 599px) {
  .filter-body-container .filter-body .filter-info mat-icon {
    visibility: visible;
  }
}
.filter-body-container .filter-body:hover .filter-info mat-icon {
  visibility: visible;
}
.filter-body-container .filter-body:hover .filter-info mat-icon path {
  fill: #a3a6aa;
}
.filter-body-container .filter-body .filter-price {
  display: flex;
  max-width: 110px;
}
.filter-body-container .items-added,
.filter-body-container .items-deleted {
  position: relative;
  display: inline-block;
  z-index: 1;
  height: 9px;
  width: 9px;
  border-radius: 50%;
  background-color: var(--cool-green);
  border-color: var(--cool-green);
  margin-left: 4px;
  margin-right: -3px;
}
.filter-body-container .items-deleted {
  margin-right: 0;
  margin-left: 0;
  background-color: var(--red);
  border-color: var(--red);
  z-index: 0;
}
.filter-body-container .filter-placeholder {
  background: var(--light-gray2);
  min-height: 35px;
}
.filter-body-container .hover-link {
  display: block;
  padding-top: 5px;
}

/* src/assets/css/add-items.css */
.search-items {
  position: relative;
  width: 100%;
}
.search-items .mat-icon.input-add-icon {
  height: 18px;
  width: 18px;
  min-width: 18px;
  max-width: 18px;
  font-size: unset;
  position: absolute;
  left: 0;
  bottom: 11px;
  margin: 0 10px;
  cursor: pointer;
}
.search-items .mat-icon.input-add-icon.disabled {
  opacity: 0.1;
  pointer-events: none;
}
.product-search .search-items .mat-icon.input-add-icon.disabled {
  opacity: 1;
}
.product-search .mat-mdc-button.primary[disabled],
.mat-button[disabled][disabled] {
  background-color: var(--cool-green);
}
.search-items input.input-search {
  display: inline-block;
  padding: 0 32px;
  border: 1px solid var(--silver);
  background-color: var(--light-gray2);
  outline: none;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
  width: 100%;
  max-width: 100%;
  height: 40px;
  border-radius: 4px;
  box-shadow: inset 0px 1px 4px rgba(0, 0, 0, 0.0626698);
}
.search-items .input-search:focus,
.search-items .input-search.focused {
  border: 1px solid var(--cool-green);
}
.search-items .input-search.focused {
  background-color: var(--white);
}
.search-items .input-search-icon svg .stroke-here,
#searchIcon.input-search-icon svg .stroke-here {
  stroke: var(--white);
  fill: unset !important;
}
.search-items .input-search-icon.mat-button-disabled .mat-icon {
  pointer-events: unset;
  cursor: default;
}
.search-items .input-search-icon.mat-button-disabled svg .stroke-here {
  stroke: var(--medium-gray);
  fill: unset !important;
}
.search-items .input-add-icon svg g path {
  fill: var(--cool-green) !important;
}
.search-items.search-items-readonly .input-add-icon svg g path {
  fill: var(--medium-gray) !important;
}
.search-items .input-search-icon {
  position: absolute;
  right: 0px;
  top: 0;
  margin: 4px 4px 4px 0;
  color: var(--white);
  cursor: pointer;
  width: 32px;
  min-width: 25px !important;
  height: 32px;
  max-height: 32px;
  background-color: var(--cool-green) !important;
  border: unset !important;
  border-radius: 2px !important;
  box-shadow: unset !important;
}
.search-items .input-search-icon.mat-mdc-button > .mat-icon {
  margin-right: 0 !important;
}
.search-items::ng-deep mat-icon svg circle {
  stroke: white;
}
.search-items::ng-deep mat-icon svg rect {
  fill: white;
}
.search-items::ng-deep mat-icon.input-add-icon svg g path {
  fill: var(--cool-green);
}
.add-items .item-name {
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 13px;
  letter-spacing: 0;
}
.add-items .selected .item-name {
  color: var(--cool-green);
  text-decoration: underline;
}
.add-items .item-price {
  color: #1D2836;
  font-family: gilroy-medium;
  font-size: 16px;
  letter-spacing: 0;
}
.add-items .item-description {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 13px;
  height: unset;
  overflow: hidden;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  max-height: 52px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.image-container {
  min-width: 54px;
  max-width: 54px;
  height: 54px;
  width: 54px;
  text-align: center;
  max-height: 54px !important;
  max-width: 54px !important;
  align-content: center;
  align-items: center;
  justify-content: center;
  display: flex;
}
.image-container.large {
  min-width: 98px;
  max-width: 98px;
  height: 98px;
  width: 98px;
  max-height: 98px !important;
  max-width: 98px !important;
}
input.focused:focus {
  background-color: var(--white);
}

/* node_modules/@ng-select/ng-select/themes/default.theme.css */
.ng-select.ng-select-opened > .ng-select-container {
  background: #fff;
  border-color: hsl(0, 0%, 70%) #ccc hsl(0, 0%, 85%);
}
.ng-select.ng-select-opened > .ng-select-container:hover {
  box-shadow: none;
}
.ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  top: -2px;
  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #999;
  border-width: 0 5px 5px;
}
.ng-select.ng-select-opened > .ng-select-container .ng-arrow:hover {
  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #333;
}
.ng-select.ng-select-opened.ng-select-top > .ng-select-container {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.ng-select.ng-select-opened.ng-select-right > .ng-select-container {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.ng-select.ng-select-opened.ng-select-bottom > .ng-select-container {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.ng-select.ng-select-opened.ng-select-left > .ng-select-container {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.ng-select.ng-select-focused:not(.ng-select-opened) > .ng-select-container {
  border-color: #007eff;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 0 3px rgba(0, 126, 255, .1);
}
.ng-select.ng-select-disabled > .ng-select-container {
  background-color: #f9f9f9;
}
.ng-select .ng-has-value .ng-placeholder {
  display: none;
}
.ng-select .ng-select-container {
  color: #333;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #ccc;
  min-height: 36px;
  align-items: center;
}
.ng-select .ng-select-container:hover {
  box-shadow: 0 1px 0 rgba(0, 0, 0, .06);
}
.ng-select .ng-select-container .ng-value-container {
  align-items: center;
  padding-left: 10px;
}
[dir=rtl] .ng-select .ng-select-container .ng-value-container {
  padding-right: 10px;
  padding-left: 0;
}
.ng-select .ng-select-container .ng-value-container .ng-placeholder {
  color: #999;
}
.ng-select.ng-select-single .ng-select-container {
  height: 36px;
}
.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input {
  top: 5px;
  left: 0;
  padding-left: 10px;
  padding-right: 50px;
}
[dir=rtl] .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input {
  padding-right: 10px;
  padding-left: 50px;
}
.ng-select.ng-select-multiple.ng-select-disabled > .ng-select-container .ng-value-container .ng-value {
  background-color: #f9f9f9;
  border: 1px solid hsl(0, 0%, 90%);
}
.ng-select.ng-select-multiple.ng-select-disabled > .ng-select-container .ng-value-container .ng-value .ng-value-label {
  padding: 0 5px;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container {
  padding-top: 5px;
  padding-left: 7px;
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container {
  padding-right: 7px;
  padding-left: 0;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value {
  font-size: .9em;
  margin-bottom: 5px;
  color: #333;
  background-color: rgb(234.6, 244.68, 255);
  border-radius: 2px;
  margin-right: 5px;
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value {
  margin-right: 0;
  margin-left: 5px;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled {
  background-color: #f9f9f9;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label {
  padding-left: 5px;
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled .ng-value-label {
  padding-left: 0;
  padding-right: 5px;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label {
  display: inline-block;
  padding: 1px 5px;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon {
  display: inline-block;
  padding: 1px 5px;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover {
  background-color: rgb(209.1, 231.78, 255);
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left {
  border-right: 1px solid rgb(183.6, 218.88, 255);
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left {
  border-left: 1px solid rgb(183.6, 218.88, 255);
  border-right: none;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right {
  border-left: 1px solid rgb(183.6, 218.88, 255);
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right {
  border-left: 0;
  border-right: 1px solid rgb(183.6, 218.88, 255);
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input {
  padding: 0 0 3px 3px;
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input {
  padding: 0 3px 3px 0;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input > input {
  color: #000;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder {
  top: 5px;
  padding-bottom: 5px;
  padding-left: 3px;
}
[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder {
  padding-right: 3px;
  padding-left: 0;
}
.ng-select .ng-clear-wrapper {
  color: #999;
}
.ng-select .ng-clear-wrapper:hover .ng-clear {
  color: #d0021b;
}
.ng-select .ng-clear-wrapper:focus .ng-clear {
  color: #d0021b;
}
.ng-select .ng-clear-wrapper:focus {
  outline: none;
}
.ng-select .ng-spinner-zone {
  padding: 5px 5px 0 0;
}
[dir=rtl] .ng-select .ng-spinner-zone {
  padding: 5px 0 0 5px;
}
.ng-select .ng-arrow-wrapper {
  width: 25px;
  padding-right: 5px;
}
[dir=rtl] .ng-select .ng-arrow-wrapper {
  padding-left: 5px;
  padding-right: 0;
}
.ng-select .ng-arrow-wrapper:hover .ng-arrow {
  border-top-color: #666;
}
.ng-select .ng-arrow-wrapper .ng-arrow {
  border-color: #999 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
  border-style: solid;
  border-width: 5px 5px 2.5px;
}
.ng-dropdown-panel {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .06);
  left: 0;
}
.ng-dropdown-panel.ng-select-top {
  bottom: 100%;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  border-bottom-color: hsl(0, 0%, 90%);
  margin-bottom: -1px;
}
.ng-dropdown-panel.ng-select-top .ng-dropdown-panel-items .ng-option:first-child {
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
}
.ng-dropdown-panel.ng-select-right {
  left: 100%;
  top: 0;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-bottom-color: hsl(0, 0%, 90%);
  margin-bottom: -1px;
}
.ng-dropdown-panel.ng-select-right .ng-dropdown-panel-items .ng-option:first-child {
  border-top-right-radius: 4px;
}
.ng-dropdown-panel.ng-select-bottom {
  top: 100%;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-color: hsl(0, 0%, 90%);
  margin-top: -1px;
}
.ng-dropdown-panel.ng-select-bottom .ng-dropdown-panel-items .ng-option:last-child {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
.ng-dropdown-panel.ng-select-left {
  left: -100%;
  top: 0;
  border-top-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-bottom-color: hsl(0, 0%, 90%);
  margin-bottom: -1px;
}
.ng-dropdown-panel.ng-select-left .ng-dropdown-panel-items .ng-option:first-child {
  border-top-left-radius: 4px;
}
.ng-dropdown-panel .ng-dropdown-header {
  border-bottom: 1px solid #ccc;
  padding: 5px 7px;
}
.ng-dropdown-panel .ng-dropdown-footer {
  border-top: 1px solid #ccc;
  padding: 5px 7px;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup {
  -webkit-user-select: none;
  user-select: none;
  padding: 8px 10px;
  font-weight: 500;
  color: rgba(0, 0, 0, .54);
  cursor: pointer;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled {
  cursor: default;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked {
  background-color: rgb(244.8, 249.84, 255);
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected,
.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected.ng-option-marked {
  color: rgba(0, 0, 0, .54);
  background-color: rgb(234.6, 244.68, 255);
  font-weight: 600;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
  background-color: #fff;
  color: rgba(0, 0, 0, .87);
  padding: 8px 10px;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected,
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked {
  color: #333;
  background-color: rgb(234.6, 244.68, 255);
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected .ng-option-label,
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-marked .ng-option-label {
  font-weight: 600;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked {
  background-color: rgb(244.8, 249.84, 255);
  color: #333;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled {
  color: #ccc;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child {
  padding-left: 22px;
}
[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child {
  padding-right: 22px;
  padding-left: 0;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label {
  font-size: 80%;
  font-weight: 400;
  padding-right: 5px;
}
[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label {
  padding-left: 5px;
  padding-right: 0;
}
[dir=rtl] .ng-dropdown-panel {
  direction: rtl;
  text-align: right;
}

/* node_modules/@angular/cdk/overlay-prebuilt.css */
.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;
  display: flex;
  max-width: 100%;
  max-height: 100%;
  z-index: 1000;
}
.cdk-overlay-backdrop {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  pointer-events: auto;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  opacity: 0;
  touch-action: manipulation;
  z-index: 1000;
  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
@media (prefers-reduced-motion) {
  .cdk-overlay-backdrop {
    transition-duration: 1ms;
  }
}
.cdk-overlay-backdrop-showing {
  opacity: 1;
}
@media (forced-colors: active) {
  .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,
.cdk-high-contrast-active .cdk-overlay-transparent-backdrop {
  opacity: 0;
  visibility: visible;
}
.cdk-overlay-backdrop-noop-animation {
  transition: none;
}
.cdk-overlay-connected-position-bounding-box {
  position: absolute;
  display: flex;
  flex-direction: column;
  min-width: 1px;
  min-height: 1px;
  z-index: 1000;
}
.cdk-global-scrollblock {
  position: fixed;
  width: 100%;
  overflow-y: scroll;
}
.cdk-overlay-popover {
  background: none;
  border: none;
  padding: 0;
  outline: 0;
  overflow: visible;
  position: fixed;
  pointer-events: none;
  white-space: normal;
  color: inherit;
  text-decoration: none;
  width: 100%;
  height: 100%;
  inset: auto;
  top: 0;
  left: 0;
}
.cdk-overlay-popover::backdrop {
  display: none;
}
.cdk-overlay-popover .cdk-overlay-backdrop {
  position: fixed;
  z-index: auto;
}

/* node_modules/quill-mention/dist/quill.mention.css */
.ql-mention-list-container {
  width: 270px;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
  background-color: #ffffff;
  box-shadow: 0 2px 12px 0 rgba(30, 30, 30, 0.08);
  z-index: 9001;
  overflow: auto;
}
.ql-mention-loading {
  line-height: 44px;
  padding: 0 20px;
  vertical-align: middle;
  font-size: 16px;
}
.ql-mention-list {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.ql-mention-list-item {
  cursor: pointer;
  line-height: 44px;
  font-size: 16px;
  padding: 0 20px;
  vertical-align: middle;
}
.ql-mention-list-item.disabled {
  cursor: auto;
}
.ql-mention-list-item.selected {
  background-color: #d3e1eb;
  text-decoration: none;
}
.mention {
  height: 24px;
  width: 65px;
  border-radius: 6px;
  background-color: #d3e1eb;
  padding: 3px 0;
  margin-right: 2px;
  -webkit-user-select: all;
  user-select: all;
}
.mention > span {
  margin: 0 3px;
}

/* src/assets/css/bread-crumb.css */
ul#breadcrumb {
  list-style: none;
  display: inline-block;
  font-size: 12px;
  padding: 0;
  min-height: 26px;
}
#breadcrumb li {
  float: left;
  background-color: transparent;
  box-shadow: none;
  border-radius: 1.5px;
  margin: 0;
}
#breadcrumb li a {
  color: #5f6874;
  display: block;
  background: rgba(206, 208, 211, 0.25);
  text-decoration: none;
  position: relative;
  height: 28px;
  line-height: 28px !important;
  padding: 0 10px 0 5px;
  text-align: center;
  margin-right: 15px;
  font-size: 11px;
}
#breadcrumb li a.wizard-text-wrap {
  height: auto !important;
  line-height: unset !important;
}
#breadcrumb li a.selected {
  color: var(--green-blue) !important;
}
#breadcrumb li a div {
  width: auto;
}
#breadcrumb li:nth-child(even) a {
  background-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li:nth-child(even) a:before {
  border-color: rgba(206, 208, 211, 0.25);
  border-left-color: transparent;
}
#breadcrumb li:nth-child(even) a:after {
  border-left-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li:first-child a {
  padding-left: 15px;
  -moz-border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px 0 0 4px;
}
#breadcrumb li:first-child a:before {
  border: none;
}
#breadcrumb li:last-child a {
  padding-right: 15px;
  -moz-border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0;
  border-radius: 0 4px 4px 0;
}
#breadcrumb li:last-child a:after {
  border: none;
}
#breadcrumb li a:before,
#breadcrumb li a:after {
  content: "";
  position: absolute;
  top: 0;
  border: 0 solid rgba(206, 208, 211, 0.25);
  border-width: 14px 6px;
  width: 0;
  height: 0;
}
#breadcrumb li a:before {
  left: -12px;
  border-left-color: transparent;
}
#breadcrumb li a:after {
  left: 100%;
  border-color: transparent;
  border-left-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li a:hover {
  color: #00b575;
}
#breadcrumb li a:hover:before {
  border-color: rgba(206, 208, 211, 0.25);
  border-left-color: transparent;
}
#breadcrumb li a:hover:after {
  border-left-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li a div.parent-cat,
.min-w-40 {
  min-width: 40px !important;
}
#breadcrumb li a div.child-cat {
  min-width: 60px;
}
#breadcrumb li a div.subChild-cat {
  min-width: 80px;
}
#breadcrumb.breadcrumb-wizard li {
  pointer-events: none;
}
#breadcrumb.breadcrumb-wizard li a {
  height: 30px;
  line-height: 30px;
  font-size: 13px;
  color: var(--navy);
  margin-right: 16px;
  background-color: var(--light-gray2);
  border-radius: unset !important;
}
#breadcrumb.breadcrumb-wizard li a.elipse {
  z-index: 5;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  white-space: nowrap;
}
#breadcrumb.breadcrumb-wizard li a.completed {
  background-color: var(--green-blue2);
  color: var(--white) !important;
}
#breadcrumb.breadcrumb-wizard li:nth-child(even) a {
  background-color: var(--light-gray2);
}
#breadcrumb.breadcrumb-wizard li:nth-child(even) a.completed {
  background-color: var(--green-blue2);
}
#breadcrumb.breadcrumb-wizard li:last-child a {
  margin-right: 0;
}
#breadcrumb.breadcrumb-wizard li a:before {
  border-width: 15px 0px 15px 12px;
  border-color: var(--light-gray2) !important;
  border-left-color: transparent !important;
}
#breadcrumb.breadcrumb-wizard li a.completed:before {
  border-color: var(--green-blue2) !important;
  border-left-color: transparent !important;
}
#breadcrumb.breadcrumb-wizard li a:after {
  border-width: 15px 12px;
  border-left-color: var(--light-gray2) !important;
}
#breadcrumb.breadcrumb-wizard li a.completed:after {
  border-left-color: var(--green-blue2) !important;
}
app-import ul#breadcrumb {
  width: 100%;
  max-width: 100%;
}
#People-Import #breadcrumb.breadcrumb-wizard li a:before {
  border-bottom-width: 16px;
  max-height: 30px;
}
#People-Import #breadcrumb.breadcrumb-wizard li a:after {
  border-bottom-width: 16px;
  max-height: 30px;
}

/* src/assets/css/review-skeleton-loader.css */
.skeleton-loader-doughnut-chart {
  height: 150px;
  width: 97%;
  margin: 55px 0px 19px 0px;
  background-image:
    linear-gradient(
      100deg,
      rgba(255, 255, 255, 0),
      rgba(255, 255, 255, 0.5) 50%,
      rgba(255, 255, 255, 0) 80%),
    linear-gradient(#F3F3F4 26px, transparent 0),
    linear-gradient(#F3F3F4 26px, transparent 0),
    linear-gradient(#F3F3F4 26px, transparent 0);
  background-repeat: repeat-y;
  background-size:
    50px 200px,
    95% 200px,
    85% 200px,
    75% 200px;
  background-position:
    0 0,
    35.5px 0px,
    35.5px 40px,
    35.5px 80px;
  animation: shine3 1s infinite;
}
@keyframes shine3 {
  to {
    background-position:
      100% 0,
      35.5px 0px,
      35.5px 40px,
      35.5px 80px;
  }
}
.skeleton-loading {
  position: relative;
  overflow: hidden;
  background-color: #fff;
}
.skeleton-loading::before {
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 50%;
  z-index: 1;
  width: 500%;
  margin-left: -250%;
  -webkit-animation: loadingAnimation 0.9s linear infinite;
  animation: loadingAnimation 0.9s linear infinite;
  background:
    linear-gradient(
      110deg,
      rgba(255, 255, 255, 0) 46%,
      rgba(255, 255, 255, 0.35) 50%,
      rgba(255, 255, 255, 0) 54%) 50% 50%;
}
@-webkit-keyframes loadingAnimation {
  0% {
    transform: translate3d(-60%, 0, 0);
  }
  100% {
    transform: translate3d(60%, 0, 0);
  }
}
@keyframes loadingAnimation {
  0% {
    transform: translate3d(-60%, 0, 0);
  }
  100% {
    transform: translate3d(60%, 0, 0);
  }
}
.content-5p {
  height: 35px;
  margin: 15px 0 15px 18px;
  background-color: rgba(206, 208, 211, 0.25);
  border-radius: 2px;
  width: 16%;
}
.content-header {
  height: 51px;
  margin: 19px 0px 15px 18px;
  background-color: rgba(206, 208, 211, 0.25);
  border-radius: 2px;
  width: 96%;
}
.PTLtext {
  height: 16px;
  margin: 9px 0px 8px 18px;
  background-color: rgba(206, 208, 211, 0.25);
  border-radius: 2px;
}
.dropdown-loader {
  height: 32px;
  margin-right: 30px;
  background-color: rgba(206, 208, 211, 0.25);
  border-radius: 2px;
}
.width-100 {
  width: 100%;
}
.futurequote {
  height: 32px;
  margin: 20px 18px 20px;
  background-color: rgba(206, 208, 211, 0.25);
  border-radius: 2px;
}

/* src/assets/drawings/sipv-styles.css */
#WhiteboardWrapper {
  background-color: whitesmoke;
}
.sipv-svg {
  background: white;
  --cursor-default:default;
  --cursor-product:var(--cursor-default);
  --cursor-location:var(--cursor-default);
}
svg#sipv-svg {
  background: white;
  cursor: var(--cursor-default);
}
svg text {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-family: gilroy-regular;
  fill: #01162F;
}
svg text::selection {
  background: none;
}
.sipv-loc {
  cursor: var(--cursor-location);
  fill: transparent;
  text-anchor: start;
}
.sipv-loc text {
  stroke: none;
  -webkit-user-select: none;
  user-select: none;
  pointer-events: none;
}
.sipv-loc > path.outline {
  stroke: #01162F;
  stroke-width: 4px;
  stroke-linejoin: round;
}
.sipv-loc.show-all > path.outline {
  stroke-opacity: 0.2;
  fill: #1998D9;
  fill-opacity: 0.2;
}
g.sipv-loc:hover > path.outline {
  stroke-opacity: 1.0;
}
svg:matches(g[class~="sipv-selected"]) svg .sipv-background {
  fill: red;
}
.sipv-loc.sipv-mark-deleted > path.outline {
  stroke-opacity: 0.6;
}
.sipv-loc > path.bkgnd-outline {
  cursor: move;
  stroke: #FFFFFF;
  stroke-width: 20px;
  stroke-opacity: 0.0;
  stroke-linejoin: round;
  fill: none;
}
.sipv-rgn {
  fill: none;
  cursor: pointer;
}
.sipv-rgn > path.outline {
  pointer-events: stroke;
  stroke-width: 6px;
  stroke-opacity: 0.33;
  stroke-linecap: butt;
  stroke-dasharray: 18 3 6 3;
}
.sipv-rgn > path.bkgnd-outline {
  pointer-events: stroke;
  stroke: #FFFFFF;
  stroke-width: 20px;
  stroke-opacity: 0.0;
}
.sipv-hand-cursor {
  cursor: url(/cursors/hand-cursor.cur), auto;
}
.sipv-algn-rect-bkgnd {
  stroke: white;
  stroke-opacity: 0;
  stroke-width: 6px;
  fill: none;
}
.sipv-algn-rect {
  stroke: #1998D9;
  stroke-opacity: 0;
  stroke-width: 4px;
  fill: none;
}
.sipv-selected > .sipv-algn-rect,
.sipv-selected > .sipv-algn-rect-bkgnd {
  stroke-opacity: 0.9;
}
.sipv-path.sipv-selected .sipv-algn-rect,
.sipv-path.sipv-selected .sipv-algn-rect-bkgnd {
  fill: none;
  stroke-opacity: 0.1;
}
.sipv-selected.sipv-locked > .sipv-algn-rect {
  stroke: #FF0000;
}
.sipv-product {
  cursor: var(--cursor-product);
}
.sipv-path {
  cursor: move;
}
.sipv-cvg {
  cursor: move;
}
.sipv-path:hover rect[class*=sipv-algn-rect] {
  stroke-opacity: 0.2;
}
.sipv-loc:hover rect[class*=sipv-algn-rect],
.sipv-loc:hover path[class*=sipv-algn-rect],
.sipv-ink:hover rect[class*=sipv-algn-rect],
.sipv-product:hover rect[class*=sipv-algn-rect],
.sipv-to-marker:hover rect[class*=sipv-algn-rect],
.sipv-text:hover rect[class*=sipv-algn-rect] {
  stroke-opacity: 0.2;
  fill: #1998D9;
  fill-opacity: 0.2;
}
.sipv-path .text-label {
  visibility: hidden;
}
.sipv-path:hover .text-label,
.sipv-path.sipv-selected .text-label,
.sipv-path.page-scale-dimension-line .text-label,
.sipv-path.dimension-line .text-label {
  visibility: visible;
}
.sipv-layer[style*=hidden] .sipv-path .text-label {
  visibility: hidden;
}
g.sipv-loc.drag-over .outline {
  stroke-opacity: 0.2;
  fill: #1998D9;
  fill-opacity: 0.2;
}
g.sipv-loc.drag-over .bkgnd-outline {
  fill: #1998D9;
  fill-opacity: 0.01;
}
g .sipv-selected:hover rect[class*=sipv-algn-rect] {
  stroke-opacity: 0.9;
  fill-opacity: 0.2;
}
g.sipv-loc.sipv-selected .outline {
  stroke-opacity: 0.2;
  fill: #1998D9;
  fill-opacity: 0.2;
}
g.sipv-loc:hover .outline {
  fill: #1998D9;
  fill-opacity: 0.2;
  stroke-width: 6px;
}
g.sipv-loc:hover .sipv-algn-rect,
g.sipv-loc:hover .sipv-algn-rect-bkgnd {
  fill: none;
}
g.sipv-loc.sipv-selected .sipv-algn-rect,
g.sipv-loc.sipv-selected .sipv-algn-rect-bkgnd {
  fill: none;
}
g.sipv-loc.sipv-selected .bkgnd-outline {
  stroke-opacity: 0;
}
.sipv-bkgnd-ink {
  pointer-events: stroke;
  stroke: #FFFFFF;
  stroke-width: 20px;
  stroke-opacity: 0.0;
}
@keyframes selectedAnimation {
  from {
    stroke-dashoffset: 10;
  }
  to {
    stroke-dashoffset: 0;
  }
}
.sipv-handles {
  cursor: move;
}
.sipv-handle {
  stroke: black;
  stroke-width: 1;
  stroke-dasharray: 0;
  animation: none;
  fill-opacity: 1;
}
.sipv-rotate-path-circle {
  visibility: hidden;
}
.sipv-rotate-handle:hover {
  cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAAScgAAEnIBXmVb4wAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4yMfEgaZUAAACySURBVEhLtZCBDoQgDEP9/5/mIMdk1K7D3M7kaelalni11kL60z98dgo1jbHg1yXUHNjlbAnzIp7GLCMq42fIfoCS1wyby8x2gLAqGthBlkiCiOWRR+4WQUBhHdVdQoQUWY+alVCzEmpWskSX6l9GZL3va4ayMCPr3AEEgxFZfonDi33mpLPEDKuCn5u2c8R+cCUs4szwGQY3Sdk8NlNQM+Lt5QNqKv6+4C3UrISadbTrA9Hc8lRZl/SiAAAAAElFTkSuQmCC) 12 12, auto;
}
.sipv-rotate-handle:hover > .sipv-rotate-path-circle {
  visibility: visible;
}
.sictrls-div {
  width: 130px;
  height: 320px;
  position: absolute;
  right: 10px;
  bottom: 10px;
}
.sictrls-div.hidden {
  height: 0;
  width: 0;
}
.sictrls-svg {
  width: 100%;
  height: 320px;
  background: none;
}
.sictrls-ctrl-grp path {
  fill: lightgray;
}
.sictrls-ctrl-grp:hover path {
  fill: rgba(0, 0, 0, 0.3);
}
.sictrls-ctrl-rect {
  fill: floralwhite;
  stroke: gray;
  stroke-width: 0.5px;
}
.sictrls-ctrl-path {
  stroke: black;
  fill: none;
}

/* src/assets/drawings/tooltips.css */
.sipv-tip-box {
  display: flex;
  flex-direction: row;
  max-height: 80px;
  padding: 8px;
  border: 1px solid #E6E6E6;
  border-radius: 42.5px;
  background-color: #FFFFFF;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2);
}
.sipv-tip-div-image {
  display: flex;
  justify-content: center;
}
.sipv-tip-image {
  max-width: 60px;
  max-height: 60px;
  margin-right: 6px;
  align-self: center;
}
.sipv-tip-text {
  display: flex;
  flex-direction: column;
}
.sipv-tip-title {
  color: #000000;
  font-family: Gilroy, Roboto;
  font-size: 13px;
  font-weight: bold;
  line-height: 15px;
}
.sipv-tip-desc {
  margin-top: 6px;
  color: var(--medium-gray);
  font-family: Gilroy, Roboto;
  font-size: 12px;
  font-weight: 500;
  line-height: 14px;
  overflow-y: hidden;
}

/* src/assets/css/sass/meterial-bottom.nav.css */
ol,
p,
ul {
  margin-top: 1em;
  margin-bottom: 1em;
}
ol,
ul {
  padding-left: 20px;
}
strong {
  font-weight: 500;
}
.bottom-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Oxygen,
    Droid Sans,
    Ubuntu,
    Cantarell,
    Open Sans,
    Helvetica Neue,
    sans-serif;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, .2),
    0 8px 10px 1px rgba(0, 0, 0, .14),
    0 3px 14px 2px rgba(0, 0, 0, .12);
  border-top: 1px solid #e0e0e0;
  background-color: #fff;
  z-index: 1;
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}
.bottom-nav *,
.bottom-nav :after,
.bottom-nav :before {
  box-sizing: inherit;
}
@media print {
  .bottom-nav {
    display: none;
  }
}
.bottom-nav__destination {
  flex: 1 1 0;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 12px;
  padding-left: 12px;
  color: #757575;
  text-decoration: none;
}
.bottom-nav__destination:focus {
  outline: 0;
}
.bottom-nav__destination--active {
  color: #f44336;
}
.bottom-nav__icon {
  flex: 0 0 auto;
  display: block;
  width: 1em;
  height: 1em;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
}
.bottom-nav__icon path,
.bottom-nav__icon polygon,
.bottom-nav__icon rect {
  fill: currentColor;
}
.bottom-nav__icon circle {
  stroke: currentColor;
  stroke-width: 1;
}
.bottom-nav__label {
  flex: 0 0 auto;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 400;
}
.bottom-nav__badge,
.bottom-nav__label {
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}
.bottom-nav__badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: calc(50% + 6px);
  padding: 2px;
  min-width: 9px;
  min-height: 9px;
  font-size: 10px;
  font-weight: 500;
  color: #fff;
  background-color: #ff0a3b;
  border-radius: 9999px;
}
.bottom-nav__destination,
.bottom-nav__destination--active {
  padding-top: 8px;
  padding-bottom: 8px;
  min-width: 80px;
  max-width: 168px;
}
.bottom-nav__label {
  display: block;
}
.bottom-nav__badge {
  top: 6px;
}
.hidden-labels-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Oxygen,
    Droid Sans,
    Ubuntu,
    Cantarell,
    Open Sans,
    Helvetica Neue,
    sans-serif;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, .2),
    0 8px 10px 1px rgba(0, 0, 0, .14),
    0 3px 14px 2px rgba(0, 0, 0, .12);
  border-top: 1px solid #e0e0e0;
  background-color: #009688;
  z-index: 1;
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}
.hidden-labels-nav *,
.hidden-labels-nav :after,
.hidden-labels-nav :before {
  box-sizing: inherit;
}
@media print {
  .hidden-labels-nav {
    display: none;
  }
}
.hidden-labels-nav__destination {
  flex: 1 1 0;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 12px;
  padding-left: 12px;
  color: #e0e0e0;
  text-decoration: none;
}
.hidden-labels-nav__destination:focus {
  outline: 0;
}
.hidden-labels-nav__destination--active {
  color: #fff;
}
.hidden-labels-nav__icon {
  flex: 0 0 auto;
  display: block;
  width: 1em;
  height: 1em;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
}
.hidden-labels-nav__icon path,
.hidden-labels-nav__icon polygon,
.hidden-labels-nav__icon rect {
  fill: currentColor;
}
.hidden-labels-nav__icon circle {
  stroke: currentColor;
  stroke-width: 1;
}
.hidden-labels-nav__label {
  flex: 0 0 auto;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}
.hidden-labels-nav__badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: calc(50% + 6px);
  padding: 2px;
  min-width: 9px;
  min-height: 9px;
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  color: #fff;
  background-color: #ff0a3b;
  border-radius: 9999px;
}
.hidden-labels-nav__destination {
  padding-top: 16px;
  padding-bottom: 16px;
  min-width: 56px;
  max-width: 96px;
}
.hidden-labels-nav__destination--active {
  padding-top: 8px;
  padding-bottom: 8px;
  min-width: 80px;
  max-width: 168px;
}
.hidden-labels-nav__label {
  display: none;
}
.hidden-labels-nav__destination--active .hidden-labels-nav__label {
  display: block;
}
.hidden-labels-nav__badge {
  top: 14px;
}
.hidden-labels-nav__destination--active .hidden-labels-nav__label + .hidden-labels-nav__badge {
  top: 6px;
}
.badges-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Oxygen,
    Droid Sans,
    Ubuntu,
    Cantarell,
    Open Sans,
    Helvetica Neue,
    sans-serif;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, .2),
    0 8px 10px 1px rgba(0, 0, 0, .14),
    0 3px 14px 2px rgba(0, 0, 0, .12);
  border-top: 1px solid #e0e0e0;
  background-color: #fff;
  z-index: 1;
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}
.badges-nav *,
.badges-nav :after,
.badges-nav :before {
  box-sizing: inherit;
}
@media print {
  .badges-nav {
    display: none;
  }
}
.badges-nav__destination {
  flex: 1 1 0;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 12px;
  padding-left: 12px;
  color: #757575;
  text-decoration: none;
}
.badges-nav__destination:focus {
  outline: 0;
}
.badges-nav__destination--active,
.badges-nav__destination--active > .badges-nav__label {
  color: #00B575;
}
.badges-nav__destination--active mat-icon.dashboard g g {
  stroke: #00B575;
}
.badges-nav__icon {
  flex: 0 0 auto;
  display: block;
  width: 1em;
  height: 1em;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
}
.badges-nav__icon path,
.badges-nav__icon polygon,
.badges-nav__icon rect {
  fill: currentColor;
}
.badges-nav__icon circle {
  stroke: currentColor;
  stroke-width: 1;
}
.badges-nav__label {
  flex: 0 0 auto;
  margin-top: 5px;
  font-size: 12px;
  font-weight: 400;
}
.badges-nav__badge,
.badges-nav__label {
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}
.badges-nav__badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: calc(50% + 6px);
  padding: 2px;
  min-width: 9px;
  min-height: 9px;
  font-size: 10px;
  font-weight: 500;
  color: #fff;
  background-color: var(--red);
  border-radius: 9999px;
}
.badges-nav__destination {
  padding-top: 16px;
  padding-bottom: 16px;
  min-width: 56px;
}
.badges-nav__destination--active {
  padding-top: 8px;
  padding-bottom: 8px;
  min-width: 80px;
}
.badges-nav__label {
  display: block;
  color: #5F6874;
}
.badges-nav__badge {
  top: 14px;
}
.badges-nav__destination--active .badges-nav__label + .badges-nav__badge {
  top: 6px;
}
.horizontal-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Oxygen,
    Droid Sans,
    Ubuntu,
    Cantarell,
    Open Sans,
    Helvetica Neue,
    sans-serif;
  box-shadow:
    0 5px 5px -3px rgba(0, 0, 0, .2),
    0 8px 10px 1px rgba(0, 0, 0, .14),
    0 3px 14px 2px rgba(0, 0, 0, .12);
  border-top: 1px solid #e0e0e0;
  background-color: #6200ee;
  z-index: 1;
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}
.horizontal-nav *,
.horizontal-nav :after,
.horizontal-nav :before {
  box-sizing: inherit;
}
@media print {
  .horizontal-nav {
    display: none;
  }
}
.horizontal-nav__destination {
  flex: 1 1 0;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-right: 12px;
  padding-left: 12px;
  color: #bb86fc;
  text-decoration: none;
}
.horizontal-nav__destination:focus {
  outline: 0;
}
.horizontal-nav__destination--active {
  color: #fff;
}
.horizontal-nav__icon {
  flex: 0 0 auto;
  display: block;
  width: 1em;
  height: 1em;
  margin-left: auto;
  margin-right: auto;
  font-size: 24px;
}
.horizontal-nav__icon path,
.horizontal-nav__icon polygon,
.horizontal-nav__icon rect {
  fill: currentColor;
}
.horizontal-nav__icon circle {
  stroke: currentColor;
  stroke-width: 1;
}
.horizontal-nav__label {
  flex: 0 0 auto;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 400;
}
.horizontal-nav__badge,
.horizontal-nav__label {
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}
.horizontal-nav__badge {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: calc(50% + 6px);
  padding: 2px;
  min-width: 9px;
  min-height: 9px;
  font-size: 10px;
  font-weight: 500;
  color: #fff;
  background-color: #ff0a3b;
  border-radius: 9999px;
}
.horizontal-nav__destination,
.horizontal-nav__destination--active {
  padding-top: 8px;
  padding-bottom: 8px;
  min-width: 80px;
  max-width: 168px;
}
.horizontal-nav__label {
  display: block;
}
.horizontal-nav__badge {
  top: 6px;
}
@media (min-width: 512px) {
  .horizontal-nav__destination {
    flex-direction: row;
  }
  .horizontal-nav__destination,
  .horizontal-nav__destination--active {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .horizontal-nav__icon {
    margin-left: 0;
    margin-right: 0;
  }
  .horizontal-nav__label {
    margin-top: 2px;
    margin-left: 12px;
    margin-right: 12px;
  }
  .horizontal-nav__destination,
  .horizontal-nav__destination--active {
    min-width: 128px;
    max-width: 168px;
  }
  .horizontal-nav__label {
    display: block;
  }
  .horizontal-nav__badge {
    top: 6px;
  }
}

/* src/assets/css/bottom-sheet.css */
.mat-bottom-sheet-container.menu-sheet {
  box-sizing: border-box;
  border-radius: 10px;
  background-color: var(--white);
  box-shadow: 0 -1px 2px 0 rgba(177, 177, 177, 0.5);
  padding: 16px;
  margin: 0 16px 16px 16px;
  max-width: calc(768px - 32px);
  min-width: auto;
  width: auto;
}
.mat-bottom-sheet-container.menu-sheet .mat-mdc-list-base .mat-mdc-list-item,
.primary-line {
  cursor: pointer;
  color: #072548;
  font-family: gilroy-medium;
  font-size: 16px;
  font-weight: unset;
}
.mat-bottom-sheet-container.menu-sheet .mat-mdc-list-base {
  padding-top: unset;
}
.mat-bottom-sheet-container.menu-sheet .mat-mdc-list-base .mat-mdc-list-item.destructive .primary-line {
  color: var(--red);
}
.mat-bottom-sheet-container.menu-sheet .mat-nav-list .mat-mdc-list-item:hover {
  background-color: rgba(158, 158, 158, 0.2);
}
.mat-bottom-sheet-container.menu-sheet .mat-nav-list .mat-mdc-list-item.destructive:hover {
  background-color: #fbc6c6;
}
.mat-bottom-sheet-container.clock-in-menu {
  box-sizing: border-box;
  border-radius: 10px;
  background-color: var(--white);
  box-shadow: 0 -1px 2px 0 rgba(177, 177, 177, 0.5);
  padding: 16px;
  margin: 0 16px 16px 16px;
  max-width: calc(768px - 32px);
  min-width: auto;
  width: auto;
}
.installer-bottom-sheet .mat-bottom-sheet-container,
.installer-task-bottom-sheet .mat-bottom-sheet-container {
  box-sizing: border-box;
  border-radius: 20px 20px 0px 0px;
  background-color: var(--white);
  max-width: 768px;
  width: 768px;
  padding: 0 !important;
  font-size: 13px;
  color: var(--navy);
  font-weight: unset !important;
  box-shadow: unset;
  font-family: gilroy-medium;
  max-height: 80vh;
}
.scanner-bottom-sheet .mat-bottom-sheet-container {
  box-sizing: border-box;
  border-radius: 20px 20px 0px 0px;
  background-color: var(--white);
  max-width: 100%;
  min-width: 100%;
  padding: 0 !important;
  font-size: 15px;
  color: var(--navy);
  font-weight: unset !important;
  box-shadow: unset;
  font-family: gilroy-medium;
  min-height: 21vh;
  text-align: center;
}
.scanner-search-bottom-sheet .mat-bottom-sheet-container {
  box-sizing: border-box;
  border-radius: 20px 20px 0px 0px;
  background-color: var(--white);
  max-width: 100%;
  min-width: 100%;
  padding: 0 !important;
  font-size: 15px;
  color: var(--navy);
  font-weight: unset !important;
  box-shadow: unset;
  font-family: gilroy-medium;
  min-height: 12vh;
  text-align: center;
}
.scanner-add-warning-bottom-sheet .mat-bottom-sheet-container {
  box-sizing: border-box;
  border-radius: 20px 20px 0px 0px;
  background-color: var(--white);
  max-width: 100%;
  min-width: 100%;
  padding: 0 !important;
  font-size: 15px;
  color: var(--navy);
  font-weight: unset !important;
  box-shadow: unset;
  font-family: gilroy-medium;
  min-height: 18vh;
  text-align: center;
}
.serviceCall-bottom-sheet .mat-bottom-sheet-container {
  box-sizing: border-box;
  border-radius: 20px 20px 0px 0px;
  background-color: var(--white);
  max-width: 768px;
  width: 768px;
  padding: 0 !important;
  font-size: 13px;
  color: var(--navy);
  font-weight: unset !important;
  box-shadow: unset;
  font-family: gilroy-medium;
  max-height: 80vh;
  overflow: hidden;
}
.mat-bottom-sheet-container.proposal-bottom-sheet {
  overflow: hidden !important;
  max-height: unset !important;
}
.mat-bottom-sheet-container .proposal-wrapper {
  overflow: auto !important;
  max-height: 80vh !important;
  height: unset !important;
}
.mat-bottom-sheet-container .proposal-navigation-container {
  overflow: unset !important;
}
@media only screen and (max-width: 600px) {
  .mat-bottom-sheet-container.menu-sheet {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    min-width: calc(100vw - 32px);
  }
  .mat-bottom-sheet-container.clock-in-menu {
    width: calc(100vw - 32px);
    max-width: calc(100vw - 32px);
    min-width: calc(100vw - 32px);
  }
}
@media (min-width: 600px) and (max-width: 1280px) {
  .mat-bottom-sheet-container.menu-sheet {
    width: calc(768px - 32px);
    max-width: calc(768px - 32px);
    min-width: calc(768px - 32px);
  }
  .mat-bottom-sheet-container.clock-in-menu {
    width: calc(768px - 32px);
    max-width: calc(768px - 32px);
    min-width: calc(768px - 32px);
  }
}
@media (min-width: 1281px) {
  .mat-bottom-sheet-container.menu-sheet {
    width: calc(768px - 32px);
    max-width: calc(768px - 32px);
    min-width: calc(768px - 32px);
  }
  .mat-bottom-sheet-container.clock-in-menu {
    width: calc(768px - 32px);
    max-width: calc(768px - 32px);
    min-width: calc(768px - 32px);
  }
}

/* src/assets/css/icon.css */
.mat-mdc-button.primary[disabled] .mat-icon,
.mat-button.secondary[disabled] .mat-icon,
.mat-button.mat-secondary[disabled] .mat-icon,
.mat-button[disabled] .mat-icon {
  cursor: default !important;
}
.mat-icon {
  cursor: inherit;
  line-height: 1;
}
.mat-icon.icon-8 {
  min-height: 8px !important;
  min-width: 8px;
  max-height: 8px;
  max-width: 8px;
  line-height: 8px;
}
.mat-icon.icon-9 {
  min-height: 9px !important;
  min-width: 9px;
  max-height: 9px;
  max-width: 9px;
  line-height: 9px;
}
.mat-icon.icon-10,
.mat-secondary .mat-icon.icon-10 {
  min-height: 10px !important;
  min-width: 10px;
  max-height: 10px;
  max-width: 10px;
  line-height: 10px;
}
.mat-icon.icon-12 {
  min-height: 12px !important;
  min-width: 12px;
  max-height: 12px;
  max-width: 12px;
  line-height: 12px;
}
.mat-icon.icon-14 {
  min-height: 14px !important;
  min-width: 14px;
  max-height: 14px;
  max-width: 14px;
  line-height: 14px;
}
.mat-icon.icon-16 {
  min-height: 16px !important;
  min-width: 16px;
  max-height: 16px;
  max-width: 16px;
  line-height: 16px;
}
.mat-icon.icon-18,
.mat-icon.mat-icon-18,
.mat-icon.icon-18 svg {
  min-height: 18px !important;
  min-width: 18px;
  max-height: 18px;
  max-width: 18px;
  line-height: 18px;
}
.mat-icon.icon-20 {
  min-height: 20px !important;
  min-width: 20px;
  max-height: 20px;
  max-width: 20px;
  line-height: 20px;
}
.mat-icon.icon-21 {
  min-height: 21px;
  min-width: 21px;
  max-height: 21px;
  max-width: 21px;
}
.mat-icon.icon-22,
.mat-icon.icon-22 svg {
  min-height: 22px !important;
  min-width: 22px;
  max-height: 22px;
  max-width: 22px;
}
.mat-icon.icon-24 {
  min-height: 24px !important;
  min-width: 24px;
  max-height: 24px;
  max-width: 24px;
}
.mat-icon.icon-26 {
  min-height: 26px !important;
  min-width: 26px;
  max-height: 26px;
  max-width: 26px;
}
.mat-icon.icon-30 {
  min-height: 30px !important;
  min-width: 30px;
  max-height: 30px;
  max-width: 30px;
}
.mat-icon.icon-32 {
  min-height: 32px !important;
  min-width: 32px;
  max-height: 32px;
  max-width: 32px;
}
.mat-icon.icon-35 {
  min-height: 35px;
  min-width: 35px;
  max-height: 35px;
  max-width: 35px;
}
.mat-icon.icon-48 {
  min-height: 48px !important;
  min-width: 48px;
  max-height: 48px;
  max-width: 48px;
}
.mat-icon.icon-40 {
  min-height: 40px !important;
  min-width: 40px;
  max-height: 40px;
  max-width: 40px;
}
.mat-icon.icon-80 {
  min-height: 80px !important;
  min-width: 80px;
  max-height: 80px;
  max-width: 80px;
}
.mat-icon.icon-60,
.size-60 {
  min-height: 60px !important;
  min-width: 60px;
  max-height: 60px;
  max-width: 60px;
}
.size-70 {
  min-height: 70px !important;
  min-width: 70px;
  max-height: 70px;
  max-width: 70px;
}
.mat-icon.close-icon-blue g#Group {
  stroke: var(--blue);
}
.mat-icon.edit-auto-pay path {
  stroke: var(--cool-green);
}
.mat-icon.overlay-icon g:nth-of-type(1) {
  stroke: var(--cool-green);
}
.mat-icon.blue-color path {
  stroke: var(--blue);
}
.installer-nav-icon svg {
  width: 24px;
}
.inline-icon-button {
  line-height: 24px !important;
  height: 24px !important;
  width: 24px !important;
}
.icon-circle {
  border: 1px solid var(--gray1);
  border-radius: 50%;
  padding: 2px;
}
.mat-icon.icon-color,
.grey-color {
  color: var(--cool-grey);
}
.mat-icon.icon-50 {
  min-height: 50px;
  min-width: 50px;
  max-height: 50px;
  max-width: 50px;
}
.mat-icon.icon-75 {
  min-height: 75px;
  min-width: 75px;
  max-height: 75px;
  max-width: 75px;
}
.mat-icon.gray[svgIcon=editPencil2] path {
  fill: var(--medium-gray);
}
.close .mat-icon,
.close-btn .mat-icon {
  height: 16px;
  width: 16px;
}
.stepper .active mat-icon svg {
  color: var(--green-blue2);
  max-width: 10px;
}
.supplier-provided-locale-currency {
  color: var(--cool-green);
  transform: scale(1.2);
}
.supplier-provided-locale-currency.medium-gray {
  color: var(--medium-gray);
}
.catalog-black rect {
  stroke: var(--navy);
}
.catalog-black polygon {
  fill: black;
}
.mat-icon.icon-80 {
  min-height: 80px;
  min-width: 80px;
  max-height: 80px;
  max-width: 80px;
}
.mat-icon.icon-48 {
  min-height: 48px;
  min-width: 48px;
  max-height: 48px;
  max-width: 48px;
}
.mat-icon.icon-20-40 {
  min-height: 40px;
  max-height: 40px;
  min-width: 20px;
  max-width: 20px;
}
.clients-green svg g g g g g {
  stroke: var(--cool-green);
}
.clients-green svg g g g g g g {
  fill: var(--cool-green);
}
.clients-gray svg g g g g g {
  stroke: #979797;
}
.clients-gray svg g g g g g g {
  fill: #979797;
}
.contacts-gray svg g g g g {
  stroke: #979797;
}
.contacts-gray svg g g g g rect {
  stroke: #979797;
}
.contacts-green svg g g g g {
  stroke: var(--cool-green);
}
.contacts-green svg g g g g rect {
  stroke: var(--cool-green);
}
.add-gray svg g g path {
  fill: #979797;
}
.file-upload-gray svg g g g g g g g {
  stroke: var(--medium-gray);
}
.download-icon-red svg g g circle {
  stroke: var(--color-alert);
}
.download-icon-red svg g g path {
  fill: var(--color-alert);
}
.delete_activity-black svg #delete-activity rect {
  fill: #1D2836;
}
.delete_activity-black svg #delete-activity path {
  stroke: #1D2836;
}
.upload-icon-red svg path {
  fill: var(--color-alert);
}
.edit-pencil2-fill svg polygon {
  fill: #818C98;
}
.mat-icon.rotate-left {
  transform: rotate(-180deg);
}
.catlog-nav-section:hover .mat-icon.nav-green .fill-here {
  fill: var(--cool-green);
}
.mat-icon.white .stroke-here {
  stroke: var(--white);
}
.mat-icon.white .fill-here {
  fill: var(--white);
}
.mat-icon.blue .fill-here {
  fill: var(--blue);
}
.mat-icon.red .fill-here {
  fill: var(--color-alert);
}
.mat-icon.red .stroke-here {
  stroke: var(--color-alert);
}
.mat-icon.white .fill-here {
  fill: var(--white);
}
.mat-icon.white .stroke-here {
  stroke: var(--white);
}
.mat-icon.black .fill-here {
  fill: var(--color-text-primary);
}
.mat-icon.black .stroke-here {
  stroke: var(--color-text-primary);
}
.mat-icon.orange .fill-here {
  fill: var(--orange);
}
.mat-icon.orange .stroke-here {
  stroke: var(--orange);
}
.mat-icon.disabled-icon .fill-here,
.mat-icon.disabled-mode .fill-here {
  fill: var(--medium-gray);
}
.mat-icon.disabled-icon .stroke-here,
.mat-icon.disabled-mode .stroke-here {
  stroke: var(--medium-gray);
}
.mat-icon[svgicon=arrowDropDownIcon],
.mat-icon[data-mat-icon-name=arrowDropDownIcon],
.mat-icon[svgicon=arrowDropUp],
.mat-icon[data-mat-icon-name=arrowDropUp] {
  min-height: 12px !important;
  min-width: 12px;
  max-height: 12px;
  max-width: 12px;
  height: 9px !important;
  width: 8px !important;
  line-height: 9px !important;
}
.filter-option .mat-icon[svgicon=arrowDropDownIcon],
.filter-option .mat-icon[data-mat-icon-name=arrowDropDownIcon] {
  min-height: 12px;
  min-width: 12px;
  max-height: 12px;
  max-width: 12px;
  height: 12px !important;
  width: 12px !important;
  line-height: 12px !important;
}
.mat-icon[svgicon=dropDownArrowIcon],
.mat-icon[data-mat-icon-name=dropDownArrowIcon] {
  min-height: 8px;
  min-width: 12px;
  max-height: 8px;
  max-width: 12px;
  height: 8px !important;
  width: 12px !important;
  line-height: 8px !important;
}
.mat-icon[svgicon=dragIcon] {
  cursor: move;
}
.menu-right-icon.expand {
  transform: rotate(90deg);
  transition: .2s;
}
.mat-icon.light-gray2 .fill-here {
  fill: var(--light-gray2);
}
.mat-icon.cool-gray .stroke-here {
  stroke: var(--cool-grey) !important;
}
.mat-icon.neutral-500 .fill-here {
  fill: var(--color-neutral-500);
}
.mat-icon.neutral-500 .stroke-here {
  stroke: var(--color-neutral-500) !important;
}
.mat-icon.neutral-600 .fill-here {
  fill: var(--color-neutral-600);
}
.mat-icon.neutral-600 .stroke-here {
  stroke: var(--color-neutral-600) !important;
}
.mat-icon.neutral-400 .fill-here {
  fill: var(--color-neutral-400);
}
.mat-icon.neutral-400 .stroke-here {
  stroke: var(--color-neutral-400) !important;
}
.icon-lightbox-carousel svg {
  height: 40px !important;
  width: 40px !important;
}
@media (max-width: 599px) {
  .icon-lightbox-carousel svg {
    height: 20px !important;
    width: 20px !important;
  }
}
.main-nav .mat-icon .stroke-here,
.main-nav.link-expand .mat-icon .stroke-here {
  stroke-width: 1.25;
}
.main-nav.active .mat-icon .stroke-here,
.main-nav.link-expand .mat-icon .stroke-here {
  stroke-width: 1.5;
}
#settings-navigator .main-nav .mat-icon:hover .stroke-here {
  stroke-width: 1.5;
}
@keyframes recording-pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
.mat-icon.is-listening #mic-body {
  animation: recording-pulse 1.5s infinite alternate;
}
.location-outline-icon svg path {
  fill: var(--color-text-primary) !important;
}
.disabled-move-icon {
  cursor: default !important;
  opacity: 0.5 !important;
}
.mat-icon.disabled-icon {
  pointer-events: none;
}
.mat-icon[svgicon=addResources] {
  position: relative;
  z-index: 0;
}
.cursor-move,
.mat-icon.cursor-move {
  cursor: move;
}
.mat-mdc-form-field-icon-prefix > .mat-icon {
  padding: 0 !important;
}
.close:not(.no-transform) .mat-icon:hover {
  opacity: 1;
  transform: rotate(90deg);
  transition: all 0.1s;
}
.close:not(.no-transform) .mat-icon:hover .stroke-here {
  stroke: #1162ff;
}
.menu-tick .mat-icon {
  visibility: hidden;
}
.menu-tick.active .mat-icon {
  visibility: visible;
}
.nested-menu .mat-mdc-menu-item .mat-icon {
  margin-right: 8px;
}
.mat-icon.white .fill-here,
.statusBtn-orange .mat-icon .fill-here,
.statusBtn-blue .mat-icon .fill-here,
.statusBtn-green .mat-icon .fill-here,
.statusBtn-red .mat-icon .fill-here {
  fill: white !important;
}
.gray .mat-icon.auto-pay-stroke path {
  stroke: var(--gray1) !important;
}
.blue .mat-icon.auto-pay-stroke path {
  stroke: var(--blue) !important;
}
.mat-icon.adjustment-info path {
  stroke: var(--green-blue2) !important;
}
.mat-icon.sparkles-blue path {
  stroke: var(--blue) !important;
}
.mat-icon.blue-add-minus-icon path {
  stroke: #007acc !important;
}
.blue .mat-icon {
  stroke: #007acc !important;
}
.mat-icon.adjustment-info circle {
  stroke: var(--green-blue2) !important;
}
.orange .mat-icon.auto-pay-stroke path {
  stroke: var(--orange) !important;
}
.red .mat-icon.auto-pay-stroke path {
  stroke: var(--red) !important;
}
.green .mat-icon.auto-pay-stroke path {
  stroke: var(--cool-green) !important;
}
.gray .mat-icon.auto-pay-stroke-fill path {
  fill: var(--gray1) !important;
  stroke: var(--gray1) !important;
}
.blue .mat-icon.auto-pay-stroke-fill path {
  fill: var(--blue) !important;
  stroke: var(--blue) !important;
}
.orange .mat-icon.auto-pay-stroke-fill path {
  fill: var(--orange) !important;
  stroke: var(--orange) !important;
}
.red .mat-icon.auto-pay-stroke-fill path {
  fill: var(--red) !important;
  stroke: var(--red) !important;
}
.green .mat-icon.auto-pay-stroke-fill path {
  fill: var(--cool-green) !important;
  stroke: var(--cool-green) !important;
}
.mat-icon.subscription-field-user path {
  stroke: var(--cool-green) !important;
}
.mat-icon.library .fill-here {
  fill: var(--slate-grey) !important;
}
.mat-icon.gray .fill-here {
  fill: var(--slate-grey) !important;
}
.mat-icon.gray .fill-here {
  fill: var(--slate-grey) !important;
}
.mat-icon.green .icon-text {
  fill: var(--white) !important;
}
.mat-icon.white .icon-text {
  fill: var(--cool-green) !important;
}
.mat-icon.ta-white .fill-here {
  fill: var(--white) !important;
}
.mat-icon.ta-white {
  stroke: var(--cool-green) !important;
}
.mat-icon.ta-white .icon-text {
  fill: var(--cool-green) !important;
}
.mat-icon .light-Grey {
  stroke: var(--color-divider) !important;
}
.mat-icon.white.stroke-border {
  stroke: var(--cool-green) !important;
}
.mat-icon.gray1 .fill-here {
  fill: var(--gray1) !important;
}
.mat-icon.black .fill-here {
  fill: var(--black) !important;
}
.mat-icon.green .fill-here {
  fill: var(--cool-green) !important;
}
.mat-icon.white .fill-here {
  fill: var(--white) !important;
}
.mat-icon.blue .fill-here {
  fill: var(--blue) !important;
}
.mat-icon.black .stroke-here {
  stroke: var(--black) !important;
}
.mat-icon.black .fill-here {
  fill: var(--black) !important;
}
.mat-icon.cool-gray .stroke-here {
  stroke: var(--cool-grey) !important;
}
.mat-icon.stroke-width2 .stroke-width2 {
  stroke-width: 2.5 !important;
}
.mat-icon.stroke-width3 .stroke-width3 {
  stroke-width: 3 !important;
}
.mat-icon.gray1 .stroke-here {
  stroke: var(--gray1) !important;
}
.mat-icon.gray .stroke-here {
  stroke: var(--slate-grey) !important;
}
.mat-icon.navy .stroke-here {
  stroke: var(--navy) !important;
}
.mat-icon.navy .fill-here {
  fill: var(--navy) !important;
}
.mat-icon.medium-gray .fill-here {
  fill: var(--medium-gray) !important;
}
.mat-icon.medium-gray .stroke-here {
  stroke: var(--medium-gray) !important;
}
.mat-icon.green .stroke-here {
  stroke: var(--cool-green) !important;
}
.mat-icon.white .stroke-here {
  stroke: var(--white) !important;
}
.mat-icon.blue .stroke-here {
  stroke: var(--blue) !important;
}
.mat-icon.slate-grey .stroke-here {
  stroke: var(--slate-grey) !important;
}
.red-warning.mat-icon .red-warning-fill-here {
  fill: var(--red);
}
.mat-mdc-menu-trigger.mat-mdc-button > .mat-icon {
  font-size: inherit !important;
  margin-right: 0 !important;
}
.mat-mdc-menu-trigger.mat-mdc-icon-button.mat-mdc-button-base:not(.mat-icon-btn-default) {
  width: 28px;
  height: 15px;
  line-height: 15px;
  padding: 0;
  display: inherit;
}
.mat-mdc-menu-trigger.mat-mdc-icon-button.mat-mdc-button-base mat-icon[svgicon=moreHorzIcon],
.mat-mdc-menu-trigger.mat-mdc-icon-button.mat-mdc-button-base mat-icon[svgicon=moreHorzIcon] svg {
  min-height: 15px;
  min-width: 18px;
  max-height: 15px;
  max-width: 18px;
  line-height: 15px;
  display: unset;
}
#dtCloudApp .mat-mdc-button > .mat-icon {
  height: 16px;
  width: 16px;
  margin-right: 8px;
}
#dtCloudApp .drawing-options .mat-mdc-button > .mat-icon {
  margin-right: 3px;
}
#dtCloudApp .mat-mdc-button > .mat-icon.apply-margin-right {
  margin-right: 8px !important;
}
.mat-mdc-button.primary.primary-icon-button .mat-icon[svgicon=addIcon] {
  margin-left: 12px;
  height: 16px;
  width: 16px;
  opacity: 1 !important;
}
.mat-mdc-button.primary[disabled] mat-icon svg path,
.mat-button[disabled][disabled] mat-icon svg path {
  fill: var(--medium-gray) !important;
}
.mat-mdc-button.primary mat-icon.camera-icon svg path,
.mat-button mat-icon.camera-icon svg path {
  fill: white !important;
}
#locationDetails .mat-mdc-button.primary[disabled] mat-icon svg path:last-child,
#locationDetails .mat-button[disabled][disabled] mat-icon svg path:last-child {
  fill: none !important;
}
button.mat-mdc-button.icon-button .mat-icon {
  margin-right: 8px;
  height: 12px;
  width: 12px;
}
#dtCloudApp .mat-mdc-button.btn-with-more-btn .mat-icon {
  height: 8px;
  width: 8px;
  line-height: 8px;
}
.btn-with-more-btn .mat-icon svg {
  height: 100%;
  width: 100%;
}
.btn-with-more-btn.secondary .mat-icon svg #Triangle-Arrow-Drop-Down-White {
  fill: var(--navy);
}
.close-btn .mat-icon:hover {
  opacity: 1;
  transform: rotate(90deg);
  transition: all 0.1s;
}
.close-btn .mat-icon:hover .stroke-here {
  stroke: #1162ff;
}
.mat-secondary .mat-icon polygon#Triangle {
  fill: black;
}
.mat-icon.green-arrow polygon#Triangle,
.colored-content.Green .mat-icon polygon#Triangle,
.colored-content.Green .mat-icon {
  fill: #59cedf;
}
.mat-icon.pink-arrow polygon#Triangle {
  fill: #ee5d8c;
}
.mat-icon.black-arrow polygon#Triangle {
  fill: #000000;
}
.mat-icon.green-icon {
  fill: var(--green-blue);
}
.mat-icon.blue1-arrow polygon#Triangle {
  fill: var(--blue1);
}
.mat-icon.blue2-arrow polygon#Triangle {
  fill: var(--blue2);
}
.mat-icon.blue3-arrow polygon#Triangle {
  fill: var(--blue3);
}
.mat-icon.gray1-arrow polygon#Triangle {
  fill: var(--gray1);
}
.mat-icon.gray2-arrow polygon#Triangle {
  fill: var(--gray2);
}
.mat-icon.gray3-arrow polygon#Triangle {
  fill: var(--gray3);
}
.mat-icon.green1-arrow polygon#Triangle {
  fill: var(--green1);
}
.mat-icon.green2-arrow polygon#Triangle {
  fill: var(--cool-green);
}
.mat-icon.green3-arrow polygon#Triangle {
  fill: var(--green3);
}
.mat-icon.orange1-arrow polygon#Triangle {
  fill: var(--orange1);
}
.mat-icon.orange2-arrow polygon#Triangle {
  fill: var(--orange2);
}
.mat-icon.orange3-arrow polygon#Triangle {
  fill: var(--orange3);
}
.mat-icon.purple1-arrow polygon#Triangle {
  fill: var(--purple1);
}
.mat-icon.purple2-arrow polygon#Triangle {
  fill: var(--purple2);
}
.mat-icon.purple3-arrow polygon#Triangle {
  fill: var(--purple3);
}
.mat-icon.red1-arrow polygon#Triangle {
  fill: var(--red1);
}
.mat-icon.red2-arrow polygon#Triangle {
  fill: var(--red);
}
.mat-icon.yellow-arrow polygon#Triangle {
  fill: var(--yellow);
}
.mat-icon.blue-arrow polygon#Triangle,
.mat-icon.blue-arrow,
.colored-content.Blue .mat-icon polygon#Triangle,
.colored-content.Blue .mat-icon {
  fill: var(--blue);
}
.mat-icon.yellow-arrow polygon#Triangle,
.mat-icon.Yellow-arrow polygon#Triangle,
.mat-icon.yellow-arrow,
.colored-content.Yellow .mat-icon polygon#Triangle,
.colored-content.Yellow .mat-icon {
  fill: #ffbf00;
}
.mat-icon.Green-arrow polygon#Triangle,
.colored-content.Green .mat-icon polygon#Triangle,
.colored-content.Green .mat-icon {
  fill: var(--cool-green);
}
.mat-icon.Blue-arrow polygon#Triangle,
.colored-content.Blue .mat-icon polygon#Triangle,
.colored-content.Blue .mat-icon {
  fill: var(--blue);
}
.mat-icon.Red-arrow polygon#Triangle,
.colored-content.Red .mat-icon polygon#Triangle,
.colored-content.Red .mat-icon {
  fill: var(--red);
}
.mat-icon.Orange-arrow polygon#Triangle,
.colored-content.Orange .mat-icon polygon#Triangle,
.colored-content.Orange .mat-icon {
  fill: #fb8030;
}
.mat-icon.Gray-arrow polygon#Triangle,
.colored-content.Gray .mat-icon polygon#Triangle,
.colored-content.Gray .mat-icon {
  fill: #a3a6aa;
}
.mat-icon.plan-checked polygon#Triangle {
  fill: #d8d8d8;
}
button:hover mat-icon:not(.cursor-default),
a:hover mat-icon:not(.cursor-default),
[role=button]:hover mat-icon:not(.cursor-default),
.mat-icon-button:hover mat-icon:not(.cursor-default),
.mat-mdc-icon-button:hover mat-icon:not(.cursor-default),
.low-opacity {
  opacity: 0.47;
}
.client-info-form mat-icon:hover {
  opacity: unset !important;
}
.mat-secondary .mat-icon {
  height: 15px;
  width: 10px;
}
.mat-icon.view-card-disabled svg path,
.mat-icon.view-list-disabled svg path {
  opacity: 0.400000006;
}
.mat-icon.green-blue svg path {
  fill: var(--green-blue);
}
.mat-icon.white-icon svg path {
  fill: white;
}
.mat-icon.input-add-icon svg g path {
  fill: var(--medium-gray);
}
.mat-icon.green-input-add-icon svg g path {
  fill: var(--cool-green) !important;
}
.navigation-text .mat-icon {
  min-width: 16px;
}
.status-kanban .Orange .kanban-stage-sub-title mat-icon path,
.status-kanban .Blue .kanban-stage-sub-title mat-icon path,
.status-kanban .Green .kanban-stage-sub-title mat-icon path,
.status-kanban .Red .kanban-stage-sub-title mat-icon path {
  stroke: var(--white);
}
.status-kanban .Yellow .kanban-stage-sub-title mat-icon path,
.status-kanban .Grey .kanban-stage-sub-title mat-icon path,
.status-kanban .Gray .kanban-stage-sub-title mat-icon path {
  stroke: var(--navy);
}
.status-kanban .Orange .add-and-sort-icon mat-icon path,
.status-kanban .Blue .add-and-sort-icon mat-icon path,
.status-kanban .Green .add-and-sort-icon mat-icon path,
.status-kanban .Red .add-and-sort-icon mat-icon path {
  fill: var(--white);
}
.status-kanban .Yellow .add-and-sort-icon mat-icon path,
.status-kanban .Grey .add-and-sort-icon mat-icon path,
.status-kanban .Gray .add-and-sort-icon mat-icon path {
  fill: var(--navy);
}
.status-kanban .Orange mat-icon[svgicon=addIcon2] path,
.status-kanban .Blue mat-icon[svgicon=addIcon2] path,
.status-kanban .Green mat-icon[svgicon=addIcon2] path,
.status-kanban .Red mat-icon[svgicon=addIcon2] path {
  stroke: var(--white);
}
.status-kanban .Yellow mat-icon[svgicon=addIcon2] path,
.status-kanban .Grey mat-icon[svgicon=addIcon2] path,
.status-kanban .Gray mat-icon[svgicon=addIcon2] path {
  stroke: var(--navy);
}
.opportunity-client .mat-icon.icon-medium-gray {
  color: var(--navy) !important;
}
.detail-view mat-icon svg #Symbols {
  fill: var(--gray1);
}
.detail-view mat-icon svg #Shape1 {
  display: none;
}
.mat-icon.icon-medium-gray {
  color: var(--medium-gray);
}
mat-icon.mat-18 {
  min-width: 18px;
  width: 18px;
  height: 18px;
  min-height: 18px;
}
app-upload-file.attachments-content.floorplan .img-upload mat-icon.no-image svg path {
  fill: #7a8592 !important;
}
.filter-toggler-mobile-drawings .mat-icon {
  transform: rotate(180deg);
  margin-top: 24px;
  margin-left: 3px;
}
.drawing-options .mat-icon.coverage-icon svg path {
  fill: transparent !important;
}
.drawing .click-add .mat-icon svg path {
  fill: var(--blue) !important;
}
.drawing-card .hover-position span mat-icon svg path {
  fill: var(--white);
}
.drawing-options .drag-handle .mat-icon svg path {
  fill: var(--medium-gray) !important;
}
.drawing-options .mat-mdc-button.active .mat-icon svg path,
.menu-options-draw mat-menu-item.active .mat-icon svg path {
}
.menu-options-draw .mat-mdc-menu-item.active .mat-icon.eraser-icon svg path,
.menu-options-draw .mat-mdc-menu-item:hover .mat-icon.eraser-icon svg path,
.menu-options-draw .mat-mdc-menu-item.active .mat-icon.eraser-icon svg g line {
  stroke: var(--green-blue) !important;
  fill: none !important;
}
.drawing-options .mat-mdc-button.active .mat-icon.eraser-icon svg path,
.drawing-options .mat-mdc-button.active .mat-icon.edit-loc-icon svg path,
.drawing-options .mat-button:hover .mat-icon.eraser-icon svg path,
.drawing-options .mat-button.active .mat-icon.eraser-icon svg g line {
  stroke: var(--green-blue) !important;
  fill: none !important;
}
.drawing-options .mat-mdc-button.active .mat-icon.edit-pen-icon svg polygon,
.drawing-options .mat-icon.edit-pen-icon:hover svg polygon,
.drawing-options .mat-icon:hover svg path,
.drawing-pallete .mat-button.active .mat-icon svg path,
.drawing-options .mat-icon.attachment-btn:hover svg polygon {
  stroke: var(--green-blue) !important;
}
.drawing-options .mat-icon.eraser-icon svg path,
.drawing-options .mat-mdc-button.active .mat-icon.eraser-icon:hover svg path,
.drawing-options .mat-icon.eraser-icon svg g line,
.drawing-options .mat-button.active .mat-icon.eraser-icon:hover svg g line {
  fill: var(--white) !important;
  stroke: var(--medium-gray) !important;
}
.menu-options-draw .mat-mdc-menu-item.active .mat-icon.edit-pen-icon svg polygon,
.menu-options-draw .mat-icon.edit-pen-icon:hover svg polygon,
.menu-options-draw .mat-icon:hover svg path,
.menu-options-draw .mat-icon.attachment-btn:hover svg polygon {
  fill: var(--green-blue) !important;
}
.menu-options-draw .mat-icon.eraser-icon svg path,
.menu-options-draw .mat-mdc-menu-item.active .mat-icon.eraser-icon:hover svg path,
.menu-options-draw .mat-icon.eraser-icon svg g line,
.menu-options-draw .mat-mdc-menu-item.active .mat-icon.eraser-icon:hover svg g line {
  fill: var(--white) !important;
  stroke: var(--medium-gray) !important;
}
#whiteboardComment .mat-icon.icon-more {
  position: absolute;
  right: 16px;
  top: -4px;
}
.drawing .btn-close .mat-icon {
  margin-left: -6px;
  margin-top: -12px;
}
.drawing .btn-close-details .mat-icon {
  margin-left: -8px !important;
  margin-top: -2px !important;
}
.drawing .btn-close-details .mat-icon.m-0-i {
  margin-left: 0 !important;
  margin-top: 0 !important;
}
.drawing .btn-close-details .mat-icon svg path {
  stroke: var(--white);
}
.drawing .content-visible .btn-close-details .mat-icon svg path {
  stroke: var(--black);
}
.image-count .mat-icon {
  margin-top: -2px;
  margin-left: 4px;
}
.drawing .btn-menu-location .mat-icon {
  vertical-align: middle;
}
.file-whiteboard .drawing .btn-close .mat-icon svg path,
.file-whiteboard .drawing .btn-close .mat-icon svg polyline {
}
.file-whiteboard .header .mat-mdc-button.active .mat-icon svg path {
  fill: var(--white);
}
.file-whiteboard .header .mat-mdc-button.active .mat-icon.edit-pencil svg polygon {
  stroke: var(--white) !important;
}
.file-whiteboard .header .mat-icon.add-icon {
  position: absolute;
  top: 6px;
  left: 23px;
}
.file-whiteboard .header .mat-icon.add-product-icon svg path {
  fill: #1f2a36 !important;
}
.drawing-l-details .count-text .mat-icon {
  vertical-align: top;
}
.drawing-l-details .mat-mdc-button .mat-icon.add-icon svg path {
  fill: var(--black);
}
.drawing-l-details .btn-image .mat-icon svg:first-child {
  fill: var(--white) !important;
}
.drawing .search-items.wirepath #addBlueIcon.mat-icon svg path {
  fill: var(--blue) !important;
}
.drawing .mat-icon.icon-22 {
  min-height: 22px !important;
  min-width: 22px !important;
  max-height: 22px !important;
  max-width: 22px !important;
}
.mat-icon.icon-51 {
  min-height: 18px;
  min-width: 18px;
  max-height: 18px;
  max-width: 18px;
  line-height: 14px;
}
.mat-icon.icon-52 {
  min-height: 120px;
  min-width: 200px;
  max-height: 120px;
  max-width: 200px;
  line-height: 14px;
}
.mat-icon.icon-53 {
  min-height: 18px;
  min-width: 18px;
  max-height: 18px;
  max-width: 18px;
  line-height: 14px;
}
.mat-icon.icon-54 {
  min-height: 25px;
  min-width: 25px;
  max-height: 25px;
  max-width: 25px;
  line-height: 18px;
}
.drawing #productMinimizedView .mat-mdc-button .mat-icon {
  margin-left: -6px;
  margin-top: -2px;
}
.drawing .inline-btn .mat-mdc-button .mat-icon {
  height: 34px;
  min-height: 34px;
}
.drawing-close .mat-icon {
  transform: rotate(180deg);
}
.report-filters .menu-button:hover .mat-icon.arrow-icon svg g polygon.fill-here,
.report-filters .menu-button.active .mat-icon.arrow-icon svg g polygon.fill-here,
.filter-panel.active .mat-icon.arrow-icon svg g polygon.fill-here,
.filter-panel:hover .mat-icon.arrow-icon svg g polygon.fill-here {
  fill: var(--green-blue) !important;
}
.report-filters .menu-button.active .mat-icon.arrow-icon {
  transform: rotate(180deg);
  margin-top: 7px;
}
.report-filters.client .menu-button.active .mat-icon.arrow-icon {
  transform: rotate(180deg);
  margin-top: 6px !important;
}
.preview-heading > mat-icon,
mat-icon.box-shape {
  position: absolute;
  left: 10px;
  min-height: 14px;
  min-width: 14px;
  height: 14px;
  width: 14px;
  background-color: white;
  padding: 7px;
  box-sizing: content-box;
  border: 1px solid var(--silver);
  border-radius: 3px;
  line-height: 0;
}
mat-icon.box-shape svg {
  height: 12px !important;
}
mat-icon.left-arrow {
  transform: rotate(180deg);
}
mat-icon[svgIcon=chevronRightIcon].green polyline {
  stroke: var(--cool-green);
}
mat-icon[svgIcon=chevronRightIcon].white polyline {
  stroke: var(--white);
}
mat-icon[svgIcon=chevronRightIcon].workSummary polyline {
  stroke: var(--black);
}
mat-icon.box-shape {
  position: relative;
  margin-left: 10px;
}
#paymentTermForm .mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon,
#paymentTermForm .mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-mdc-icon-button .mat-icon,
#paymentTermForm .mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon-button .mat-icon {
  line-height: 27px;
  height: 27px !important;
  width: 16px !important;
}
@media (max-width: 599px) {
  .mat-mdc-button.primary.primary-icon-button.hide-text-xs .mat-icon {
    margin-right: 0;
  }
}
.datepicker-prefix-icon.mat-mdc-icon-button-height-26px .mat-icon-button {
  height: 26px;
  line-height: 26px;
}
.task-date-pick .mat-mdc-icon-button,
.mat-icon-button.size-22 {
  width: 22px;
  height: 22px;
  line-height: 22px;
}
.mat-icon.edit-activity-white svg g g {
  stroke: var(--white);
}
mat-icon.down-arrow.move-down polygon {
  fill: rgb(13, 187, 125);
}
.mat-icon.more-horz-icon-white svg g g path {
  fill: var(--white) !important;
}
.banner-info-container.banner-proposal .mat-icon svg circle {
  stroke: var(--green-blue) !important;
}
#app-navigator mat-list-item.active mat-icon #PPE-Tasks-24px path#Path,
#app-navigator mat-list-item.active mat-icon #PPE-Tasks-24px polyline,
#app-navigator mat-list-item.active mat-icon g#PPE-Schedule-24px g rect {
  stroke: var(--white);
}
#app-navigator mat-list-item mat-icon g#PPE-Schedule-24px g rect,
#app-navigator mat-list-item mat-icon #PPE-Tasks-24px path#Path,
#app-navigator mat-list-item mat-icon #PPE-Tasks-24px polyline {
  stroke: rgb(151, 151, 151);
}
mat-icon.fill-service-plan-list .fill-here {
  fill: var(--gray1);
}
mat-icon.service-plan-addIcon .fill-here {
  fill: var(--medium-gray);
}
.expand-collapse-container .mat-icon {
  min-height: 12px;
  min-width: 12px;
  max-height: 12px;
  max-width: 12px;
}
.expand-collapse-container .mat-icon.expand {
  transform: rotate(-90deg);
}
.expand-collapse-container .mat-icon.collapse {
  transform: rotate(90deg);
}
mat-icon.bell-wiggle .stroke-here {
  animation: ring 8s ease-in-out 2s 4 none running;
  transform-origin: 50% 4px;
}
.input-mat-suffix .mat-mdc-form-field-icon-suffix > .mat-icon {
  padding: 12px 8px;
}
.plan-feature .mat-icon {
  cursor: default;
}
.est-selected-date .mat-icon {
  visibility: hidden;
}
.est-selected-date:hover .mat-icon {
  cursor: pointer;
  visibility: visible;
}
#dtCloudApp .quantity-dropdown mat-icon {
  margin-left: 24px;
}
.nav-links mat-icon.fill-here[ng-reflect-svg-icon=plan] svg {
  fill: white;
  stroke: white;
}
.drawing .filter-toggler mat-icon svg path {
  fill: var(--white);
}
.drawing .filter-toggler mat-icon svg polyline {
  stroke: var(--white);
}
.item-status-container .grid-menu-container .mat-icon {
  margin-top: -7px;
}
#nav-subscription:hover mat-icon .fill-here {
  fill: none;
  stroke: var(--cool-green);
}
#nav-custom-field:hover mat-icon .fill-here {
  fill: none;
  stroke: var(--cool-green);
}
mat-icon.white .fill-here.subscription {
  stroke: var(--white) !important;
  fill: none !important;
}
.report .sales-leaderboard .icon-expand mat-icon {
  transform: rotate(270deg);
}
.report .sales-leaderboard .icon-expand mat-icon.expanded {
  transform: rotate(360deg);
}
mat-icon.job-cost-hour-icon .stroke-here {
  stroke: var(--navy);
}
mat-icon.inventory-item-search .stroke-here {
  stroke: var(--blue);
}
#dtCloudApp .base-layout-wrapper .more-menu mat-icon.project-moreHorz svg path {
  fill: var(--color-text-primary);
}
.mat-icon-copy path {
  stroke: #6F7782 !important;
}
.mat-icon.signal-gray svg path,
.mat-icon.signal-gray svg circle {
  stroke: var(--gray1) !important;
}
.header-opp-proj-icon path.stroke-here {
  stroke: var(--color-text-primary) !important;
}
.payment-request-add-icon .fill-here {
  fill: var(--cool-green);
}
.payment-request-add-icon.disabled-mode .fill-here {
  fill: var(--medium-gray);
}
.nav-links .stroke-here {
  stroke: var(--white);
}
.reload-icon-drawing svg path.fill-here {
  fill: #6f7782 !important;
}
#nav-subscription.active .fill-here {
  fill: none;
  stroke: var(--cool-green);
}
#nav-custom-field.active .fill-here {
  fill: none;
  stroke: var(--cool-green);
}
.service-icon .stroke-here {
  stroke: var(--navy);
}
.plan-list-monitoring .stroke-here {
  stroke: var(--gray1);
}
.subscription-dropdown-icon .fill-here {
  fill: var(--red);
}
.reminder-msg-container .mat-icon .fill-here {
  fill: var(--cool-green) !important;
}
.reminder-msg-container .mat-icon .stroke-here {
  stroke: var(--cool-green) !important;
}
.mat-icon.gradient-mic .stroke-here {
  stroke: url(#gradient-mic) !important;
}
.mat-icon.gradient-history .stroke-here {
  stroke: url(#gradient-history) !important;
}
.mat-icon.gradient-catalog .stroke-here {
  stroke: url(#gradient-catalog) !important;
}
.mat-icon.gradient-book-open .stroke-here {
  stroke: url(#gradient-book-open) !important;
}
#connectionViews .view-button:hover .mat-icon svg path,
.view-option:hover .mat-icon svg path {
  stroke: var(--green-blue) !important;
}
.appsidenav-collapsed #app-navigator .mat-icon svg {
  min-height: 16px;
  min-width: 16px;
  max-width: 16px;
  max-height: 16px;
}

/* src/assets/css/schedule.css */
:root {
  --columns: 7;
  --progress-bar-value: 0;
}
.schedule-overflow-container {
  max-height: calc(100vh - 130px);
  overflow: auto;
  margin: 20px 20px 0 20px;
  height: 100dvh;
}
.week-day {
  min-width: 140px;
  width: 140px;
  cursor: pointer;
  z-index: 1;
  word-break: break-word;
  padding: 12px 0;
  min-height: 50px;
}
.sticky-top .week-day {
  color: #6F7782;
}
.schedule-avatar {
  min-height: 25px;
  max-height: 25px;
  width: 25px;
  height: 25px;
  min-width: 25px;
  max-width: 25px;
  border-radius: 50%;
  flex-shrink: 0;
  background-size: cover;
  -o-object-fit: cover;
  object-fit: cover;
  background-repeat: no-repeat;
  background-color: var(--white);
  border: 1px solid white;
}
.schedule-avatar.avatar-acronym {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 10px;
  font-weight: unset;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f2f2f2;
}
.resource-background {
  padding: 5px;
  background: white;
  border-radius: 5px;
  min-width: 180px;
  margin-bottom: 5px;
  border-left: 2px solid transparent;
  min-height: 44px;
}
.schedule-list {
  border-radius: 5px;
  min-height: 44px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  margin: 3px 0;
  cursor: pointer;
  padding: 5px;
  color: white;
  min-width: 150px;
  z-index: 2;
}
#project-event .schedule-list {
  transition: all 0.5s;
}
.installer-view .schedule-list {
  transition: all 0.5s;
  padding: 8px;
  min-width: 194px;
  max-width: 258px;
}
.row-scheduler app-resource-avatars .resources-wrapper .avatar {
  margin-left: -5px !important;
}
#schedule-textarea {
  resize: none;
  min-height: 30px;
  height: 30px;
  max-height: 100px;
  width: 100%;
  padding: 8px;
  font-family: gilroy-medium;
  border: 1px solid #ced0d3;
  box-shadow: 0px 1px 5px rgb(0 0 0 / 6%);
  border-radius: 2px;
}
.schedule-checkBox .mat-checkbox-layout,
.schedule-checkBox .mat-checkbox-label {
  width: 100% !important;
}
#schedule-time-slot .time-slot {
  min-width: 90px;
  width: 100%;
  color: #6F7782;
}
#schedule-time-slot.large-screen .time-slot {
  min-width: 114px;
}
.empty-timeline {
  min-width: 166px;
  width: 166px;
  z-index: 1;
}
#project-event .schedule-animation {
  transition: all 0.5s;
  min-width: 150px;
  cursor: pointer;
}
.holiday {
  border: 4px solid #000000 !important;
  border-top: unset !important;
  border-bottom: unset !important;
  background: #00000033;
  font-size: 14px;
  font-family: gilroy-semi-bold;
  min-height: 60px;
  width: 100%;
  margin: 10px 0;
}
.installer-view .holiday {
  padding: 8px;
  min-width: 194px;
  max-width: 258px;
}
.blocked-event {
  background: #7e8a9633 !important;
  color: #7e8a96 !important;
  border-width: 2px;
}
app-time-dropdown.schedule-date-input .mat-mdc-form-field {
  min-width: 100px !important;
}
app-time-dropdown.schedule-date-input .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  padding: 0 10px !important;
  border: 1px solid var(--cool-green) !important;
  border-radius: 16px !important;
  color: var(--cool-green) !important;
  height: 24px !important;
  text-align: center;
}
app-time-dropdown.schedule-date-input .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:disabled {
  background-color: var(--light-gray2) !important;
  border-color: var(--cool-grey) !important;
  color: rgba(0, 0, 0, 0.38) !important;
}
app-time-dropdown.schedule-date-input .mat-mdc-form-field .arrow-icon {
  top: 6px;
}
app-time-dropdown.schedule-date-input .mat-mdc-form-field .mat-icon svg path {
  fill: var(--cool-green);
}
.PPE-schedule-view {
  max-height: calc(100vh - 168px) !important;
}
.base-layout-wrapper-sm .PPE-schedule-view {
  max-height: calc(100vh - 185px) !important;
}
.schedule-content-overflow-container {
  max-height: calc(100vh - 181px);
}
.filter-applied .schedule-content-overflow-container {
  max-height: calc(100vh - 245px);
}
.PPE-schedule-height {
  max-height: calc(100vh - 246px) !important;
}
.schedule-filter-container {
  padding-right: 0;
  padding-left: 0;
  padding-top: 0;
}
mat-form-field,
.mat-chip-list-wrapper {
  width: 100%;
}
.mat-chip-list-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  margin: 5px 0 0 !important;
}
.mat-chip-list-wrapper .mat-mdc-standard-chip,
.mat-chip-list-wrapper input.mat-input-element {
  margin: 4px;
  transition: box-shadow 280ms cubic-bezier(.4, 0, .2, 1);
  display: inline-flex;
  padding: 7px 12px;
  border-radius: 16px;
  align-items: center;
  cursor: default;
}
.mat-mdc-standard-chip.mat-chip-with-trailing-icon {
  padding-top: 7px;
  padding-bottom: 7px;
  padding-right: 8px;
  padding-left: 12px;
}
.mat-mdc-chip.mat-mdc-standard-chip {
  background-color: #e0e0e0;
  color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-standard-chip .mat-chip-remove.mat-icon {
  width: 18px;
  height: 18px;
}
.mat-mdc-chip.mat-mdc-standard-chip .mat-chip-remove {
  color: rgba(0, 0, 0, 0.87);
  opacity: .4;
}
.mat-mdc-chip .mat-chip-remove.mat-icon,
.mat-chip .mat-chip-trailing-icon.mat-icon {
  font-size: 18px;
  margin-left: 5px;
}
.custom-date-picker .mat-form-field-wrapper,
.custom-date-picker .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}
.mat-calendar-body-cell::before,
.mat-calendar-body-cell::after,
.mat-calendar-body-cell-preview {
  content: "";
  position: absolute;
  top: -12% !important;
  left: 0;
  z-index: 0;
  box-sizing: border-box;
  height: 90%;
  width: 100%;
}
.custom-schedule-calendar .mat-calendar-table-header th {
  font-size: 11px !important;
  color: var(--blue) !important;
}
.custom-schedule-calendar .mat-calendar-body {
  font-family: gilroy-medium !important;
}
.sticky-left {
  position: sticky;
  left: 0;
  z-index: 3;
  background-color: #ffffff;
}
.event-project-name {
  font-size: 14px;
  font-family: "gilroy-semi-bold";
}
.event-project-time {
  font-size: 12px;
  font-family: "gilroy-medium";
  text-transform: uppercase;
}
.schedule-resize {
  width: 10px;
  height: 100%;
  background-color: transparent;
  position: absolute;
  top: 0;
  cursor: e-resize;
  z-index: 2;
}
.schedule-calender-filter-button.mat-mdc-menu-trigger.mat-mdc-button .mdc-button__label {
  order: 2;
}
.project-schedule-view.mat-drawer-content {
  margin-left: 90px !important;
}
.schedule-duration {
  display: flex;
  align-items: center;
  background: #EAECED;
  border-radius: 24px;
  margin: auto 0;
  height: 32px;
  z-index: 1;
  padding: 3px;
}
.schedule-duration span {
  padding: 10px 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.schedule-duration span.active {
  background: white;
  border-radius: 24px;
  color: #007ACC;
  height: 28px;
  box-shadow: 0px 0px 4px 0px rgba(1, 22, 47, 0.12);
}
.schedule-duration span:hover {
  border-radius: 24px;
  height: 28px;
  font-family: "gilroy-semi-bold2";
}
.monthly-view {
  display: grid;
  grid-template-columns: repeat(var(--columns), minmax(246px, 100%));
}
.monthly-view .days-name {
  font-size: 16px;
  display: flex;
  color: #6F7782;
  background: white;
  justify-content: center;
  font-family: "gilroy-semi-bold2";
  padding-bottom: 13px;
}
.monthly-view .day-in-number,
.monthly-view > span {
  font-size: 16px;
  color: #6F7782;
  font-family: gilroy-medium;
  margin-bottom: 10px;
}
.month-event.active-today .day-in-number,
.month-event.active-today .days-name,
.active-weekday {
  color: #007ACC !important;
  font-size: 18px !important;
}
.monthly-view .month-event {
  min-width: 246px;
  min-height: 180px;
  transition: .5s;
  border: 1px solid #EAECED;
}
.monthly-view .month-event:hover {
  background-color: rgba(0, 122, 204, .1);
}
.monthly-view .month-event:hover .day-in-number {
  color: black;
}
.monthly-view .past-or-today-event {
  background: #EAECED;
}
.monthly-view .active-today {
  position: relative;
  background: rgba(0, 122, 204, 0.12);
}
.active-today::before {
  content: "";
  background: rgba(0, 122, 204, 1);
  top: 0;
  position: absolute;
  height: 5px;
  width: 100%;
}
.monthly-project-list {
  border: 1px solid #EAECED;
  border-radius: 4px;
  margin: 5px 15px;
  padding: 5px;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.event-popup {
  min-width: 350px;
}
.event-popup-header {
  font-size: 16px;
  font-family: "gilroy-semi-bold2";
}
.event-popup-date {
  width: 4px;
  height: 4px;
  background: #6F7782;
  border-radius: 4px;
  overflow: hidden;
}
.event-popup .resources-wrapper .avatar,
.event-popup .resources-wrapper .mat-icon[svgicon=addResources] {
  min-width: 32px !important;
  max-width: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  width: 32px !important;
  height: 32px !important;
}
.schedule-task {
  display: flex;
  align-items: center;
  border: 1px solid #EAECED;
  border-radius: 4px;
  padding: 7px 10px;
  border-left-width: 4px;
  width: 100%;
}
.schedule-task-status {
  padding: 5px;
  border-radius: 50%;
  height: 10px;
  width: 10px;
  margin: auto 5px auto 0;
}
.monthly-view-calendar mat-form-field * {
  min-height: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  visibility: hidden;
}
.popup-label-color {
  margin-left: 15px;
}
.popup-label-color .color-palate {
  min-height: 20px;
  min-width: 20px;
  border-radius: 50%;
}
.popup-label-color .ng-select-container {
  border-color: transparent !important;
  box-shadow: unset !important;
}
.popup-label-color .ng-arrow-wrapper {
  visibility: hidden !important;
}
.popup-label-color:hover .ng-select-container {
  border-color: var(--silver) !important;
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06) !important;
}
.popup-label-color:hover .ng-arrow-wrapper {
  visibility: visible !important;
}
#project-event .status-tag {
  border-radius: 50%;
  height: 12px;
  width: 12px;
  margin-right: 5px;
}
span.time-line {
  height: 100%;
  position: absolute;
  margin-left: -3px;
  top: 0;
  mix-blend-mode: color;
  cursor: pointer;
  width: 100%;
}
span.time-line.enter,
span.time-line.Week-view:hover {
  border-color: rgba(0, 122, 204, 1);
  background-color: rgba(0, 122, 204, 1);
  opacity: 16%;
}
span.time-line:nth-child(odd).enter {
  border-color: unset;
  background-image: linear-gradient(rgba(0, 122, 204, .4) 33%, rgba(255, 255, 255, 0) 0%) !important;
}
.resource-selected {
  background: var(--blue);
  border: 1px solid var(--blue);
  border-radius: 16px;
  color: var(--white);
}
.active-time,
.active-date {
  color: #007ACC !important;
  font-size: 16px;
  font-family: "gilroy-semi-bold2";
}
.odd-border-style span.time-line:nth-child(odd) {
  border-left: 1px solid rgba(234, 236, 237, .8);
  background-image: linear-gradient(rgba(186, 186, 186, .33) 33%, rgba(255, 255, 255, 0) 0%);
  background-position: right;
  background-size: 1px 20px;
  background-repeat: repeat-y;
}
.inside span.time-line:nth-child(even) {
  border: unset !important;
}
.schedule-container-element {
  border-bottom: 1px solid rgba(234, 236, 237, .8);
}
.schedule-day-container:hover {
  background-color: rgba(0, 122, 204, .19);
}
#schedule-time-slot .time-slot.vertical-view {
  min-height: 90px;
  height: 100%;
  width: unset !important;
  min-width: unset !important;
}
.week-day.unset-width {
  min-width: unset;
  width: unset;
}
.task-progress-parent-container {
  height: 40px;
  width: 40px;
  background: white;
  border-radius: 50%;
}
.task-progress-container {
  position: relative;
  width: 39px;
  height: 39px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
}
.task-progress-circle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: conic-gradient(#000 0% var(--progress-bar-value), #fff 0 0%);
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  rotate: 87deg;
}
.task-progress-circle::after {
  content: "";
  width: 30px;
  height: 30px;
  background: #ffffff;
  border-radius: 50%;
  position: absolute;
}
.task-progress-text {
  position: absolute;
}

/* src/assets/css/chat.css */
.chat-main-container {
  box-sizing: border-box;
  height: 85vh;
  max-height: 85vh;
  background: var(--white);
  border: 1px solid var(--light-gray2);
  box-shadow: 1px 2px 20px rgba(1, 22, 47, 0.15);
  border-radius: 12px;
  position: absolute;
  right: 0;
  z-index: 10001 !important;
  overflow: auto;
  transition: all .2s;
  display: flex;
  flex-direction: column;
}
.chat-large-device .chat-main-container {
  flex-direction: row !important;
}
.chat-container {
  width: 360px;
  flex-direction: column;
  display: block !important;
}
.chat-large-device .chat-child-container {
  border-right: 1px solid var(--light-gray2);
}
.chat-header {
  height: 56px;
  border-bottom: 1px solid var(--light-gray2);
  padding: 0 8px;
}
.chat-header-text {
  color: var(--navy);
  font-size: 20px;
  font-family: gilroy-semi-bold;
}
.chat-content {
  max-height: calc(85vh - 58px);
  overflow: auto;
  height: fit-content;
  padding: 16px 8px;
}
.chat-main-container-xs {
  width: 100vw;
  height: 85vh;
  position: relative;
}
.chat-container-xs {
  position: absolute;
  width: 100%;
  top: 0;
  right: 0;
}
.chat-container-parent {
  position: relative;
}
.chat-container-child {
  position: absolute;
}
.chat-container-xs.use-z-index,
.chat-container-child.use-z-index {
  background: var(--white);
  z-index: 100;
}
.chat-container-top .chat-container:not(.chat-list-container),
.use-z-index2 {
  position: absolute;
  background: var(--white);
  z-index: 100;
}
.chat-content-xs {
  max-height: calc(70vh - 58px) !important;
}
.chat-content-xs .search-input-container {
  width: 100%;
}
.chat-content-xs .chat-group-content {
  height: calc(70vh - 119px) !important;
}
.conversation-content .talkjs-container {
  height: calc(70vh - 90px) !important;
}
.hide-router-outlet {
  display: none;
}

/* src/assets/css/mobile.css */
@media (max-width: 599px) {
  .mobile-page-header {
    overflow-x: auto;
    overflow-y: hidden;
    min-height: 56px;
    border-bottom: 1px solid var(--silver);
    padding: 0px 16px;
  }
  .mobile-page-header .title-bar {
    min-height: 56px !important;
  }
  .sidenav-logo {
    margin: 0 !important;
    height: 30px !important;
    width: 30px !important;
    min-height: 30px !important;
    background-size: 20px 20px !important;
  }
  .mobile-page-header .title-txt {
    margin: auto 15px;
    font-size: 20px;
  }
  .installer-xs-user-img {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    border-radius: 50% !important;
    text-align: center;
    align-content: center;
    align-items: center;
    justify-content: center;
    display: flex;
    overflow: hidden;
    border: unset;
    cursor: pointer;
  }
  .installer-xs-user-img .acronym {
    background-color: var(--light-gray2) !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    line-height: 30px !important;
    border-radius: 50% !important;
  }
  .installer-xs-user-img.mat-mdc-button {
    padding: 0 !important;
  }
  .today-schedule {
    height: 25px;
    margin: 12px 12px 12px 22px;
    line-height: 25px;
    padding: 0 12px;
    border-radius: 6px;
    color: #fff;
    font-family: gilroy-light;
  }
  .widget-list {
    padding: 12px !important;
  }
  .planned-indicator {
    height: 8px !important;
    width: 8px !important;
    border: 1px solid;
    border-radius: 50%;
  }
  .page-container {
    padding: 16px !important;
  }
  .mat-tab-label-active .mat-tab-label-content,
  .mat-mdc-tab-link.mat-tab-label-active {
    color: var(--cool-green) !important;
  }
  .dt-header-cell:not(:first-child) {
    min-width: 40px !important;
    padding: 11px !important;
  }
  .dashboard .dt-table .dt-table-header .dt-header-cell,
  .dashboard .dt-table .dt-row .dt-cell {
    border-bottom: none;
    box-shadow: none;
  }
  .mat-mdc-button.transparent-btn {
    margin: 16px !important;
    line-height: 32px !important;
    border: 1px solid #CED0D3 !important;
    font-size: 16px !important;
  }
  header.sticky-header {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    z-index: 1000;
    height: 58px;
    background-color: var(--white);
  }
  header.sticky-header mat-toolbar,
  footer.sticky-footer mat-toolbar {
    background: transparent;
    border: 1px solid var(--light-gray2);
  }
  header.sticky-header mat-toolbar .toolbar-content {
    height: 58px;
    padding: 0 16px;
    font-size: 20px;
    color: var(--navy);
  }
  footer.sticky-footer {
    position: sticky;
    position: -webkit-sticky;
    bottom: 0;
    z-index: 1000;
    height: 58px;
    background-color: var(--white);
  }
  footer .mat-mdc-button.button-big {
    width: 158px;
    height: 40px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.208645);
    border-radius: 2px;
  }
  .xs-bottom-sheet mat-content {
    padding: 16px;
    color: var(--gray1);
  }
  .xs-bottom-sheet mat-content .sub-header {
    font-size: 16px;
    padding: 16px 0;
    color: var(--navy);
  }
  .xs-bottom-sheet mat-content .filter-option .mat-checkbox-layout,
  .xs-bottom-sheet mat-content .filter-option.single-selectable-option {
    padding: 0;
  }
  .md-avatar {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    min-height: 24px;
    min-width: 24px;
    max-height: 24px;
    max-width: 24px;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid var(--light-gray2);
    background-color: var(--light-gray2);
    text-align: center;
    color: var(--medium-gray);
    text-transform: uppercase;
    font-size: 11px;
    font-family: gilroy-medium;
    margin: 0;
    padding: 0;
  }
  .mat-checkbox-checked .mat-checkbox-label,
  .mat-radio-checked .radio-info {
    color: var(--cool-green);
  }
  .xs-bottom-sheet .bottom-sheet-content .mat-mdc-card {
    border: none !important;
    color: var(--medium-gray);
  }
}

/* src/assets/css/flex.css */
.flex {
  display: flex;
}
.flex-i {
  display: flex !important;
}
.flex-row {
  display: flex;
  flex-direction: row;
}
.flex-row-i {
  display: flex;
  flex-direction: row !important;
}
.flex-column.start-center {
  align-items: flex-start;
  justify-content: center;
}
.flex-row.center-start {
  align-items: flex-start;
  justify-content: center;
}
.flex-column.end-end {
  justify-content: flex-end;
  align-items: end;
}
.flex-column.end-center {
  justify-content: flex-end;
  align-items: center;
}
.flex-row.start-center {
  align-items: center;
  justify-content: flex-start;
}
.flex-row.start-start {
  align-items: flex-start;
  justify-content: flex-start;
}
.flex-row.start-center-i,
.flex-row-i.start-center-i {
  align-items: center !important;
  justify-content: flex-start !important;
}
.flex-row.center-center {
  align-items: center;
  justify-content: center;
}
.flex-row.start-end {
  align-items: start;
  justify-content: end;
}
.flex-row.end-center {
  align-items: center;
  justify-content: flex-end;
}
.flex-row.end-start {
  align-items: start;
  justify-content: flex-end;
}
.flex-row.end-center-i {
  align-items: center !important;
  justify-content: flex-end !important;
}
.flex-row.space-evenly-start {
  align-items: start;
  justify-content: space-evenly;
}
.flex-row-r {
  display: flex;
  flex-direction: row-reverse;
}
.flex-row-i {
  display: flex !important;
  flex-direction: row !important;
}
.flex-row.align-start {
  align-items: flex-start;
}
.flex-row.align-end {
  align-items: flex-end;
  justify-content: end;
}
.flex-row.align-center {
  align-items: center;
  justify-content: center;
}
.flex-row.align-center-start {
  align-items: center;
  justify-content: start;
}
.flex-row.align-end-center {
  align-items: center;
  justify-content: end;
}
.flex-row.space-between-start {
  align-items: flex-start;
  justify-content: space-between;
}
.flex-row.space-between-center,
.flex-row-r.space-between-center {
  align-items: center;
  justify-content: space-between !important;
}
.flex-row.space-between-end {
  align-items: end;
  justify-content: space-between;
}
.flex-row.space-between-stretch,
.flex-column.space-between-stretch {
  align-content: stretch;
  justify-content: space-between;
  align-items: stretch;
}
.flex-row.space-around-center,
.flex-row-r.space-around-center {
  align-items: center;
  justify-content: space-around !important;
}
.flex-row.flex-flow {
  flex-flow: row wrap;
  -ms-flex-flow: row wrap;
}
.flex-row-wrap {
  flex-flow: row wrap;
  display: flex;
}
.flex-row-wrap.start-center {
  align-items: center;
  justify-content: flex-start;
}
.flex-row-wrap.center-center {
  align-items: center;
  justify-content: center;
}
.flex-column {
  display: flex;
  flex-direction: column;
}
.flex-column-i {
  display: flex !important;
  flex-direction: column !important;
}
.flex-column.align-start {
  align-items: flex-start;
}
.flex-column.align-center {
  align-items: center;
  justify-content: center;
}
.flex-column.align-end {
  align-items: flex-end;
}
.flex-column.align-center-start {
  align-items: center;
  justify-content: start;
}
.flex-column.align-start-center {
  align-items: start;
  justify-content: center;
}
.flex-column.space-between {
  justify-content: space-between;
}
.flex-column.space-between-center {
  align-items: center;
  justify-content: space-between;
}
.flex-column.space-between-start {
  align-items: flex-start;
  justify-content: space-between;
}
.flex-column.space-around-start {
  align-items: flex-start;
  justify-content: space-around;
}
.flex-column.center-center {
  align-items: center;
  justify-content: center;
}
.flex-column.start-start {
  align-items: flex-start;
  justify-content: flex-start;
}
.flex-column.center-start {
  align-items: center;
  justify-content: flex-start;
}
.flex-column.center-stretch {
  align-items: stretch;
  justify-content: center;
}
.flex-column.start-end {
  align-items: flex-end;
  justify-content: flex-start;
}
.flex-column.space-around-center {
  align-items: center;
  justify-content: space-around !important;
}
.flex-column-wrap {
  flex-flow: column wrap;
  display: flex;
}
.flex-column-reverse {
  display: flex;
  flex-direction: column-reverse;
}
.flex-wrap {
  flex-wrap: wrap;
}
.flex-wrap-unset {
  flex-wrap: unset !important;
}
.flex-column.flex100 {
  flex: 1 1 100%;
}
.justify-content-end {
  justify-content: end !important;
}
.flex-gap-0 {
  gap: 0px;
}
.flex-gap-2 {
  gap: 2px;
}
.flex-gap-3 {
  gap: 3px;
}
.flex-gap-4 {
  gap: 4px;
}
.flex-gap-5 {
  gap: 5px;
}
.flex-gap-6 {
  gap: 6px;
}
.flex-gap-7 {
  gap: 7px;
}
.flex-gap-8 {
  gap: 8px;
}
.flex-gap-10 {
  gap: 10px;
}
.flex-gap-12 {
  gap: 12px;
}
.flex-gap-13 {
  gap: 13px;
}
.flex-gap-14 {
  gap: 14px;
}
.flex-gap-15 {
  gap: 15px;
}
.flex-gap-16 {
  gap: 16px;
}
.flex-gap-18 {
  gap: 18px;
}
.flex-gap-20 {
  gap: 20px;
}
.flex-gap-22 {
  gap: 22px;
}
.flex-gap-24 {
  gap: 24px;
}
.flex-gap-25 {
  gap: 25px;
}
.flex-gap-27 {
  gap: 27px;
}
.flex-gap-28 {
  gap: 28px;
}
.flex-gap-30 {
  gap: 30px;
}
.flex-gap-31 {
  gap: 31px;
}
.flex-gap-32 {
  gap: 32px;
}
.flex-gap-33 {
  gap: 33px;
}
.flex-gap-34 {
  gap: 34px;
}
.flex-gap-36 {
  gap: 36px;
}
.flex-gap-37 {
  gap: 37px;
}
.flex-gap-40 {
  gap: 40px;
}
.flex-gap-42 {
  gap: 42px;
}
.flex-gap-48 {
  gap: 48px;
}
.flex-gap-50 {
  gap: 50px;
}
.flex-gap-54 {
  gap: 54px;
}
.flex-gap-55 {
  gap: 55px;
}
.flex-gap-56 {
  gap: 56px;
}
.flex-gap-58 {
  gap: 58px;
}
.flex-gap-60 {
  gap: 60px;
}
.flex-gap-62 {
  gap: 62px;
}
.flex-gap-64 {
  gap: 64px;
}
.flex-gap-65 {
  gap: 65px !important;
}
.flex-gap-70 {
  gap: 70px;
}
.flex-gap-74 {
  gap: 74px;
}
.flex-gap-76 {
  gap: 76px;
}
.flex-gap-78 {
  gap: 78px;
}
.flex-gap-80 {
  gap: 80px;
}
.flex-gap-84 {
  gap: 84px;
}
.flex-gap-88 {
  gap: 88px;
}
.flex-gap-90 {
  gap: 90px;
}
.flex-gap-94 {
  gap: 94px;
}
.flex-gap-96 {
  gap: 96px;
}
.flex-gap-98 {
  gap: 98px;
}
.flex-gap-120 {
  gap: 120px;
}
.flex-gap-124 {
  gap: 124px;
}
.flex-gap-128 {
  gap: 128px;
}
.flex-gap-192 {
  gap: 192px;
}
.flex-gap-140 {
  gap: 140px;
}
.flex-gap-144 {
  gap: 144px;
}
.flex-gap-16i {
  gap: 16px !important;
}
.flex-gap-8i {
  gap: 8px !important;
}
@media screen and (min-width: 0px) and (max-width: 599.98px) {
  .flex-column-xs {
    align-items: center;
    display: flex;
    flex-direction: column;
  }
  .flex-xs-auto {
    flex: 1 1 0%;
  }
  .flex-100-50 {
    flex: 1 1 50%;
    max-width: 50%;
  }
}
@media only screen and (min-width: 600px) and (max-width: 767px) {
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .flex-sm-auto {
    flex: 1 1 0%;
  }
  .flex-sm-100 {
    flex: 1 1 100%;
    max-width: 100%;
  }
}
.fxHide {
  display: none !important;
}
.fxShow {
  display: initial !important;
}
@media only screen and (max-width: 599.99px) {
  .fxHide-xs {
    display: none !important;
  }
  .fxShow-xs {
    display: initial !important;
  }
}
@media only screen and (min-width: 600px) {
  .fxHide-gt-xs {
    display: none !important;
  }
  .fxShow-gt-xs {
    display: initial !important;
  }
}
@media only screen and (min-width: 600px) and (max-width: 959.99px) {
  .fxHide-sm {
    display: none !important;
  }
  .fxShow-sm {
    display: initial !important;
  }
}
@media only screen and (min-width: 960px) {
  .fxHide-gt-sm {
    display: none !important;
  }
  .fxShow-gt-sm {
    display: initial !important;
  }
}
@media only screen and (min-width: 600px) and (max-width: 959.99px) {
  .fxHide-md {
    display: none !important;
  }
  .fxShow-md {
    display: initial !important;
  }
}
@media only screen and (min-width: 1280px) {
  .fxHide-gt-md {
    display: none !important;
  }
  .fxShow-gt-md {
    display: initial !important;
  }
}
@media only screen and (min-width: 1280px) and (max-width: 1919.99px) {
  .fxHide-lg {
    display: none !important;
  }
  .fxShow-lg {
    display: initial !important;
  }
}
@media only screen and (min-width: 1920px) {
  .fxHide-gt-lg {
    display: none !important;
  }
  .fxShow-gt-lg {
    display: initial !important;
  }
}
@media only screen and (min-width: 1920px) and (max-width: 4999.99px) {
  .fxHide-xl {
    display: none !important;
  }
  .fxShow-xl {
    display: initial !important;
  }
}
@media only screen and (max-width: 1919.99px) {
  .fxHide-lt-xl {
    display: none !important;
  }
  .fxShow-lt-xl {
    display: initial !important;
  }
}
.flex-order-1 {
  order: 1;
  -webkit-order: 1;
}
.flex-order-2 {
  order: 2;
  -webkit-order: 2;
}
.flex-order-3 {
  order: 3;
  -webkit-order: 3;
}
.flex-order-4 {
  order: 4;
  -webkit-order: 4;
}
.flex-order-5 {
  order: 5;
  -webkit-order: 5;
}
.flex-order-6 {
  order: 6;
  -webkit-order: 6;
}
.flex-order-7 {
  order: 7;
  -webkit-order: 7;
}
.flex-fill {
  height: 100%;
  min-height: 100%;
  min-width: 100%;
  width: 100%;
}
.flex-auto {
  flex: 1 1 0%;
  box-sizing: border-box;
}
.flex-auto-i {
  flex: 1 1 0% !important;
  box-sizing: border-box;
}
.flex-99 {
  flex: 1 1 99%;
  max-width: 99%;
}
.flex-85px {
  flex: 1 1 85px;
  max-width: 85px;
}
.flex-85 {
  flex: 1 1 85%;
  max-width: 85%;
}
.flex-100 {
  flex: 1 1 100%;
  max-width: 100%;
}
.flex-100i {
  flex: 1 1 100% !important;
  max-width: 100% !important;
}
.flex-100-50 {
  flex: 1 1 100%;
  max-width: 100%;
}
.flex-3 {
  flex: 1 1 3%;
  max-width: 3%;
}
.flex-5 {
  flex: 1 1 5%;
  max-width: 5%;
}
.flex-6 {
  flex: 1 1 6%;
  max-width: 6%;
}
.flex-7 {
  flex: 1 1 7%;
  max-width: 7%;
}
.flex-8 {
  flex: 1 1 8%;
  max-width: 8%;
}
.flex-10 {
  flex: 1 1 10%;
  max-width: 10%;
}
.flex-9 {
  flex: 1 1 9%;
  max-width: 9%;
}
.flex-11 {
  flex: 1 1 11%;
  max-width: 11%;
}
.flex-12 {
  flex: 1 1 12%;
  max-width: 12%;
}
.flex-13 {
  flex: 1 1 13%;
  max-width: 13%;
}
.flex-14 {
  flex: 1 1 14%;
  max-width: 14%;
}
.flex-15 {
  flex: 1 1 15%;
  max-width: 15%;
}
.flex-16 {
  flex: 1 1 16%;
  max-width: 16%;
}
.flex-20 {
  flex: 1 1 20%;
  max-width: 20%;
}
.flex-22 {
  flex: 1 1 22%;
  max-width: 22%;
}
.flex-23 {
  flex: 1 1 23%;
  max-width: 23%;
}
.flex-23-5 {
  flex: 1 1 23.5%;
  max-width: 23.5%;
}
.flex-25 {
  flex: 1 1 25%;
  max-width: 25%;
}
.flex-25px {
  flex: 1 1 25px;
  max-width: 25px;
}
.flex-25h {
  flex: 1 1 25%;
  max-height: 25%;
}
.flex-26 {
  flex: 1 1 26%;
  max-width: 26%;
}
.flex-27 {
  flex: 1 1 27%;
  max-width: 27%;
}
.flex-28 {
  flex: 1 1 28%;
  max-width: 28%;
}
.flex-27-5 {
  flex: 1 1 27.5%;
  max-width: 27.5%;
}
.flex-30px {
  flex: 1 1 30px;
  min-width: 30px;
  max-width: 30px;
}
.flex-30 {
  flex: 1 1 30%;
  max-width: 30%;
}
.flex-31 {
  flex: 1 1 31%;
  max-width: 31%;
}
.flex-32 {
  flex: 1 1 32%;
  max-width: 32%;
}
.flex-30h {
  flex: 1 1 100%;
  max-height: 30%;
}
.flex-32 {
  flex: 1 1 32%;
  max-width: 32%;
}
.flex-33 {
  flex: 1 1 33%;
  max-width: 33%;
}
.flex-33-33 {
  flex: 1 1 33.33%;
  max-width: 33.33%;
}
.flex-34 {
  flex: 1 1 34%;
  max-width: 34%;
}
.flex-35 {
  flex: 1 1 35%;
  max-width: 35%;
}
.flex-35px {
  flex: 1 1 35px;
  max-width: 35px;
}
.flex-36 {
  flex: 1 1 36%;
  max-width: 36%;
}
.flex-37 {
  flex: 1 1 37%;
  max-width: 37%;
}
.flex-38 {
  flex: 1 1 38%;
  max-width: 38%;
}
.flex-39 {
  flex: 1 1 39%;
  max-width: 39%;
}
.flex-39px {
  flex: 1 1 39px;
  max-width: 39px;
}
.flex-40 {
  flex: 1 1 40%;
  max-width: 40%;
  box-sizing: border-box;
}
.flex-42 {
  flex: 1 1 42%;
  max-width: 42%;
}
.flex-43 {
  flex: 1 1 43%;
  max-width: 43%;
}
.flex-45 {
  flex: 1 1 45%;
  max-width: 45%;
}
.flex-47 {
  flex: 1 1 47%;
  max-width: 47%;
}
.flex-48 {
  flex: 1 1 48%;
  max-width: 48%;
}
.flex-48px {
  flex: 1 1 48px;
  max-width: 48px;
}
.flex-50px {
  flex: 1 1 50px;
  max-width: 50px;
}
.flex-49 {
  flex: 1 1 100%;
  max-width: 49%;
}
.flex-50 {
  flex: 1 1 100%;
  max-width: 50%;
}
.flex-51px {
  flex: 1 1 51px;
  max-width: 51px;
}
.flex-51 {
  flex: 1 1 51%;
  max-width: 51%;
}
.flex-53 {
  flex: 1 1 53%;
  max-width: 53%;
}
.flex-55 {
  flex: 1 1 55%;
  max-width: 55%;
}
.flex-60 {
  flex: 1 1 60%;
  max-width: 60%;
}
.flex-64 {
  flex: 1 1 64%;
  max-width: 64%;
}
.flex-64px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 64px;
  min-width: 64px;
}
.flex-65 {
  flex: 1 1 65%;
  max-width: 65%;
}
.flex-66 {
  flex: 1 1 66%;
  max-width: 66%;
}
.flex-67 {
  flex: 1 1 67%;
  max-width: 67%;
}
.flex-70 {
  flex: 1 1 70%;
  max-width: 70%;
}
.flex-70px {
  flex: 1 1 70px;
  max-width: 70px;
}
.flex-70px {
  flex: 1 1 70px;
  min-width: 70px;
  max-width: 70px;
}
.flex-72px {
  flex: 1 1 72px;
  max-width: 72px;
}
.flex-75px {
  flex: 1 1 75px;
  min-width: 75px;
  max-width: 75px;
}
.flex-75 {
  flex: 1 1 75%;
  max-width: 75%;
}
.flex-75h {
  flex: 1 1 75%;
  max-height: 75%;
}
.flex-78 {
  flex: 1 1 78%;
  max-width: 78%;
}
.flex-80px {
  flex: 1 1 80px;
  min-width: 80px;
  max-width: 80px;
}
.flex-80 {
  flex: 1 1 80%;
  max-width: 80%;
}
.flex-83 {
  flex: 1 1 83%;
  max-width: 83%;
}
.flex-88px {
  flex: 1 1 88px;
  min-width: 88px;
  max-width: 88px;
}
.flex-88 {
  flex: 1 1 88%;
  max-width: 88%;
}
.flex-90 {
  flex: 1 1 90%;
  max-width: 90%;
}
.flex-90h {
  flex: 1 1 100%;
  max-height: 90%;
}
.flex-90px {
  flex: 1 1 90px;
  min-width: 90px;
  max-width: 90px;
}
.flex-92 {
  flex: 1 1 92%;
  max-width: 92%;
}
.flex-95px {
  flex: 1 1 95px;
  min-width: 95px;
  max-width: 95px;
}
.flex-98 {
  flex: 1 1 98%;
  max-width: 98%;
}
.flex-100px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 100px;
  min-width: 100px;
}
.flex-109px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 109px;
  min-width: 109px;
}
.flex-117px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 117px;
  min-width: 117px;
}
.flex-120px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 120px;
  min-width: 120px;
}
.flex-124px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 124px;
  min-width: 124px;
}
.flex-128px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 128px;
  min-width: 128px;
}
.flex-180px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 180px;
  min-width: 180px;
}
.flex-185px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 185px;
  min-width: 185px;
}
.flex-110 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 110px;
  min-width: 110px;
}
.flex-130px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 130px;
  min-width: 130px;
}
.flex-102px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 102px;
  min-width: 102px;
}
.flex-136px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 136px;
  min-width: 136px;
}
.flex-140 {
  display: flex;
  flex: 1 1 140px;
  max-width: 140px;
  min-width: 140px;
}
.flex-150 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 150px;
  min-width: 150px;
}
.flex-151 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 151px;
  min-width: 151px;
}
.flex-153 {
  max-width: 153px;
  min-width: 153px;
}
.flex-155 {
  max-width: 155px;
  min-width: 155px;
}
.flex-162 {
  max-width: 162px;
  min-width: 162px;
}
.flex-162-5px {
  max-width: 162.5px;
  min-width: 162.5px;
}
.flex-166 {
  max-width: 166px;
  min-width: 166px;
}
.flex-170 {
  max-width: 170px;
  min-width: 170px;
}
.flex-179 {
  max-width: 179px;
  min-width: 179px;
}
.flex-180 {
  max-width: 180px;
  min-width: 180px;
}
.flex-182 {
  display: flex;
  flex: 1 1 182px;
  max-width: 182px;
  min-width: 182px;
}
.flex-183px {
  display: flex;
  flex: 1 1 183px;
  max-width: 183px;
  min-width: 183px;
}
.flex-158 {
  display: flex;
  flex: 1 1 158px;
  max-width: 158px;
  min-width: 158px;
}
.flex-160 {
  display: flex;
  flex: 1 1 160px;
  max-width: 160px;
  min-width: 160px;
}
.flex-175 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 175px;
  min-width: 175px;
}
.flex-183px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 183px;
  min-width: 183px;
}
.flex-200 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 200px;
  min-width: 200px;
}
.flex-230 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 230px;
  min-width: 230px;
}
.flex-240 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 240px;
  min-width: 240px;
}
.flex-250 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 250px;
  min-width: 250px;
}
.flex-270 {
  display: flex;
  flex: 1 1 270px;
  max-width: 270px;
  min-width: 270px;
}
.flex-350,
.flex-350px {
  display: flex;
  flex: 1 1 350px;
  max-width: 350px;
  min-width: 350px;
}
.flex-400 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 400px;
  min-width: 400px;
}
.flex-420 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 420px;
  min-width: 420px;
}
.flex-430 {
  flex: 1 1 430px;
  box-sizing: border-box;
  max-width: 430px;
  min-width: 430px;
}
.flex-444px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 444px;
  min-width: 444px;
}
.flex-450 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 450px;
  min-width: 450px;
}
.flex-475 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 475px;
  min-width: 475px;
}
.flex-480 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 480px;
  min-width: 480px;
}
.flex-490 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 490px;
  min-width: 490px;
}
.flex-500 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 500px;
  min-width: 500px;
}
.flex-522 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 522px;
  min-width: 522px;
}
.flex-530 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 530px;
  min-width: 530px;
}
.flex-540px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 540px;
  min-width: 540px;
}
.flex-545px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 545px;
  min-width: 545px;
}
.flex-550 {
  display: flex;
  flex: 1 1 0px;
  max-width: 550px;
  min-width: 550px;
}
.flex-555 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 550px;
  min-width: 550px;
}
.flex-568 {
  display: flex;
  flex: 1 1 568px;
  max-width: 568px;
  min-width: 568px;
}
.flex-560 {
  display: flex;
  flex: 1 1 560x;
  max-width: 560px;
  min-width: 560px;
}
.flex-575px {
  display: flex;
  flex: 1 1 0px;
  max-width: 575px;
  min-width: 575px;
}
.flex-585px {
  display: flex;
  flex: 1 1 0px;
  max-width: 585px;
  min-width: 585px;
}
.flex-600 {
  flex: 1 1 100%;
  box-sizing: border-box;
  max-width: 600%;
}
.flex-600px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 600px;
  min-width: 600px;
}
.flex-630 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 630px;
  min-width: 630px;
}
.flex-650 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 650px;
  min-width: 650px;
}
.flex-650-i {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 650px !important;
  min-width: 650px !important;
}
.flex-700 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 700px;
  min-width: 700px;
}
.flex-708 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 708px;
  min-width: 708px;
}
.flex-750 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 750px;
  min-width: 750px;
}
.flex-765 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 765px;
  min-width: 765px;
}
.flex-767 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 767px;
  min-width: 767px;
}
.flex-800 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 800px;
  min-width: 800px;
}
.flex-820 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 820px;
  min-width: 820px;
}
.flex-840px {
  flex: 1 1 840px;
  box-sizing: border-box;
  max-width: 840px;
  min-width: 840px;
}
.flex-850 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 850px;
  min-width: 850px;
}
.flex-900 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 900px;
  min-width: 900px;
}
.flex-910 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 910px;
  min-width: 910px;
}
.flex-900 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 900px;
  min-width: 900px;
}
.flex-950 {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 950px;
  min-width: 950px;
}
.flex-1000px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 1000px;
  min-width: 1000px;
}
.flex-1200px {
  flex: 1 1 0px;
  box-sizing: border-box;
  max-width: 1200px;
  min-width: 1200px;
}

/* src/assets/css/date-picker.css */
#dtCloudApp .mat-datepicker-content {
  border: 1px solid var(--light-gray2);
  box-shadow: 0px 0px 4px rgba(1, 22, 47, 0.16);
  border-radius: 4px;
  color: var(--navy);
}
.mat-datepicker-content .mat-calendar {
  height: auto !important;
  width: 225px !important;
  font-size: 12px;
  font-family: gilroy-medium;
  background: var(--white);
}
.mat-datepicker-content .time-container {
  height: unset;
  border: unset;
  box-shadow: unset;
  padding: 5px 10px;
  margin: 0;
  line-height: unset;
  justify-content: start !important;
  background-color: #fff;
}
.mat-datepicker-toggle .mat-mdc-icon-button.mat-mdc-button-base {
  height: 40px;
  width: 40px;
  padding: 0;
}
.mat-datepicker-toggle.datepicker-prefix-padding .mat-mdc-icon-button.mat-mdc-button-base {
  padding: 8px 0;
}
.datepicker-prefix-icon .mat-icon {
  min-height: 24px;
  min-width: 24px;
  max-height: 24px;
  max-width: 24px;
}
#dtCloudApp .mat-datepicker-input.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control,
#dtCloudApp .dt-ngx-mat-date-time-picker .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  padding-left: 40px;
}
#dtCloudApp .mat-calendar-period-button,
.mat-calendar-period-button .mdc-button__label,
.custom-picker-label {
  color: var(--medium-gray);
  font-size: 14px;
  font-family: gilroy-semi-bold !important;
  padding: 0 !important;
  margin: 0 8px;
  background: transparent;
}
#dtCloudApp .dashboard-calender .mat-calendar-period-button,
.mat-calendar-period-button .mdc-button__label,
.custom-picker-label {
  margin-left: 5px !important;
  font-size: 18px !important;
}
.servicecallCalender .mat-calendar-period-button .mdc-button__label,
.custom-picker-label {
  color: var(--white) !important;
}
.mat-calendar-table-header th {
  color: var(--gray1) !important;
  font-size: 11px;
  font-family: gilroy-bold;
  text-transform: unset;
  position: relative;
}
.dashboard-calender thead.mat-calendar-table-header span {
  margin-right: 12px;
  font-size: 16px;
}
.mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
  background-color: var(--white) !important;
  color: var(--blue) !important;
  border-radius: 4px !important;
  border-color: var(--blue);
  font-family: gilroy-bold;
}
.mat-calendar-body-selected,
.mat-calendar-body-selected,
.mat-calendar-body-selected {
  background-color: var(--cool-green);
  color: var(--white);
  border-radius: 4px !important;
  border-color: var(--cool-green);
  font-family: gilroy-bold;
  box-shadow: unset !important;
}
.mat-calendar-body-cell.mat-calendar-body-disabled > span {
  color: var(--cool-grey) !important;
}
.mat-datepicker-content .actions .mat-stroked-button {
  height: 32px;
  width: 40px;
  min-width: 40px;
  padding: 0;
  line-height: 0;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.08) 100%),
    #0DBB7D;
  box-shadow: 0px 2px 4px rgb(1 22 47 / 16%);
  border-radius: 2px;
  border: unset;
  color: var(--white);
}
.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-meridian .mat-button {
  background: unset;
  border: unset;
  color: var(--cool-green);
  font-size: 13px;
  font-family: gilroy-semi-bold;
  height: 33px !important;
  width: 0 !important;
  line-height: unset !important;
}
.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-form-field {
  width: 32px !important;
  max-width: 32px !important;
}
.mat-calendar-controls .mat-calendar-previous-button,
.mat-calendar-controls .mat-calendar-next-button {
  height: 24px !important;
  width: 24px !important;
  margin: 0 8px !important;
  padding: 0 !important;
  min-width: 0 !important;
  color: var(--navy);
  background-color: transparent;
}
.mat-calendar-previous-button::after,
.mat-calendar-next-button::after {
  height: 7px;
  width: 7px;
  top: 7px !important;
  left: 7px !important;
}
.mat-calendar-previous-button:hover,
.mat-calendar-next-button:hover,
.custom-schedule-calendar .arrow-btn:hover {
  background-color: rgba(0, 122, 204, 0.2);
}
.mat-calendar-previous-button:active,
.mat-calendar-next-button:active,
.custom-schedule-calendar .arrow-btn:active {
  background-color: rgba(0, 122, 204, 0.4);
}
@media (hover: hover) {
  .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    background-color: rgba(0, 122, 204, 0.2);
  }
}
.mat-datepicker-content .mat-calendar-body-cell-content {
  border: unset;
  color: var(--gray3) !important;
  font-size: 12px !important;
}
.mat-datepicker-content .mat-calendar.custom-datepicker-panel {
  margin: 16px;
  border-radius: 8px;
  box-shadow: 1px 4px 8px rgba(0, 0, 0, 0.2);
}
.mat-datepicker-content .mat-calendar .mat-calendar-table-header th {
  color: var(--blue) !important;
}
.mat-datepicker-content .mat-calendar-body-cell-content.mat-calendar-body-selected {
  color: var(--white) !important;
}
ngx-mat-calendar-header .mat-calendar-header .mat-calendar-period-button .mdc-button__label {
  font-size: 14px !important;
}
.mat-calendar-body-cell.selected > .mat-calendar-body-cell-content,
.mat-calendar-body-cell.selected:hover > .mat-calendar-body-cell-content,
.mat-calendar-body-cell.selected > .mat-calendar-body-cell-content:hover {
  background-color: var(--cool-green) !important;
  color: var(--white) !important;
  border-color: var(--cool-green);
}
.ngx-mat-timepicker .mat-input-element {
  border: 1px solid var(--silver);
  box-shadow: inset 0px 1px 4px rgb(0 0 0 / 6%);
  border-radius: 2px;
  height: 33px;
}
.ngx-mat-timepicker .mat-focused .mat-input-element {
  border-color: var(--green-blue);
}
.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-spacer {
  padding: 0 5px;
}
.calendar-date-range-selection .mat-calendar-body-selected {
  background-color: #007ACC !important;
  font-family: gilroy-semi-bold !important;
  font-size: 14px !important;
}
.calendar-date-range-selection .mat-calendar-body-in-range::before {
  background: #007ACC !important;
  opacity: 0.12;
}
.calendar-date-range-selection .mat-calendar-table-header th {
  font-size: 14px !important;
  font-family: gilroy-semi-bold !important;
  color: var(--blue) !important;
}
.calendar-date-range-selection .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
  background-color: #EBF4FB !important;
}
.calendar-date-range-selection .mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range)::before {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  width: 65% !important;
}
.calendar-date-range-selection .mat-calendar-body-cell::before {
  top: 2px !important;
  height: 62% !important;
}
.calendar-date-range-selection .mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
  font-family: gilroy-regular !important;
  border-color: var(--blue);
}
.calendar-date-range-selection .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  color: #01162F !important;
  font-size: 14px !important;
  font-family: gilroy-regular !important;
}
.calendar-date-range-selection .weekend-date .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
  color: #6F7782 !important;
}

/* src/assets/css/button.css */
.mat-mdc-button {
  line-height: 15px !important;
  letter-spacing: 0;
  min-width: 98px !important;
  padding: 6px 12px !important;
  font-family: "gilroy-semi-bold" !important;
  white-space: nowrap;
  height: 36px !important;
  font-size: 14px !important;
  border-radius: 5px !important;
}
.mat-mdc-button.mat-secondary {
  border: 2px solid var(--silver2);
  background-color: var(--white) !important;
  color: var(--navy);
  border-radius: 5px !important;
}
.mat-mdc-button.mat-secondary.secondary {
  border: 2px solid var(--cool-green) !important;
  background-color: var(--white) !important;
  color: var(--cool-green) !important;
}
.mat-mdc-button.mat-secondary.destructive {
  margin-left: 10px !important;
  font-family: "gilroy-semi-bold" !important;
  color: var(--red) !important;
  border: solid 2px var(--red) !important;
  background-color: var(--white);
}
.mat-secondary.mat-mdc-button.mat-secondary.destructive .mat-icon {
  height: 20px !important;
  width: 18px !important;
  cursor: pointer;
}
.mat-mdc-button.mat-secondary:hover {
  background-color: var(--white) !important;
  box-shadow: 0 4px 4px 0 rgba(206, 208, 211) !important;
}
.mat-mdc-button.mat-secondary:focus {
  background-color: var(--white) !important;
  box-shadow: 0 4px 4px 0 rgba(206, 208, 211) !important;
}
.mat-mdc-button.mat-secondary.secondary:hover {
  background-color: var(--white) !important;
  box-shadow: 0 4px 5px 0 rgba(13 187 125 / 28%) !important;
}
.mat-mdc-button.mat-secondary.secondary:focus {
  background-color: var(--white) !important;
  box-shadow: 0 4px 5px 0 rgba(13 187 125 / 28%) !important;
}
.mat-mdc-button.mat-secondary.destructive:hover {
  background-color: var(--white) !important;
  box-shadow: 0 4px 5px 0 rgba(224 49 49 / 28%) !important;
}
.mat-mdc-button.mat-secondary.destructive:focus {
  background-color: var(--white) !important;
  box-shadow: 0 4px 5px 0 rgba(224 49 49 / 28%) !important;
}
.mat-mdc-button.primary:hover {
  box-shadow: 0 4px 5px 0 rgb(13 187 125 / 28%) !important;
}
.mat-mdc-button.primary:focus {
  box-shadow: 0 4px 5px 0 rgb(13 187 125 / 28%) !important;
}
.mat-mdc-button.mat-secondary.secondary:active {
  color: #009355 !important;
  border: solid 2px #009355 !important;
  background-color: var(--white) !important;
  box-shadow: none !important;
}
.mat-mdc-button.mat-secondary:active {
  box-shadow: none !important;
}
.mat-mdc-button.mat-secondary.destructive:active {
  color: var(--white) !important;
  border: solid 2px var(--red5) !important;
  background-color: var(--red5) !important;
  box-shadow: none !important;
}
.destructive:active mat-icon.delete-line-icon .stroke-here {
  stroke: var(--white) !important;
}
.mat-mdc-button.primary {
  border: 2px solid var(--cool-green) !important;
  background-color: var(--cool-green) !important;
  color: var(--white) !important;
  border-radius: 5px !important;
}
.mat-mdc-button.primary:active {
  border: solid 2px #009355 !important;
  background-color: #009355 !important;
  box-shadow: none !important;
}
.mat-mdc-button.blue-i {
  background-color: var(--blue) !important;
  border: 1px solid var(--blue) !important;
  color: var(--white) !important;
}
.drop-icon {
  border-left: 1px solid var(--white) !important;
  margin-left: 15px;
  padding: 5px 0px;
}
.add-Icon {
  background-color: var(--light-green);
  justify-content: center;
  display: flex;
  width: 32px;
  height: 32px;
  align-items: center;
  margin-left: 12px;
  margin-right: -12px;
  border-radius: 5px;
}
.import-export-Icon {
  background-color: var(--light-green);
  justify-content: center;
  display: flex;
  width: 32px;
  height: 33px;
  align-items: center;
  margin-left: 12px;
  margin-right: -12px;
  border-radius: 5px 3px 3px 5px;
}
.import-export-Icon-xs {
  background-color: var(--cool-green);
  margin: 0px;
}
.add-Icon-xs {
  background-color: var(--cool-green);
  margin: 0px;
}
@media only screen and (max-width: 600px) {
  .add-Icon {
    background-color: var(--cool-green);
    margin: 0px;
  }
}
.mat-mdc-button.secondary.secondary-icon-button .mat-icon[svgicon=import-export] {
  height: 16px;
  width: 16px;
  opacity: 1;
  margin-left: 0px !important;
}
.mat-mdc-button.secondary[disabled] .import-export-Icon {
  background-color: var(--white) !important;
}
.mdc-button .mdc-button__label {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}
.mat-mdc-button.primary.primary-icon-button .mat-icon[svgicon=addIcon] {
  height: 16px;
  width: 16px;
  opacity: 1;
  margin-left: 0px !important;
}
.mat-mdc-button.primary.primary-icon-button .mdc-button__label {
  font-family: gilroy-regular;
}
.mat-mdc-button.primary[disabled] .add-Icon {
  background-color: #E7ECF4 !important;
}
.mat-mdc-button.secondary.secondary[disabled],
.mat-button[disabled][disabled] {
  font-family: "gilroy-semi-bold" !important;
  color: var(--silver2) !important;
  background-color: var(--white) !important;
  box-sizing: border-box;
  border: 2px solid var(--silver2) !important;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06) !important;
}
.mat-mdc-button.primary.create-icon {
  margin: 0px !important;
  padding: 0px !important;
}
.mat-secondary .mat-icon {
  height: 16px !important;
  width: 16px !important;
  margin-left: 0px !important;
}
.btn-with-more-btn {
  border-radius: 4px 0px 0px 4px !important;
  background-color: var(--cool-green);
  height: 32px;
  width: 25px;
  border: unset !important;
}
.btn-with-more {
  border-radius: 4px !important;
}
.btn-with-more:hover {
  box-shadow: 0 4px 5px 0 rgb(13 187 125 / 28%) !important;
}
.btn-with-more:active {
  box-shadow: none !important;
}
.btn-with-more .mat-mdc-button.primary:hover,
.btn-with-more button.primary:hover,
.btn-with-more .btn-with-more-btn.mat-mdc-button:hover {
  box-shadow: unset !important;
}
.btn-with-more .btn-with-more-btn.mat-mdc-button {
  padding: 0 !important;
  min-width: 25px !important;
  border-radius: 4px 0px 0px 4px !important;
  background-color: var(--cool-green);
}
.btn-with-more .btn-with-more-btn.mat-mdc-button:focus {
  box-shadow: 0 2px 4px 0 rgba(82, 2, 2, 0.35);
}
.btn-with-more .btn-with-more-btn.mat-mdc-button:hover {
  box-shadow: 0 4px 4px 0 rgba(82, 2, 2, 0.35);
}
.btn-with-more .btn-with-more-btn.mat-mdc-button:active {
  box-shadow: none !important;
}
.btn-with-more .mat-mdc-button.mat-primary:after {
  content: "";
  right: 0;
  position: absolute;
  height: calc(100% - 10px);
  color: white;
  z-index: 2;
  border-right: 1px solid;
}
.mat-mdc-button,
.mat-mdc-outlined-button.mat-mdc-button.mat-secondary.secondary {
  --mat-mdc-button-persistent-ripple-color: #ffff !important;
}
.wizard-btn {
  height: 36px !important;
  width: 115px;
  font-family: "gilroy-semi-bold" !important;
  font-size: 14px !important;
  font-weight: unset;
  text-align: center;
  position: relative;
  border-radius: 5px !important;
  line-height: 2.5;
  cursor: pointer;
  box-sizing: border-box;
}
.wizard-btn-primary {
  background-color: var(--cool-green) !important;
  color: var(--white);
  border: 2px solid var(--cool-green) !important;
  font-family: "gilroy-semi-bold" !important;
}
.wizard-btn-primary:hover {
  box-shadow: 0 4px 5px 0 rgb(13, 187, 125) !important;
}
.wizard-btn-primary:active {
  color: var(--white) !important;
  border: solid 2px #009355 !important;
  background-color: #009355 !important;
  box-shadow: none !important;
}
.wizard-btn-primary:after {
  top: 5px;
  right: -12px;
  transform: rotate(45deg);
  background-color: var(--cool-green) !important;
}
.wizard-btn-primary:after.wizard-btn-primary:hover {
  box-shadow: 0 4px 5px 0 rgb(13, 187, 125) !important;
}
.wizard-btn-primary:active.wizard-btn-primary:after {
  color: var(--white) !important;
  border: solid 2px #009355 !important;
  background-color: #009355 !important;
  box-shadow: none !important;
}
.wizard-btn-primary.disabled,
.wizard-btn-standard.disabled {
  font-family: "gilroy-semi-bold" !important;
  font-size: 14px !important;
  color: var(--silver2) !important;
  background-color: var(--white) !important;
  border: solid 2px var(--silver) !important;
  cursor: default;
  box-shadow: unset !important;
}
.wizard-btn-primary.disabled:after {
  box-shadow: 0 0.5px 2.5px #0000000f;
  border: solid 2px var(--silver) !important;
  border-left: none !important;
  border-bottom: none !important;
  top: 4px;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  padding: 8px;
  border: 1px solid var(--silver2);
  box-shadow: none !important;
  border-radius: 5px !important;
  height: 36px !important;
  max-width: 100%;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(#txtArea) {
  height: 36px !important;
}
#dtCloudApp .opp-input-hig-24.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(#txtArea) {
  height: 24px !important;
}
.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):hover {
  border: solid 1px var(--blue) !important;
  background-color: var(--white) !important;
}
.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):focus {
  border: solid 1px var(--blue) !important;
  background-color: var(--white) !important;
}
.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):active {
  border: solid 1px var(--cool-green) !important;
  background-color: var(--white) !important;
}
#dtCloudApp .ng-select .ng-select-container,
#dtCloudApp .ng-select.ng-select-single .ng-select-container {
  height: 36px;
  border: 1px solid var(--silver2);
  box-shadow: unset !important;
  border-radius: 5px;
  background-color: white;
}
#dtCloudApp .ng-select.ng-select-single:not(.ng-select-disabled) .ng-select-container:hover {
  border: solid 1px var(--blue);
  background-color: var(--white);
}
#dtCloudApp .ng-select.ng-select-single .ng-select-container:focus {
  border: solid 1px var(--blue) !important;
  background-color: var(--white) !important;
}
#dtCloudApp .ng-select.ng-select-single:not(.ng-select-disabled) .ng-select-container:active {
  border: solid 1px var(--cool-green) !important;
  background-color: var(--white) !important;
}
.ng-select .ng-arrow-wrapper .ng-arrow {
  border-color: var(--navy) transparent transparent !important;
  border-style: solid;
  border-width: 5px 5px 1.5px;
  border-radius: 2px;
}
.summary2 .ng-select .ng-arrow-wrapper .ng-arrow {
  border-color: #fff transparent transparent !important;
  border-style: solid;
  border-width: 7px 6px 2.5px;
  border-radius: 2px;
}
.summary3 .ng-select .ng-arrow-wrapper .ng-arrow {
  border-color: #fff transparent transparent !important;
  border-style: solid;
  border-width: 7px 6px 2.5px;
  border-radius: 2px;
}
.ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  border-color: transparent transparent var(--navy) !important;
  border-style: solid;
  border-width: 0 5px 5px;
  border-radius: 2px;
}
#dtCloudApp .task-detail-page .ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  border-color: transparent transparent var(--white) !important;
}
.summary2 .ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  border-color: transparent transparent #fff !important;
  border-style: solid;
  border-width: 0 6px 6px;
  border-radius: 2px;
}
.summary3 .ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  border-color: transparent transparent #fff !important;
  border-style: solid;
  border-width: 0 6px 6px;
  border-radius: 2px;
}
.mat-mdc-select {
  outline: 0;
  box-sizing: border-box;
  height: 36px !important;
  line-height: 36px !important;
  border: 1px solid var(--silver2);
  border-radius: 5px !important;
  padding: 0px 10px !important;
  font-family: "gilroy-semi-bold" !important;
  font-size: 14px !important;
  color: var(--gray2);
  margin-top: 5px;
  background-color: var(--white);
}
.mat-mdc-select:focus {
  border: solid 1px var(--cool-green) !important;
  background-color: var(--white) !important;
}
.mat-mdc-select:hover,
.mat-mdc-select[aria-expanded=true] {
  border: solid 1px var(--blue) !important;
  background-color: var(--white) !important;
}
.mat-mdc-select:active {
  border: solid 1px var(--cool-green) !important;
  background-color: var(--white) !important;
}
.color-select {
  border: none !important;
  box-shadow: none !important;
  background: none !important;
}
.color-select:not(.mat-select-open) {
  border: none !important;
}
.color-select .mat-mdc-select-arrow {
  opacity: 0 !important;
}
.color-select:hover .mat-mdc-select-arrow {
  opacity: 1 !important;
}
.color-select[aria-expanded=true] .mat-mdc-select-arrow {
  opacity: 1 !important;
}
.color-select:hover {
  border: 1px solid var(--blue) !important;
  background: var(--white) !important;
}
.mat-select .mat-mdc-select-arrow-wrapper .mat-mdc-select-arrow {
  border-color: var(--navy) transparent transparent !important;
  border-style: solid;
  border-width: 7px 6px 2.5px;
  border-radius: 2px;
}
.mat-mdc-select-arrow svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-color: var(--navy) transparent transparent !important;
  border-width: 7px 6px 2.5px !important;
  border-radius: 2px !important;
  fill: unset !important;
  display: none;
}
.mat-mdc-select-arrow {
  width: 12px !important;
  height: 12px !important;
  position: relative;
  background-image: url(/assets/icons/arrow-drop-down.svg);
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 2px;
}
.won-opportunity .mat-mdc-select-arrow {
  margin-top: 4px;
  background: url("./media/arrow-drop-down-white-WBES73GZ.svg") no-repeat !important;
}
.mat-form-field-appearance-outline .mat-form-field-outline {
  display: flex;
  position: absolute;
  top: 0.25em;
  left: 0;
  right: 0;
  bottom: 0;
}
.m-l-r {
  margin-left: 3px;
  margin-right: 3px;
}
.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.border-color {
  border: solid 1px var(--cool-green) !important;
  background-color: var(--white) !important;
}
.mat-mdc-slide-toggle-btn {
  max-width: 50px;
  --mat-slide-toggle-disabled-unselected-track-color: var(--white1) !important;
}
.mdc-switch .mat-mdc-slide-toggle-btn {
  width: var(--mat-slide-toggle-track-width);
}
.mat-mdc-slide-toggle-btn .mdc-switch .mdc-switch__track {
  height: 24px !important;
  border-radius: 24px !important;
  width: 56px !important;
}
.mdc-switch__shadow .mat-mdc-slide-toggle-btn {
  border-radius: inherit;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.mdc-switch:enabled .mdc-switch__shadow .mat-mdc-slide-toggle-btn {
  box-shadow: var(--mat-slide-toggle-handle-elevation-shadow);
}
.mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn {
  background-color: var(--white);
}
.mdc-switch:enabled .mdc-switch__shadow .mat-mdc-slide-toggle-btn2 {
  box-shadow: var(--mat-slide-toggle-handle-elevation-shadow);
}
.mat-mdc-slide-toggle-btn2 {
  max-width: 50px;
  --mat-slide-toggle-disabled-unselected-track-color: var(--white1) !important;
}
.mdc-switch .mat-mdc-slide-toggle-btn2 {
  width: var(--mat-slide-toggle-track-width);
}
.mat-mdc-slide-toggle-btn2 .mdc-switch .mdc-switch__track {
  height: 24px !important;
  border-radius: 24px !important;
  width: 56px !important;
}
.mdc-switch__shadow .mat-mdc-slide-toggle-btn2 {
  border-radius: inherit;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.mdc-switch:enabled .mdc-switch__shadow .mat-mdc-slide-toggle-btn2 {
  box-shadow: var(--mat-slide-toggle-handle-elevation-shadow);
}
.mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn2 {
  background-color: var(--white);
}
.mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn2 {
  background-color: var(--white);
}
.mat-mdc-slide-toggle-btn .mdc-switch--unselected .mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn {
  background-color: var(--silver2);
}
.mat-mdc-slide-toggle-btn .mdc-switch--unselected .mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn2 {
  background-color: var(--silver2);
}
.mdc-switch--disabled .mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn {
  background-color: var(--silver2) !important;
}
.mdc-switch--disabled .mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-toggle-btn2 {
  background-color: var(--silver2) !important;
}
.mat-mdc-slide-toggle-btn .mdc-switch--disabled .mdc-switch__track::after {
  color: var(--medium-gray) !important;
  border: 1px solid var(--silver2) !important;
  font-size: 12px;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch--disabled .mdc-switch__track::after {
  color: var(--medium-gray) !important;
  border: 1px solid var(--silver2) !important;
  font-size: 12px;
}
.mat-mdc-slide-toggle-btn .mdc-switch--disabled .mdc-switch__track::before {
  color: var(--medium-gray) !important;
  border: 1px solid var(--silver2) !important;
  font-size: 12px;
}
.mat-mdc-slide-toggle-btn .mdc-switch__track::after {
  content: "On";
  color: var(--white);
  display: flex;
  align-items: center;
  flex-direction: row;
  font-family: gilroy-semi-bold;
  font-size: 12px;
  padding-left: 8px;
}
.mat-mdc-slide-toggle-btn .mdc-switch__track::before {
  content: "Off";
  color: var(--navy);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border: 1px solid var(--silver2);
  font-family: gilroy-semi-bold;
  font-size: 12px;
  padding-right: 8px;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch--disabled .mdc-switch__track::before {
  color: var(--medium-gray) !important;
  border: 1px solid var(--silver2) !important;
  font-size: 12px;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch__track::after {
  content: "Yes";
  color: var(--white);
  display: flex;
  align-items: center;
  flex-direction: row;
  font-family: gilroy-semi-bold;
  font-size: 12px;
  padding-left: 8px;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch__track::before {
  content: "No";
  color: var(--navy);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border: 1px solid var(--silver2);
  font-family: gilroy-semi-bold;
  font-size: 12px;
  padding-right: 8px;
}
.mat-mdc-slide-toggle-btn .mat-mdc-slide-toggle .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle::after {
  background: var(--mat-slide-toggle-unselected-handle-color, #616161);
}
.mat-mdc-slide-toggle-btn.mat-mdc-slide-toggle-btn-boolean .mdc-switch__track::before {
  content: "false";
  padding-right: 5px;
}
.mat-mdc-slide-toggle-btn.mat-mdc-slide-toggle-btn-boolean .mdc-switch__track::after {
  content: "true";
  padding-left: 5px;
}
.mdc-switch__handle .mat-mdc-slide-toggle-btn {
  display: flex;
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: auto;
}
.mat-mdc-slide-toggle-btn2 .mat-mdc-slide-toggle .mdc-switch.mdc-switch--unselected:enabled .mdc-switch__handle::after {
  background: var(--mat-slide-toggle-unselected-handle-color, #616161);
}
.mat-mdc-slide-toggle-btn2.mat-mdc-slide-toggle-btn-boolean .mdc-switch__track::before {
  content: "false";
  padding-right: 5px;
}
.mat-mdc-slide-toggle-btn2.mat-mdc-slide-toggle-btn-boolean .mdc-switch__track::after {
  content: "true";
  padding-left: 5px;
}
.mdc-switch__handle .mat-mdc-slide-toggle-btn2 {
  display: flex;
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: auto;
}
#optional-locOrSys.systemOptionalDisabled .mdc-switch__handle {
  pointer-events: none !important;
}
.mdc-switch__handle-track .mat-mdc-slide-toggle-btn {
  height: 100%;
  pointer-events: none;
  position: absolute;
  top: 0;
  transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
  left: 0;
  right: auto;
  transform: translateX(0);
}
.mdc-switch .mdc-switch__handle .mat-mdc-slide-toggle-btn::before {
  background: var(--mat-slide-toggle-handle-surface-color);
}
.mdc-switch__handle .mat-mdc-slide-toggle-btn::before,
.mdc-switch__handle .mat-mdc-slide-toggle-btn::after {
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: inherit;
  box-sizing: border-box;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transition: background-color 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1), border-color 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
  z-index: -1;
}
.mdc-switch__handle-track .mat-mdc-slide-toggle-btn2 {
  height: 100%;
  pointer-events: none;
  position: absolute;
  top: 0;
  transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
  left: 0;
  right: auto;
  transform: translateX(0);
}
.mdc-switch .mdc-switch__handle .mat-mdc-slide-toggle-btn2::before {
  background: var(--mat-slide-toggle-handle-surface-color);
}
.mdc-switch__handle .mat-mdc-slide-toggle-btn2::before,
.mdc-switch__handle .mat-mdc-slide-toggle-btn2::after {
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: inherit;
  box-sizing: border-box;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transition: background-color 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1), border-color 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
  z-index: -1;
}
.mdc-switch.mdc-switch--unselected .mdc-switch__handle {
  margin-left: 2px !important;
}
.mdc-switch.mdc-switch--selected .mdc-switch__handle {
  margin-left: -2px !important;
}
.mat-mdc-slide-toggle-btn {
  --mat-slide-toggle-handle-elevation-shadow: unset;
  --mat-slide-toggle-disabled-selected-track-color: var(--white1);
}
.mat-mdc-slide-toggle-btn.mat-accent {
  --mat-slide-toggle-selected-hover-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-track-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-track-color: var(--green-blue);
  --mat-slide-toggle-selected-track-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-track-color: var(--green-blue);
}
.mdc-switch__track .mat-mdc-slide-toggle-btn::before {
  --mat-slide-toggle-unselected-focus-handle-color: var(--white);
  --mat-slide-toggle-unselected-focus-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-focus-track-color: var(--white);
  --mat-slide-toggle-unselected-handle-color: var(--white);
  --mat-slide-toggle-unselected-hover-handle-color: var(--white);
  --mat-slide-toggle-unselected-hover-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-hover-track-color: var(--white);
  --mat-slide-toggle-unselected-icon-color: var(--white);
  --mat-slide-toggle-unselected-pressed-handle-color: var(--white);
  --mat-slide-toggle-unselected-pressed-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-pressed-track-color: var(--white);
  --mat-slide-toggle-unselected-track-color: var(--white);
}
#dtCloudApp .mat-mdc-slide-toggle-btn .mdc-switch {
  --mat-slide-toggle-disabled-track-opacity: 1;
  --mat-slide-toggle-disabled-unselected-icon-opacity: 1;
  --mat-slide-toggle-state-layer-size: 16px;
  --mat-slide-toggle-track-width: 50px;
  --mat-slide-toggle-handle-height: 20px;
  --mat-slide-toggle-handle-shape: 24px;
  --mat-slide-toggle-handle-width: 20px;
}
.mat-mdc-slide-toggle-btn .mdc-switch__icons {
  height: 100%;
  position: relative;
  width: 100%;
  z-index: -1 !important;
}
#dtCloudApp .mat-mdc-slide-toggle-btn .mdc-switch {
  height: 24px !important;
  width: 56px !important;
  border-radius: 24px !important;
  background-repeat: no-repeat;
}
#dtCloudApp .mat-mdc-slide-toggle-btn .mdc-switch * {
  display: block !important;
}
.mat-mdc-slide-toggle-btn .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle::after {
  background: var(--white) !important;
}
.mat-mdc-slide-toggle-btn .mdc-switch:enabled .mdc-switch__track::before {
  background: var(--white) !important;
}
.mat-mdc-slide-toggle-btn2 {
  --mat-slide-toggle-handle-elevation-shadow: unset;
  --mat-slide-toggle-disabled-selected-track-color: var(--white1);
}
.mat-mdc-slide-toggle-btn2.mat-accent {
  --mat-slide-toggle-selected-hover-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-track-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-track-color: var(--green-blue);
  --mat-slide-toggle-selected-track-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-track-color: var(--green-blue);
}
.mdc-switch__track .mat-mdc-slide-toggle-btn2::before {
  --mat-slide-toggle-unselected-focus-handle-color: var(--white);
  --mat-slide-toggle-unselected-focus-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-focus-track-color: var(--white);
  --mat-slide-toggle-unselected-handle-color: var(--white);
  --mat-slide-toggle-unselected-hover-handle-color: var(--white);
  --mat-slide-toggle-unselected-hover-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-hover-track-color: var(--white);
  --mat-slide-toggle-unselected-icon-color: var(--white);
  --mat-slide-toggle-unselected-pressed-handle-color: var(--white);
  --mat-slide-toggle-unselected-pressed-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-pressed-track-color: var(--white);
  --mat-slide-toggle-unselected-track-color: var(--white);
}
#dtCloudApp .mat-mdc-slide-toggle-btn2 .mdc-switch {
  --mat-slide-toggle-disabled-track-opacity: 1;
  --mat-slide-toggle-disabled-unselected-icon-opacity: 1;
  --mat-slide-toggle-state-layer-size: 16px;
  --mat-slide-toggle-track-width: 50px;
  --mat-slide-toggle-handle-height: 20px;
  --mat-slide-toggle-handle-shape: 24px;
  --mat-slide-toggle-handle-width: 20px;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch__icons {
  height: 100%;
  position: relative;
  width: 100%;
  z-index: -1 !important;
}
#dtCloudApp .mat-mdc-slide-toggle-btn2 .mdc-switch {
  height: 24px !important;
  width: 56px !important;
  border-radius: 24px !important;
  background-repeat: no-repeat;
}
#dtCloudApp .mat-mdc-slide-toggle-btn2 .mdc-switch * {
  display: block !important;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle::after {
  background: var(--white) !important;
}
.mat-mdc-slide-toggle-btn2 .mdc-switch:enabled .mdc-switch__track::before {
  background: var(--white) !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn {
  max-width: 50px;
  --mat-slide-toggle-disabled-unselected-track-color: var(--white1);
}
.mdc-switch .mat-mdc-slide-dollar-percentage-toggle-btn {
  width: var(--mat-slide-toggle-track-width);
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch .mdc-switch__track {
  height: 24px !important;
  border-radius: 24px !important;
  width: 56px !important;
}
.mdc-switch__shadow .mat-mdc-slide-dollar-percentage-toggle-btn {
  border-radius: inherit;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.mdc-switch:enabled .mdc-switch__shadow .mat-mdc-slide-dollar-percentage-toggle-btn {
  box-shadow: var(--mat-slide-toggle-handle-elevation-shadow);
}
.mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-dollar-percentage-toggle-btn {
  background-color: var(--white);
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch--unselected .mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-dollar-percentage-toggle-btn {
  background-color: var(--silver2) !important;
}
.mdc-switch--disabled .mdc-switch__shadow .mdc-elevation-overlay .mat-mdc-slide-dollar-percentage-toggle-btn {
  background-color: var(--silver2) !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch--disabled .mdc-switch__track::after {
  color: var(--silver2) !important;
  border: 1px solid var(--silver2) !important;
  content: url("./media/toggle-disabled-GPTLG6FQ.svg");
  display: flex;
  align-items: center;
  flex-direction: row;
  padding-left: 0px;
  padding-top: 3.5px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__track::after {
  content: url("./media/toggle-percent-new-FWOV65LR.svg");
  display: flex;
  align-items: center;
  flex-direction: row;
  padding-left: 0px;
  padding-top: 3.5px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn [disabled] .mdc-switch__track [disabled]::after {
  content: url("./media/toggle-disabled-GPTLG6FQ.svg");
  display: flex;
  align-items: center;
  flex-direction: row;
  padding-left: 0px;
  padding-top: 3px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn[disabled] .mdc-switch__track ::after {
  content: url("./media/toggle-disabled-GPTLG6FQ.svg");
  display: flex;
  align-items: center;
  flex-direction: row;
  padding-left: 0px;
  padding-top: 3px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__track .toggle-currency1::after {
  visibility: hidden;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__track::before {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 1px;
  padding-top: 3px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn.mat-mdc-slide-dollar-percentage-toggle-btn-boolean .mdc-switch__track::before {
  content: "false";
  padding-right: 5px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn.mat-mdc-slide-dollar-percentage-toggle-btn-boolean .mdc-switch__track::after {
  content: "true";
  padding-left: 5px;
}
.mdc-switch__handle .mat-mdc-slide-dollar-percentage-toggle-btn {
  display: flex;
  pointer-events: auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: auto;
}
.mdc-switch__handle-track .mat-mdc-slide-dollar-percentage-toggle-btn {
  height: 100%;
  pointer-events: none;
  position: absolute;
  top: 0;
  transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
  left: 0;
  right: auto;
  transform: translateX(0);
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mat-mdc-slide-toggle .mdc-switch .mdc-switch__track {
  height: var(--mat-slide-toggle-track-height, 20px) !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mat-mdc-slide-toggle .mdc-switch .mdc-switch__track {
  border-radius: var(--mat-slide-toggle-track-shape, 20px) !important;
}
.mat-mdc-slide-toggle .mdc-switch .mdc-switch__track .mat-mdc-slide-dollar-percentage-toggle-btn {
  height: var(--mat-slide-toggle-track-height, 20px) !important;
}
.mat-mdc-slide-toggle .mdc-switch .mdc-switch__track .mat-mdc-slide-dollar-percentage-toggle-btn {
  border-radius: var(--mat-slide-toggle-track-shape, 20px) !important;
}
.mdc-switch .mdc-switch__handle .mat-mdc-slide-dollar-percentage-toggle-btn::before {
  background: var(--mat-slide-toggle-handle-surface-color);
}
.mdc-switch__handle .mat-mdc-slide-dollar-percentage-toggle-btn::before,
.mdc-switch__handle .mat-mdc-slide-dollar-percentage-toggle-btn::after {
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: inherit;
  box-sizing: border-box;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transition: background-color 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1), border-color 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
  z-index: -1;
}
.mdc-switch.mdc-switch--unselected .mdc-switch__handle {
  margin-left: 2px !important;
}
.mdc-switch.mdc-switch--selected .mdc-switch__handle {
  margin-left: -2px !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn {
  --mat-slide-toggle-handle-elevation-shadow: unset;
  --mat-slide-toggle-disabled-selected-track-color: var(--white1);
}
.mat-mdc-slide-dollar-percentage-toggle-btn.mat-accent {
  --mat-slide-toggle-selected-hover-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-track-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-state-layer-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-track-color: var(--green-blue);
  --mat-slide-toggle-selected-track-color: var(--green-blue);
  --mat-slide-toggle-selected-pressed-handle-color: var(--green-blue);
  --mat-slide-toggle-selected-focus-track-color: var(--green-blue);
}
.mdc-switch__track .mat-mdc-slide-dollar-percentage-toggle-btn::before {
  --mat-slide-toggle-unselected-focus-handle-color: var(--white);
  --mat-slide-toggle-unselected-focus-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-focus-track-color: var(--white);
  --mat-slide-toggle-unselected-handle-color: var(--white);
  --mat-slide-toggle-unselected-hover-handle-color: var(--white);
  --mat-slide-toggle-unselected-hover-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-hover-track-color: var(--white);
  --mat-slide-toggle-unselected-icon-color: var(--white);
  --mat-slide-toggle-unselected-pressed-handle-color: var(--white);
  --mat-slide-toggle-unselected-pressed-state-layer-color: var(--white);
  --mat-slide-toggle-unselected-pressed-track-color: var(--white);
  --mat-slide-toggle-unselected-track-color: var(--white);
}
#dtCloudApp .mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch {
  --mat-slide-toggle-disabled-track-opacity: 1;
  --mat-slide-toggle-disabled-unselected-icon-opacity: 1;
  --mat-slide-toggle-state-layer-size: 16px;
  --mat-slide-toggle-track-width: 50px;
  --mat-slide-toggle-handle-height: 16px;
  --mat-slide-toggle-handle-shape: 24px;
  --mat-slide-toggle-handle-width: 16px;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__icons {
  height: 100%;
  position: relative;
  width: 100%;
  z-index: -1 !important;
}
#dtCloudApp .mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch {
  height: 24px !important;
  width: 56px !important;
  border-radius: 24px !important;
  background-repeat: no-repeat;
}
#dtCloudApp .mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch * {
  display: block !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle::after {
  background: var(--white) !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch:enabled .mdc-switch__track::before {
  background: rgba(13, 187, 125, 0.2) !important;
  border: 1px solid var(--cool-green) !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch:enabled .mdc-switch__track::after {
  background: rgba(0, 122, 204, 0.2) !important;
  border: 1px solid var(--blue) !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__ripple {
  position: relative !important;
}
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__handle::before,
.mat-mdc-slide-dollar-percentage-toggle-btn .mdc-switch__handle::after {
  position: relative !important;
  border: 0px solid rgba(0, 0, 0, 0) !important;
}
.mat-mdc-slide-toggle .mdc-switch:enabled .mdc-switch__shadow {
  box-shadow: none !important;
}
.toggle-display {
  display: contents !important;
}
.toggle-currency-symbol {
  position: absolute;
  left: 32px;
  top: 2px;
  line-height: 21px;
  cursor: pointer;
  background-color: var(--green-blue);
  color: #fff;
  text-align: center;
  border-radius: 15px;
  width: 22px;
  height: 20px;
  font-size: 12px;
}
.toggle-currency-visibility-hidden {
  visibility: hidden !important;
}
.opacity-toggle {
  opacity: 20% !important;
}
.mat-button-toggle-standalone.mat-button-toggle-appearance-standard,
.mat-button-toggle-group-appearance-standard {
  border-radius: 24px !important;
}
.mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
  min-width: 125px;
  width: auto;
}
.button-toggle-new .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
  min-width: 74px !important;
  padding: 0 16px !important;
}
.mat-mdc-slide-toggle {
  --mat-slide-toggle-unselected-handle-color: var(--medium-gray) !important;
  --mat-slide-toggle-unselected-hover-handle-color: var(--medium-gray) !important;
  --mat-slide-toggle-unselected-focus-handle-color: var(--medium-gray) !important;
  --mat-slide-toggle-unselected-pressed-handle-color: var(--medium-gray) !important;
}
.mdc-switch:disabled .mdc-switch__track::before {
  background: var(--light-gray2) !important;
}
.mdc-switch:disabled .mdc-switch__track::after {
  background: var(--light-gray2) !important;
}
.mat-mdc-button.primary[disabled],
.mat-button[disabled][disabled] {
  font-family: gilroy-medium;
  color: #BDC4C7 !important;
  background-color: var(--white) !important;
  box-sizing: border-box;
  border: 2px solid #BDC4C7 !important;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06) !important;
}
.mat-mdc-button.mat-secondary.destructive[disabled] {
  font-family: gilroy-medium;
  color: #BDC4C7 !important;
  background-color: var(--white) !important;
  box-sizing: border-box;
  border: 2px solid #BDC4C7 !important;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06) !important;
}
.mat-mdc-button.primary[disabled] mat-icon svg path,
.mat-button[disabled][disabled] mat-icon svg path {
  fill: var(--medium-gray) !important;
}
.btn-with-more .btn-with-more-btn.mat-mdc-button[disabled] {
  font-family: gilroy-medium;
  color: #BDC4C7 !important;
  background-color: var(--white) !important;
  box-sizing: border-box;
  border: 2px solid #BDC4C7 !important;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06) !important;
}
.btn-with-more .btn-with-more-btn.mat-mdc-button[disabled] mat-icon svg path,
.mat-button[disabled][disabled] mat-icon svg path {
  fill: var(--medium-gray) !important;
}
.input-disabled .mat-mdc-input-element:disabled {
  background: white;
}
.ng-select.ng-select-disabled > .ng-select-container,
.mat-mdc-input-element:disabled {
  background-color: var(--light-gray2) !important;
  color: rgba(0, 0, 0, 0.38) !important;
}
.create-new-icon {
  min-width: 36px !important;
  max-width: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}
.create-new-icon-align {
  align-items: center;
  display: flex;
}
.mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
  padding: 0 16px !important;
}
.mat-button-toggle-group-appearance-standard.theme-gray {
  height: 32px;
  box-shadow: 0 0 4px 0 rgba(1, 22, 47, 0.16) !important;
  border: unset;
  background-color: var(--color-divider);
}
.mat-button-toggle-group-appearance-standard.theme-gray .mat-button-toggle-appearance-standard.mat-button-toggle-checked {
  background-color: var(--color-white) !important;
  color: var(--color-message);
  border-radius: 24px;
  box-shadow: 0 0 4px 0 rgba(1, 22, 47, 0.16);
}
.mat-button-toggle-group-appearance-standard.theme-gray.ai-search .mat-button-toggle-appearance-standard.mat-button-toggle-checked .mat-button-toggle-label-content {
  background:
    linear-gradient(
      225deg,
      #7AEB59 0%,
      #0095FF 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.mat-button-toggle-group-appearance-standard.theme-gray .mat-button-toggle-appearance-standard {
  background-color: #E7ECF4;
  color: var(--color-text-primary);
}
.mat-button-toggle-group-appearance-standard.theme-gray .mat-button-toggle-appearance-standard .mat-button-toggle-label-content {
  line-height: 36px;
  font-size: 14px;
}
.filter-container-new .mat-mdc-button .mat-mdc-button-persistent-ripple::before {
  background-color: transparent !important;
}
.reset-filter-btn {
  color: var(--red) !important;
}
.mat-button-toggle-group-appearance-standard.theme-gray .mat-button-toggle-appearance-standard.mat-button-toggle-checked {
  font-family: gilroy-semi-bold !important;
}
.mat-button-toggle-group-appearance-standard.theme-gray .mat-button-toggle-appearance-standard {
  font-family: gilroy-regular !important;
}
.mat-button-toggle-group-appearance-standard.theme-gray {
  height: 36px !important;
}

/* src/assets/css/dark-mode.css */
html.dark-mode {
  --color-dark-mode-background: var(--color-dark-mode);
  --mat-sidenav-container-background-color: var(--color-dark-mode);
  --mat-sidenav-container-divider-color: var(--white);
  --mat-sidenav-content-text-color: var(--color-dark-mode);
  --mat-sidenav-content-background-color: var(--color-dark-mode);
  --mat-list-item-color: var(--white);
  --page-header-color: var(--white);
  --body-text: var(--white);
  --page-header-background-color: var(--color-dark-mode);
  --icon-color: var(--white);
  --grid-header: var(--color-dark-mode);
}
.dark-mode #dtCloudApp .ng-select .ng-select-container,
.dark-mode #dtCloudApp .ng-select.ng-select-single .ng-select-container,
.mat-mdc-form-field.ng-valid .mat-mdc-form-field-infix .mat-mdc-input-element {
  background-color: var(--color-dark-mode-background) !important;
  color: var(--body-text) !important;
}
.content-primary,
.primary-text,
.primary-text-12px,
.title,
#dtCloudApp .ng-select .ng-select-container,
.ng-select .ng-select-container .ng-value-container .ng-input > input,
.dt-sortable-table-body,
.mat-mdc-list-base .mat-mdc-list-item,
.page-header .title-txt,
.step-header .title-txt {
  color: var(--body-text) !important;
}
#settings-navigator.mat-mdc-list-base .mat-mdc-list-item.active:not(.mat-list-item-sub),
#settings-navigator.mat-mdc-list-base .mat-mdc-list-item:not(.mat-list-item-sub):hover,
#settings-navigator.mat-mdc-list-base .mat-mdc-list-item.mat-list-item-sub.active,
#settings-navigator.mat-mdc-list-base .mat-mdc-list-item.mat-list-item-sub:hover {
  color: var(--cool-green) !important;
}
.page-header,
.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):active {
  background-color: var(--color-dark-mode-background) !important;
}
#dtCloudApp .ng-select.ng-select-single:not(.ng-select-disabled) .ng-select-container:hover,
#dtCloudApp .ng-select.ng-select-single .ng-select-container:focus,
#dtCloudApp .ng-select.ng-select-single:not(.ng-select-disabled) .ng-select-container:active {
  background-color: var(--color-dark-mode-background);
}

/* src/assets/css/tab.css */
.mat-mdc-tab-group,
.mat-mdc-tab-nav-bar {
  --mat-tab-active-indicator-color: #1DB77A;
  --mat-tab-disabled-ripple-color: #0E1F38;
  --mat-tab-pagination-icon-color: #0E1F38;
  --mat-tab-inactive-label-text-color: #0E1F38;
  --mat-tab-active-label-text-color: #0E1F38;
  --mat-tab-active-ripple-color: #1DB77A;
  --mat-tab-inactive-ripple-color: #0E1F38;
  --mat-tab-inactive-focus-label-text-color: #0E1F38;
  --mat-tab-inactive-hover-label-text-color: #0E1F38;
  --mat-tab-active-focus-label-text-color: #1DB77A;
  --mat-tab-active-hover-label-text-color: #0E1F38;
  --mat-tab-active-focus-indicator-color: #1DB77A;
  --mat-tab-active-hover-indicator-color: #1DB77A;
  --mat-tab-label-text-size: 14px !important;
  --mat-tab-label-text-font: gilroy-regular !important;
  --mat-tab-active-indicator-height: 4px !important;
  --mat-tab-container-height: 41px !important;
  --mat-tab-active-indicator-shape: 4px !important;
}
.mdc-tab {
  padding-right: 16px !important;
  padding-left: 24px !important;
  min-width: 60px !important;
}
.mat-mdc-tab-header {
  --mat-tab-container-height: 41px;
}
span.mdc-tab__content {
  height: 41px !important;
}
.mat-mdc-tab-list {
  height: 41px !important;
}
.dt-dialog-toolbar.tab-nav-toolbar {
  height: 37px !important;
  min-height: 37px !important;
}
.mat-mdc-tab.mdc-tab--active:focus .mdc-tab__text-label {
  color: #0E1F38 !important;
}
.mat-mdc-tab.mdc-tab--active .mdc-tab__text-label {
  font-family: gilroy-semi-bold;
}
.mat-mdc-tab-link.mdc-tab--active .mdc-tab__text-label {
  font-family: gilroy-semi-bold;
}
.mdc-tab__content .mat-mdc-standard-chip {
  --mat-chip-container-shape-radius: 0px;
}
.mdc-tab__content .mdc-tab__content.mat-mdc-chip.mat-mdc-standard-chip {
  --mat-chip-container-height: 0px;
}
.mdc-tab__content .mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled) .mdc-evolution-chip__text-label {
  min-width: 20px;
  min-height: 20px;
  line-height: 20px;
  text-align: center;
  padding: 0px 4px;
  font-family: gilroy-semi-bold;
  font-size: 12px;
  color: #2B7BBF !important;
  background-color: rgba(43, 123, 191, 20%) !important;
  border-radius: 2px;
}
.mdc-tab__content .mat-mdc-standard-chip:not(.mdc-evolution-chip--disabled) {
  background-color: unset !important;
}
.mdc-tab__content .mat-mdc-standard-chip {
  height: 0px !important;
}
.mdc-tab__content .mat-mdc-standard-chip .mdc-evolution-chip__action--primary {
  padding-right: 0px !important;
}

/* src/styles.css */
div.flex-column > div.flex-auto,
.flex-base-auto {
  flex: 1 0 auto !important;
}
:root {
  --black: #000000;
  --blue: #007acc;
  --blue1: #89b9e9;
  --blue2: #267ed6;
  --blue3: #0f4d8c;
  --cool-green: #0dbb7d;
  --cool-grey-three: #f7f9fb;
  --cool-grey-two: #8a94a0;
  --cool-grey: #a3a6aa;
  --dark-blue: #072548;
  --slate-blue: #1d2836;
  --deep-blue: #041932;
  --gray1: #7e8a96;
  --gray2: #4a525b;
  --gray3: #1a2026;
  --green-blue: #00b575;
  --green-blue2: #00a96e;
  --green1: #93dac1;
  --green3: #097650;
  --light-green: #3dc997;
  --grid-item-gray: #f6f7f9;
  --light-cyan: #dbf5ec;
  --light-gray: #fbfcfd;
  --light-gray2: #eaeced;
  --light-gray3: #f4f5f6;
  --medium-gray: #6f7782;
  --navy: #01162f;
  --orange: #fb8030;
  --orange1: #ffd382;
  --orange2: #ffa600;
  --orange3: #f95e01;
  --pink: #ee5d8c;
  --pink1: #d6386d;
  --purple: #7225ae;
  --purple1: #dbc8e9;
  --purple2: #9f6fc3;
  --purple3: #7225ae;
  --purple4: #8368ba;
  --red: #e03131;
  --red1: #f4805f;
  --red4: #c22d0a;
  --red5: #b80909;
  --silver-25: rgba(206, 208, 211, 0.25);
  --silver: #ced0d3;
  --silver2: #bdc4c7;
  --skeleton-color: #f3f3f4;
  --slate-grey: #5f6874;
  --white: #ffffff;
  --yellow: #fbdd30;
  --yellow3: #fce31f;
  --selected-green: #0dbb7d1a;
  --color-text-primary: #01162f;
  --color-text-secondary: #6f7782;
  --color-button-primary: #0dbb7d;
  --color-message: #007acc;
  --color-alert: #D23434;
  --color-warning-high: #fb8030;
  --color-warning-low: #fbdd30;
  --color-divider: #eaeced;
  --color-divider-dark: #bdc4c7;
  --color-background: #f9fcff;
  --color-white: #ffffff;
  --color-blue1: #89b9e9;
  --color-blue2: #267ed6;
  --color-blue3: #0f4d8c;
  --color-grey1: #6f7782;
  --color-grey2: #4a525b;
  --color-grey3: #1a2026;
  --color-green1: #93dac1;
  --color-green2: #0dbb7d;
  --color-green3: #097650;
  --color-orange1: #ffd382;
  --color-orange2: #ffa600;
  --color-orange3: #f95e01;
  --color-purple1: #dbc8e9;
  --color-purple2: #9f6fc3;
  --color-purple3: #7225ae;
  --color-red1: #f4805f;
  --color-red2: #d1380c;
  --color-yellow1: #fbdd30;
  --color-planning-blue1: #59cedf;
  --color-planning-blue2: #007acc;
  --color-planning-pink1: #ee5d8c;
  --color-planning-orange1: #feb25f;
  --color-planning-purple1: #8d70c8;
  --color-dark-mode: #161c22;
  --color-neutral-600: #0E1F38;
  --color-neutral-500: #52627A;
  --color-neutral-400: #C4CCDA;
  --color-neutral-300: #E7ECF4;
  --color-neutral-200: #FAFCFF;
  --color-neutral-100: #FFFFFF;
  scrollbar-width: thin;
}
html {
  --mat-button-toggle-shape: 24px;
  --mat-button-toggle-height: 36px;
  --mat-button-toggle-background-color: var(--white);
  --mat-button-toggle-text-color: var(--cool-green);
  --mat-button-toggle-text-font: var(--gilroy-medium);
  --mat-button-toggle-selected-state-text-color: var(--white);
  --mat-button-toggle-selected-state-background-color: var(--cool-green);
  --mat-button-toggle-divider-color: var(--light-gray2);
  --mat-form-field-filled-label-text-color: var(--navy);
  --mat-sidenav-content-background-color: var(--white);
  --mat-form-field-filled-hover-label-text-color: unset;
  --mat-form-field-filled-disabled-label-text-color: unset;
  --mat-card-outlined-outline-color: var(--color-divider-dark);
  --mat-card-outlined-container-shape: 12px;
  --mat-card-outlined-container-color: var(--color-white);
  --mat-card-outlined-container-elevation: unset;
  --mat-divider-color: var(--color-divider);
  --mat-menu-item-hover-state-layer-color: rgba(0, 122, 204, 0.08);
  --mat-option-selected-state-layer-color: unset;
  --mat-option-focus-state-layer-color: rgba(0, 122, 204, 0.08);
  --mat-option-hover-state-layer-color: rgba(0, 122, 204, 0.08);
  --mat-autocomplete-container-elevation-shadow: 0px 2px 12px 0px rgba(1, 22, 47, 0.16);
  --mat-option-label-text-color: var(--color-text-primary);
  --mat-option-label-text-font: gilroy-regular;
  --mat-option-label-text-size: 14px;
  --ng-option-text-color: var(--color-text-primary);
  --ng-option-text-font: gilroy-regular;
  --ng-option-text-font-size: 14px;
  --ng-option-selected-text-color: var(--color-message);
  --ng-option-selected-text-font: gilroy-semi-bold;
  --color-dark-mode-background: var(--white);
  --page-header-color: var(--navy);
  --icon-color: var(--navy);
  --body-text: var(--navy);
  --mat-checkbox-state-layer-size: 20px;
}
html .mat-mdc-slide-toggle.mat-accent {
  --mat-slide-toggle-selected-focus-state-layer-color: var(--color-button-primary);
  --mat-slide-toggle-selected-handle-color: var(--color-button-primary);
  --mat-slide-toggle-selected-hover-state-layer-color: var(--color-button-primary);
  --mat-slide-toggle-selected-pressed-state-layer-color: var(--color-button-primary);
  --mat-slide-toggle-selected-focus-handle-color: var(--color-button-primary);
  --mat-slide-toggle-selected-hover-handle-color: var(--color-button-primary);
  --mat-slide-toggle-selected-pressed-handle-color: var(--color-button-primary);
  --mat-slide-toggle-selected-focus-track-color: var(--color-button-primary);
  --mat-slide-toggle-selected-hover-track-color: var(--color-button-primary);
  --mat-slide-toggle-selected-pressed-track-color: var(--color-button-primary);
  --mat-slide-toggle-selected-track-color: var(--color-button-primary);
  --mat-slide-toggle-selected-track-color: var(--color-button-primary);
}
* {
  outline: none;
  box-sizing: border-box;
  font-weight: unset !important;
}
body {
  margin: 0;
  font-weight: unset !important;
  user-select: unset !important;
  -webkit-user-select: unset !important;
}
.installer-view,
.mat-drawer-content.installer-view {
  max-width: 768px;
  margin: 0 auto !important;
}
.mat-drawer-content:has(.service-call-detailView),
.mat-drawer-content:has(.worksummary-detailView),
.mat-drawer-content:has(.scReschedule-detailView) {
  max-height: 100vh !important;
  min-height: 100vh !important;
}
.installer-user-btn {
  position: absolute;
  top: 7px;
  right: 50px;
  z-index: 2;
}
body,
.mat-mdc-card,
.mat-mdc-form-field,
.mat-drawer-container {
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
}
.mat-drawer-container {
  background-color: var(--white);
}
h1,
h2,
h3 {
  margin: 0;
  font-family: gilroy-semi-bold;
  line-height: 1;
  color: var(--navy);
}
h1,
.h1 {
  font-size: 34px;
}
h2,
.h2 {
  font-size: 22px;
}
h3,
.h3 {
  font-size: 18px;
}
.dt-header {
  color: var(--navy);
  font-family: gilroy-semi-bold;
  line-height: 1;
}
.navigation-header {
  font-size: 24px;
}
.dialog-header {
  font-size: 26px;
}
.section-header {
  font-size: 18px;
}
.section-header-14px {
  font-size: 14px;
}
mat-card h3 {
  margin: 14px 0;
}
li {
  margin-bottom: 10px;
  margin: 7px 0px;
}
ul {
  list-style-type: disc;
  display: block;
  min-height: unset;
  padding: 0;
  margin: 0;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 40px;
}
.material-icons {
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}
img {
  max-width: 100%;
  max-height: 100%;
}
.fill-children * {
  height: 100%;
}
.fill-children .height-100 {
  height: 100% !important;
}
.height-100 {
  height: 100% !important;
}
.wysiwig-content h1,
.wysiwig-content h2,
.wysiwig-content h3,
.wysiwig-content h4,
.wysiwig-content h5,
.wysiwig-content h6 {
  margin: 0 !important;
}
.accept-cookies-container {
  border-bottom: 0;
  bottom: 10px;
  top: auto;
  z-index: 2;
  position: fixed;
  left: 50%;
  transform: translate(-50%, 0%);
  margin: 0 auto;
}
.accept-cookies-content {
  background: #072548;
  margin: 0 auto;
  max-width: 900px;
  padding: 20px;
  box-shadow: rgb(0 0 0 / 26%) 0px 2px 4px 0px, rgb(0 0 0 / 27%) 0px 12px 25px 0px;
  border-radius: 4px 4px 0 0;
  color: white;
}
.cookiesacceptBtn {
  background: var(--white);
  width: 70px;
  font-size: 15px;
  padding: 6px;
  font-family: gilroy-medium;
  border: 2px solid #eaeced;
  cursor: pointer;
}
@media (min-width: 769px) {
  .accept-cookies-content {
    width: calc(100vw - 110px);
  }
}
.installer-view-cookie-content .accept-cookies-content {
  max-width: 768px;
}
.accept-cookies-content > div {
  line-height: 1.5;
  font-size: 15px;
}
.accept-cookies-content .white {
  margin-right: 16px;
  height: 14px;
  width: 14px;
  margin-top: 3px;
  cursor: pointer;
}
.ng-star-inserted h1 {
  font-size: 2em;
}
.ng-star-inserted ol,
.ng-star-inserted ul:not(.ql-mention-list) {
  padding-left: 1.5em;
  margin-block-start: 0em;
  margin-block-end: 0em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.ng-star-inserted ol > li,
.ng-star-inserted ul > li {
  list-style-type: none;
}
.ng-star-inserted ul > li:not(.ql-mention-list-item)::before {
  content: "\2022";
}
.ng-star-inserted ul[data-checked=true],
.ng-star-inserted ul[data-checked=false] {
  pointer-events: none;
}
.ng-star-inserted ul[data-checked=true] > li *,
.ng-star-inserted ul[data-checked=false] > li * {
  pointer-events: all;
}
.ng-star-inserted ul[data-checked=true] > li::before,
.ng-star-inserted ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ng-star-inserted ul[data-checked=true] > li::before {
  content: "\2611";
}
.ng-star-inserted ul[data-checked=false] > li::before {
  content: "\2610";
}
.ng-star-inserted li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ng-star-inserted li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ng-star-inserted li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ng-star-inserted ol li:not(.ql-direction-rtl),
.ng-star-inserted ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ng-star-inserted ol li.ql-direction-rtl,
.ng-star-inserted ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ng-star-inserted ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ng-star-inserted ol li:before {
  content: counter(list-0, decimal) ". ";
}
.ng-star-inserted ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ng-star-inserted ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) ". ";
}
.ng-star-inserted ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ng-star-inserted ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) ". ";
}
.ng-star-inserted ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ng-star-inserted ol li.ql-indent-3:before {
  content: counter(list-3, decimal) ". ";
}
.ng-star-inserted ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ng-star-inserted ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) ". ";
}
.ng-star-inserted ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ng-star-inserted ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) ". ";
}
.ng-star-inserted ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ng-star-inserted ol li.ql-indent-6:before {
  content: counter(list-6, decimal) ". ";
}
.ng-star-inserted ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ng-star-inserted ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) ". ";
}
.ng-star-inserted ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ng-star-inserted ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ng-star-inserted ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) ". ";
}
.ng-star-inserted ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ng-star-inserted ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ng-star-inserted ol li.ql-indent-9:before {
  content: counter(list-9, decimal) ". ";
}
.ql-indent-1:not(.ql-direction-rtl) {
  margin-left: 4.5em !important;
  padding-left: 0em !important;
}
.ql-indent-2:not(.ql-direction-rtl) {
  margin-left: 7.5em !important;
  padding-left: 0em !important;
}
.ql-indent-3:not(.ql-direction-rtl) {
  margin-left: 10.5em !important;
  padding-left: 0em !important;
}
.ql-indent-4:not(.ql-direction-rtl) {
  margin-left: 13.5em !important;
  padding-left: 0em !important;
}
.ql-indent-5:not(.ql-direction-rtl) {
  margin-left: 16.5em !important;
  padding-left: 0em !important;
}
.ql-indent-6:not(.ql-direction-rtl) {
  margin-left: 19.5em !important;
  padding-left: 0em !important;
}
.ql-indent-7:not(.ql-direction-rtl) {
  margin-left: 22.5em !important;
  padding-left: 0em !important;
}
.ql-indent-8:not(.ql-direction-rtl) {
  margin-left: 25.5em !important;
  padding-left: 0em !important;
}
.ql-align-center {
  text-align: center;
}
.ql-align-justify {
  text-align: justify !important;
}
.ql-align-right {
  text-align: right;
}
.breadcrumb ul,
.tourForm ul,
.breadcrumb ol,
.tourForm ol,
ul.no-style,
ol.no-style {
  list-style: none;
  padding: 0px;
  margin: 0px;
}
.ng-star-inserted ol.no-style li,
.ng-star-inserted ul.no-style li {
  padding: 0;
}
.ql-editor ol {
  counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li:not([class*=ql-indent-]) + li.ql-indent-1 {
  counter-set: list-1 1;
}
.ql-editor ol li.ql-indent-1 + li.ql-indent-2 {
  counter-set: list-2 1;
}
.ql-editor ol li.ql-indent-2 + li.ql-indent-3 {
  counter-set: list-3 1;
}
.ql-editor ol li.ql-indent-3 + li.ql-indent-4 {
  counter-set: list-4 1;
}
.ql-editor ol li.ql-indent-4 + li.ql-indent-5 {
  counter-set: list-5 1;
}
.ql-editor ol li.ql-indent-5 + li.ql-indent-6 {
  counter-set: list-6 1;
}
.ql-editor ol li.ql-indent-6 + li.ql-indent-7 {
  counter-set: list-7 1;
}
.ql-editor ol li.ql-indent-7 + li.ql-indent-8 {
  counter-set: list-8 1;
}
.ql-editor ol li.ql-indent-8 + li.ql-indent-9 {
  counter-set: list-9 1;
}
.ql-editor ol li:not([class*=ql-indent-]) + li.ql-indent-2 {
  counter-set: list-2 1;
}
.ql-editor ol li:not([class*=ql-indent-]) + li.ql-indent-3 {
  counter-set: list-3 1;
}
.ql-editor ol li:not([class*=ql-indent-]) + li.ql-indent-4 {
  counter-set: list-4 1;
}
.ql-editor ol li.ql-indent-1 + li.ql-indent-3 {
  counter-set: list-3 1;
}
.ql-editor ol li.ql-indent-1 + li.ql-indent-4 {
  counter-set: list-4 1;
}
.ql-editor ol li.ql-indent-2 + li.ql-indent-4 {
  counter-set: list-4 1;
}
a,
.hover-link:hover {
  cursor: pointer;
  color: var(--cool-green);
  font-size: 13px;
  font-weight: unset;
  font-family: gilroy-semi-bold;
  outline: none;
  text-decoration: unset;
  line-height: normal !important;
}
a.use-text-decoration-line {
  text-decoration-line: underline;
}
.hover-bg-green:hover {
  background-color: rgba(13, 187, 125, 0.1);
}
.empty-grid-message {
  padding: 40px 0px;
  text-align: center;
}
.toDo-empty-grid-message {
  padding: 32px;
  text-align: center;
}
.caption {
  color: var(--cool-grey);
  font-family: gilroy-medium;
}
input::-webkit-input-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-regular !important;
  font-size: 13px !important;
}
input:-moz-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-regular !important;
  font-size: 13px !important;
}
input::-moz-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-regular !important;
  font-size: 13px !important;
}
input:-ms-input-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-regular !important;
  font-size: 13px !important;
}
textarea::-webkit-input-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-regular !important;
  font-size: 13px !important;
}
textarea:-moz-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-medium !important;
  font-size: 13px !important;
}
textarea::-moz-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-medium !important;
  font-size: 13px !important;
}
textarea:-ms-input-placeholder {
  color: var(--medium-gray) !important;
  font-family: gilroy-medium !important;
  font-size: 13px !important;
}
.placeholder-size-27::-webkit-input-placeholder {
  font-size: 27px !important;
}
.placeholder-size-27:-moz-placeholder {
  font-size: 27px !important;
}
.placeholder-size-27::-moz-placeholder {
  font-size: 27px !important;
}
.placeholder-size-27:-ms-input-placeholder {
  font-size: 27px !important;
}
.mat-sort-header-button,
.text-uppercase {
  text-transform: uppercase;
}
.align-right,
.align-right .mat-sort-header-container,
.align-right.dt-cell {
  text-align: right;
  align-items: flex-end;
  justify-content: flex-end;
}
.align-center,
.align-center .mat-sort-header-container,
.align-center.dt-cell {
  text-align: center !important;
  align-items: center;
  justify-content: center;
}
.align-left {
  text-align: left !important;
}
.font-medium {
  font-family: gilroy-medium;
}
.mat-divider.mat-divider-vertical {
  border-right-color: var(--light-gray2);
  opacity: 1;
}
.divider {
  border-bottom: 1px solid var(--silver);
}
.mat-mdc-tooltip {
  opacity: 0.88 !important;
  --mat-tooltip-container-color: var(--navy);
}
.mdc-tooltip__surface {
  font-family: gilroy-semi-bold !important;
  letter-spacing: 0.18px !important;
  font-size: 12px !important;
  padding: 8px 12px !important;
  min-width: 80px;
  box-shadow: 0px 2px 4px rgba(1, 22, 47, 0.16);
}
.tooltip-list {
  white-space: pre;
  text-align: left;
  background: var(--white);
  box-shadow: 0px 0px 24px rgba(1, 22, 47, 0.08);
  border-radius: 4px;
  color: var(--color-text-primary) !important;
  font-family: gilroy-semi-bold;
  letter-spacing: 0.18px;
  font-size: 12px;
  padding: 8px 12px !important;
  min-width: 80px;
  opacity: 0.88 !important;
}
.mat-snack-bar {
  border-radius: 5px !important;
  background-color: #323232;
  box-shadow: 0 7px 16px 0 rgba(0, 0, 0, 0.21);
  color: var(--white);
}
.mat-mdc-simple-snack-bar {
  font-size: 15px;
  font-family: gilroy-semi-bold;
}
.mat-mdc-snack-bar-action,
.green-mandatory {
  color: var(--cool-green) !important;
}
.no-border {
  border: none !important;
}
.mat-mdc-input-element.no-border {
  box-shadow: unset !important;
}
.mat-mdc-select.no-border,
.border-unset {
  border: unset !important;
  border-radius: unset !important;
  box-shadow: unset !important;
}
@media (max-width: 599px) {
  .no-border-xs {
    border: none !important;
    box-shadow: unset !important;
  }
  .accept-cookies-container {
    width: 100%;
  }
  * ::-webkit-scrollbar {
    width: 0 !important;
  }
}
@media (max-width: 599px) {
  .close-btn {
    margin-left: 1px !important;
    margin-top: 0px !important;
    border: solid 0.5px var(--silver);
  }
}
.fill-page {
  height: 100%;
  min-height: 100%;
  min-width: 100%;
  width: 100%;
  flex-direction: row;
  box-sizing: border-box;
}
.selected-row,
.active-row {
  background-color: var(--light-gray2);
}
.cursor-pointer {
  cursor: pointer !important;
}
.cursor-default {
  cursor: default !important;
}
mat-slide-toggle.disabled-mode {
  opacity: 0.7;
}
.disabled-mode {
  pointer-events: none;
}
.disabled-mode-i,
app-company-holidays .mat-calendar-period-button {
  pointer-events: none !important;
}
.material-icons.disabled-color {
  color: var(--cool-grey);
  cursor: default;
}
.disabled-containter {
  background-color: var(--light-gray2) !important;
  background-image: none !important;
  pointer-events: none;
}
.position-relative {
  position: relative;
}
.position-absolute {
  position: absolute;
}
.visibility-visible {
  visibility: visible;
}
.visibility-hidden {
  visibility: hidden;
}
.visibility-hidden-mandatory {
  visibility: hidden !important;
}
label {
  font-family: gilroy-semi-bold;
}
.block-with-text {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.p-0 {
  padding: 0 !important;
}
.p-r-0 {
  padding-right: 0 !important;
}
.p-5 {
  padding: 5px;
}
.p-10 {
  padding: 10px !important;
}
.p-h-5 {
  padding-right: 5px;
  padding-left: 5px;
}
.p-r-l-8 {
  padding: 0 8px;
}
.p-h-10 {
  padding-right: 10px;
  padding-left: 10px;
}
.p-h-15 {
  padding-right: 15px;
  padding-left: 15px;
}
.p-r-l-16,
.p-h-16 {
  padding: 0 16px;
}
.p-r-l-16-i,
.p-h-16-i {
  padding: 0 16px !important;
}
.p-h-20 {
  padding-right: 20px;
  padding-left: 20px;
}
.p-4 {
  padding: 4px !important;
}
.p-8 {
  padding: 8px !important;
}
.p-10 {
  padding: 10px !important;
}
.p-24 {
  padding: 24px !important;
}
.p-25 {
  padding: 25px !important;
}
.p-t-b-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.p-t-b-8 {
  padding: 8px 0;
}
.p-t-b-8-i {
  padding: 8px 0 !important;
}
.p-t-b-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.p-t-b-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.p-t-b-6 {
  padding-top: 6px;
  padding-bottom: 6px;
}
.p-t-b-14 {
  padding-top: 14px;
  padding-bottom: 14px;
}
.p-t-0 {
  padding-top: 0px !important;
}
.p-t-6-i {
  padding-top: 6px !important;
}
.p-t-8 {
  padding-top: 8px;
}
.p-t-8-i {
  padding-top: 8px !important;
}
.p-t-10 {
  padding-top: 10px;
}
.p-t-12 {
  padding-top: 12px;
}
.p-t-15 {
  padding-top: 15px;
}
.p-t-16 {
  padding-top: 16px;
}
.p-t-16-i {
  padding-top: 16px !important;
}
.p-t-24-i {
  padding-top: 24px !important;
}
.p-r-8 {
  padding-right: 8px;
}
.p-r-10 {
  padding-right: 10px;
}
.p-r-12 {
  padding-right: 12px;
}
.p-r-12-i {
  padding-right: 12px !important;
}
.p-r-16 {
  padding-right: 16px;
}
.p-r-16-i {
  padding-right: 16px !important;
}
.p-r-24 {
  padding-right: 24px !important;
}
.p-r-20 {
  padding-right: 20px;
}
.p-r-60 {
  padding-right: 60px;
}
.p-l-20 {
  padding-left: 20px;
}
.p-l-4 {
  padding-left: 4px;
}
.p-r-15 {
  padding-right: 15px;
}
.p-r-36 {
  padding-right: 36px;
}
.p-r-48 {
  padding-right: 48px;
}
.p-r-70 {
  padding-right: 70px;
}
.p-15 {
  padding: 15px !important;
}
.p-12 {
  padding: 12px;
}
.p-12-i {
  padding: 12px !important;
}
.p-16 {
  padding: 16px;
}
.p-16-i {
  padding: 16px !important;
}
.p-32 {
  padding: 32px;
}
.p-36 {
  padding: 36px;
}
.p-40 {
  padding: 40px;
}
.p-48 {
  padding: 48px;
}
.p-56 {
  padding: 56px;
}
.p-16-i {
  padding: 16px !important;
}
.p-t-b-12 {
  padding: 12px 0;
}
.p-t-b-16 {
  padding: 16px 0 !important;
}
.p-r-l-15 {
  padding: 0 15px !important;
}
.p-r-l-20 {
  padding: 0 20px;
}
.p-r-l-97 {
  padding: 0 97px;
}
.p-t-b-20 {
  padding: 20px 0;
}
.p-20 {
  padding: 20px;
}
.p-20-i {
  padding: 20px !important;
}
.p-h-t-10 {
  padding-right: 10px;
  padding-left: 10px;
  padding-top: 10px;
}
.p-l-5 {
  padding-left: 5px;
}
.p-l-15 {
  padding-left: 15px;
}
.p-l-10 {
  padding-left: 10px;
}
.p-l-10i {
  padding-left: 10px !important;
}
.p-l-16 {
  padding-left: 16px !important;
}
.p-l-16i {
  padding-left: 16px !important;
}
.p-l-20 {
  padding-left: 20px;
}
.p-l-24 {
  padding-left: 24px;
}
.p-l-r-4 {
  padding-left: 4px;
  padding-right: 4px;
}
.p-l-r-8 {
  padding-left: 8px;
  padding-right: 8px;
}
.p-l-r-16 {
  padding-left: 16px;
  padding-right: 16px;
}
.p-l-20 {
  padding-left: 20px !important;
}
.p-l-40-font-14 {
  padding-left: 40px !important;
  font-size: 14px;
}
.p-l-32 {
  padding-left: 32px !important;
}
.p-l-56 {
  padding-left: 56px !important;
}
.p-b-0 {
  padding-bottom: 0 !important;
}
.p-b-8 {
  padding-bottom: 8px;
}
.p-b-10 {
  padding-bottom: 10px;
}
.p-b-12 {
  padding-bottom: 12px;
}
.p-b-16 {
  padding-bottom: 16px;
}
.p-b-25 {
  padding-bottom: 20px;
}
.p-b-24 {
  padding-bottom: 24px;
}
.p-b-24-i {
  padding-bottom: 24px !important;
}
.p-t-20 {
  padding-top: 20px;
}
.p-t-24 {
  padding-top: 24px;
}
.p-r-5 {
  padding-right: 5px;
}
.p-r-l-10 {
  padding: 0 10px;
}
.p-r-l-20 {
  padding: 0 20px;
}
.p-r-l-64 {
  padding: 0 64px;
}
.p-r-l-30 {
  padding: 0 30px;
}
.p-r-l-32 {
  padding: 0 32px;
}
.p-r-l-18 {
  padding-left: 18px;
  padding-right: 18px;
}
.p-r-l-15 {
  padding-right: 15px !important;
  padding-left: 15px !important;
}
.p-r-l-24 {
  padding-right: 24px;
  padding-left: 24px;
}
.p-t-0-b-8 {
  padding-top: 0px !important;
  padding-bottom: 8px !important;
}
.p-r-20 {
  padding-right: 20px !important;
}
.p-t-l-r-16 {
  padding: 16px 16px 0px 16px;
}
.m-0 {
  margin: 0;
}
.m-0-i {
  margin: 0 !important;
}
.m-h-0 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}
.m-v-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.m-5 {
  margin: 5px;
}
.m-8 {
  margin: 8px;
}
.m-10 {
  margin: 10px;
}
.m-15 {
  margin: 15px;
}
.m-16 {
  margin: 16px;
}
.m-16-i {
  margin: 16px !important;
}
.m-20 {
  margin: 20px;
}
.m-t-1-n {
  margin-top: -1px !important;
}
.m-t-2 {
  margin-top: 2px;
}
.m-t-3 {
  margin-top: 3px;
}
.m-t-4 {
  margin-top: 4px;
}
.m-t-4-i {
  margin-top: 4px !important;
}
.m-t-5 {
  margin-top: 5px;
}
.m-t-5-i {
  margin-top: 5px !important;
}
.m-t-5-n {
  margin-top: -5px;
}
.m-t-6 {
  margin-top: 6px;
}
.m-t-7 {
  margin-top: 7px;
}
.m-t-8 {
  margin-top: 8px;
}
.m-t-8-i {
  margin-top: 8px !important;
}
.m-t-10 {
  margin-top: 10px;
}
.m-t-12 {
  margin-top: 12px;
}
.m-t-12-i {
  margin-top: 12px !important;
}
.m-t-15 {
  margin-top: 15px;
}
.m-t-16 {
  margin-top: 16px;
}
.m-t-16-i {
  margin-top: 16px !important;
}
.m-t-18 {
  margin-top: 18px !important;
}
.m-t-20 {
  margin-top: 20px;
}
.m-t-24 {
  margin-top: 24px;
}
.m-t-25 {
  margin-top: 25px;
}
.m-t-30 {
  margin-top: 30px;
}
.m-t-32 {
  margin-top: 32px !important;
}
.m-t-35 {
  margin-top: 35px !important;
}
.m-t-40 {
  margin-top: 40px;
}
.m-t-45 {
  margin-top: 45px;
}
.m-t-50 {
  margin-top: 50px;
}
.m-t-60 {
  margin-top: 60px !important;
}
.m-r--28 {
  margin-right: -28px !important;
}
.m-r--12 {
  margin-right: -12px !important;
}
.m-r-0-i {
  margin-right: 0px !important;
}
.m-r-4 {
  margin-right: 4px;
}
.m-r-5 {
  margin-right: 5px;
}
.m-r-8 {
  margin-right: 8px;
}
.m-r-6 {
  margin-right: 6px;
}
.m-r-10 {
  margin-right: 10px !important;
}
.m-r-12 {
  margin-right: 12px !important;
}
.m-r-15 {
  margin-right: 15px;
}
.m-r-16 {
  margin-right: 16px;
}
.m-r-20 {
  margin-right: 20px !important;
}
.m-r-25 {
  margin-right: 25px;
}
.m-r-30 {
  margin-right: 30px;
}
.m-r-32 {
  margin-right: 32px;
}
.m-r-36 {
  margin-right: 36px;
}
.m-r-50 {
  margin-right: 50px !important;
}
.m-rl-20 {
  margin: 0 20px;
}
.m-b-5 {
  margin-bottom: 5px;
}
.m-b-7 {
  margin-bottom: 7px;
}
.m-b-8 {
  margin-bottom: 8px;
}
.m-b-10 {
  margin-bottom: 10px;
}
.m-b-5-i {
  margin-bottom: 5px !important;
}
.m-b-12-i {
  margin-bottom: 12px !important;
}
.m-b-10-i {
  margin-bottom: 10px !important;
}
.m-b-15 {
  margin-bottom: 15px;
}
.m-b-16 {
  margin-bottom: 16px;
}
.m-b-16-i {
  margin-bottom: 16px !important;
}
.m-b-20 {
  margin-bottom: 20px;
}
.m-b-20-i {
  margin-bottom: 20px !important;
}
.m-b-24 {
  margin-bottom: 24px;
}
.m-b-24-i {
  margin-bottom: 24px !important;
}
.m-b-25 {
  margin-bottom: 25px;
}
.m-b-30 {
  margin-bottom: 30px;
}
.m-b-32 {
  margin-bottom: 32px;
}
.m-b-40 {
  margin-bottom: 40px;
}
.m-b-56 {
  margin-bottom: 56px;
}
.m-l-0-i {
  margin-left: 0 !important;
}
.m-t-0-i {
  margin-top: 0 !important;
}
.m-l-5 {
  margin-left: 5px;
}
.m-l-6 {
  margin-left: 6px;
}
.m-l-8 {
  margin-left: 8px;
}
.m-l-10 {
  margin-left: 10px;
}
.m-l-10i {
  margin-left: 10px !important;
}
.m-l-12 {
  margin-left: 12px;
}
.m-l-15 {
  margin-left: 15px;
}
.m-l-16 {
  margin-left: 16px;
}
.m-l-20 {
  margin-left: 20px;
}
.m-l-21 {
  margin-left: 21px;
}
.m-l-24 {
  margin-left: 24px;
}
.m-l-30 {
  margin-left: 30px;
}
.m-l-32 {
  margin-left: 32px;
}
.m-l-34 {
  margin-left: 34px;
}
.m-l-36 {
  margin-left: 36px;
}
.m-l-38 {
  margin-left: 38px;
}
.m-l-40 {
  margin-left: 40px;
}
.m-l-50 {
  margin-left: 50px;
}
.m-l-auto {
  margin-left: auto;
}
.m-v-16 {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
}
.m-t-b-15 {
  margin-top: 15px !important;
  margin-bottom: 15px !important;
}
.m-t-b-20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}
.m-t-b-25 {
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}
.m-t-b-10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}
.m-t-b-8 {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}
.m-l-r-8 {
  margin-left: 8px !important;
  margin-right: 8px !important;
}
.m-l-r-10 {
  margin-left: 10px !important;
  margin-right: 10px !important;
}
.m-l-r-15 {
  margin-left: 15px;
  margin-right: 15px;
}
.m-l-r-16 {
  margin-left: 16px;
  margin-right: 16px;
}
.m-l-r-20 {
  margin-left: 20px !important;
  margin-right: 20px !important;
}
.m-l-r-22 {
  margin-left: 22px !important;
  margin-right: 22px !important;
}
.m-l-r-30 {
  margin-left: 30px !important;
  margin-right: 30px !important;
}
.margin-a {
  margin: auto;
}
.m-r-40i {
  margin-right: 40px !important;
}
.p-left {
  float: left;
}
.p-right {
  float: right;
}
@media (max-width: 599px) {
  .p-0-xs {
    padding: 0 !important;
  }
  .m-r-xs-10 {
    margin-right: 10px !important;
  }
  .m-b-xs-10 {
    margin-bottom: 10px !important;
  }
  .m-b-xs-20 {
    margin-bottom: 20px !important;
  }
  .m-0-xs {
    margin: 0 !important;
  }
  .mobile-view-bottom {
    margin-bottom: 120px !important;
  }
  .full-width-xs .resources-wrapper .resources-wrapper-content {
    width: 100%;
  }
}
.mat-mdc-form-field {
  width: 100%;
}
.mat-mdc-form-field-icon-prefix {
  position: absolute;
  top: 32px;
  left: 8px;
}
.mat-mdc-form-field.auto-width-form-field,
.auto-width-form-field .mat-form-field-flex,
.auto-width-form-field .mat-mdc-form-field-infix {
  width: unset;
}
.input-label,
.select-label,
.custom-label,
.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label {
  font-family: gilroy-semi-bold;
  color: var(--navy);
  font-size: 13px;
}
.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label {
  transform: unset !important;
  transition: unset !important;
  top: 0;
  width: 100%;
  padding-left: 12px;
}
.custom-label,
.select-label {
  margin-left: 0px !important;
}
ng-select.billing-summary-select .ng-select-container {
  width: 123px !important;
  height: 25px !important;
  border-radius: 24px !important;
  background: var(--cool-green) !important;
  color: #fff !important;
}
#dtCloudApp .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after,
.mat-form-field-required-marker {
  color: var(--red);
}
#dtCloudApp .mdc-floating-label--required:not(.mdc-floating-label--hide-required-marker)::after,
.m-l-4 {
  margin-left: 4px;
}
.mat-form-field-can-float.mat-form-field-should-float.mat-form-field-invalid .mat-form-field-label {
  color: var(--red);
}
.mat-form-field-appearance-legacy .mat-form-field-wrapper {
  padding-bottom: 16px;
  margin-bottom: 18px;
  margin-right: 16px;
}
.mat-form-field-label-wrapper {
  top: -20px;
  padding-top: 20px;
}
.mat-form-field-appearance-legacy .mat-mdc-form-field-infix {
  padding: 8px;
  border: 1px solid var(--silver);
  margin-top: 18px;
  border-radius: 2px;
}
.mat-form-field-appearance-legacy.mat-form-field-invalid .mat-mdc-form-field-infix {
  border-color: var(--red);
}
.mat-form-field-appearance-legacy.mat-focused .mat-mdc-form-field-infix {
  border: 1px solid var(--green-blue2);
}
#dtCloudApp .mat-form-field-appearance-legacy .mat-form-field-ripple {
  height: 0;
  background-color: transparent;
}
.mat-mdc-form-field-appearance-legacy .mat-form-field-underline,
.mat-form-field.mat-form-field-invalid .mat-form-field-ripple {
  background-color: transparent;
}
.mat-form-field-subscript-wrapper,
.mat-form-field-appearance-legacy .mat-form-field-subscript-wrapper {
  margin-top: 0;
}
.mat-mdc-form-field-error,
.mat-error,
.invalidPhoneNumber {
  color: var(--white) !important;
  background-color: var(--red);
  font-family: gilroy-semi-bold;
  padding: 4px 8px;
  border-radius: 2px;
  font-size: 12px;
  margin-top: 4px;
}
.mat-blue {
  top: 55px;
  position: absolute;
  width: max-content;
  color: var(--white);
  background-color: var(--blue);
  font-family: gilroy-regular;
  padding: 4px 8px;
  border-radius: 2px;
  font-size: 12px;
  margin-top: 7px;
  white-space: nowrap;
}
.compact-input .mat-mdc-form-field-infix {
  border-top: 0;
}
.mat-mdc-form-field.compact-input .mat-form-field-flex {
  padding-top: 0;
}
.compact-input .mat-form-field-wrapper {
  padding-bottom: 0;
}
.toggle-input input {
  padding: 0 16px !important;
}
.mat-mdc-form-field input + .percent-symbol {
  position: absolute;
  bottom: 10.5px;
  opacity: 0.7;
  right: 6px;
}
.custom-error {
  position: absolute;
  margin-top: 17px;
  font-family: gilroy-semi-bold;
  font-size: 12px;
  background-color: var(--red);
  color: var(--white);
  border-radius: 3px;
  z-index: 1;
  padding: 5px 7px;
}
.mat-mdc-form-field.xs-input .mat-mdc-select {
  font: unset;
  font-family: gilroy-medium;
  font-size: 16px;
  height: 40px;
  line-height: 40px;
}
.mat-mdc-form-field.xs-input.mat-form-field-has-label .mat-select,
.mat-form-field.xs-input.mat-form-field-has-label input {
  margin-top: 8px;
}
.mat-mdc-form-field.xs-input .mat-mdc-form-field-infix .mat-form-field-label-wrapper label {
  font-size: 16px;
}
.mat-mdc-form-field.invalid .mat-mdc-form-field-infix .mat-mdc-input-element {
  border-color: var(--red) !important;
}
#dtCloudApp mat-header-row,
#dtCloudApp .mat-mdc-header-row,
#dtCloudApp mat-footer-row,
#dtCloudApp .mat-mdc-footer-row,
#dtCloudApp mat-row,
#dtCloudApp .mat-mdc-row {
  min-height: 40px;
}
#dtCloudApp .newTableUI .mat-mdc-header-row {
  min-height: 32px;
  max-height: 32px;
  height: 32px;
}
.newTableUI .mat-mdc-row {
  height: 56px;
  max-height: 56px;
}
.newTableUI .mat-mdc-header-cell,
.newTableUI .mat-mdc-cell {
  min-width: 40px !important;
  max-width: 240px !important;
}
.newTableUI-container {
  border: 1px solid var(--color-divider-dark) !important;
  border-radius: 12px !important;
  -webkit-overflow-scrolling: touch;
  min-width: 20px;
  overflow: auto;
}
.newTableUI-container .newTableUI-container {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent;
}
.custom-table-header .mat-mdc-header-cell {
  border-bottom: 1px solid var(--blue);
  font-size: 12px !important;
  text-transform: unset !important;
}
.mat-mdc-header-cell {
  font-family: gilroy-semi-bold;
  font-size: 10px;
  color: var(--cool-grey);
  text-transform: uppercase;
}
.mat-mdc-header-cell.sorted {
  color: var(--slate-grey);
}
#dtCloudApp .mat-mdc-cell,
#dtCloudApp .mat-mdc-footer-cell {
  font-size: 12px;
  font-family: gilroy-medium;
  color: var(--navy);
}
.mat-mdc-cell.primary {
  font-size: 13px;
}
.mat-elevation-z8 {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07);
  box-sizing: border-box;
  border: 1px solid var(--silver);
  border-radius: 2px;
  background-color: var(--white);
}
.close {
  border: 1px solid #C4CCDA;
  border-radius: 4px;
  background-color: var(--white);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.nav-close.close {
  margin-right: 10px;
}
.page-header-new .nav-close.close {
  margin-right: 0;
}
.mat-sidenav-content > *:not(:first-child),
.height-100 {
  height: 100%;
}
.mat-mdc-list-base .mat-mdc-list-item {
  font-family: gilroy-semi-bold;
  font-size: 13px;
  color: var(--navy);
}
.dashBoard-activeLink.mat-mdc-tab-link:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label {
  color: var(--white);
}
.mat-mdc-tab-link .mdc-tab-indicator__content,
.mdc-tab-indicator--active .mdc-tab-indicator__content {
  transition: 500ms cubic-bezier(0.35, 0, 0.25, 1) !important;
  transform-origin: left;
}
.dashBoard-activeLink .mdc-tab-indicator .mdc-tab-indicator__content--underline {
  display: none;
}
#dtCloudApp .mat-tab-label-white .mat-mdc-tab-link,
#dtCloudApp .mat-tab-label-white .mat-tab-label {
  color: var(--white);
}
#dtCloudApp .mat-tab-label-white.mat-mdc-tab-group.mat-primary .mat-ink-bar {
  background-color: var(--white);
}
@media only screen and (min-width: 1280px) and (max-width: 1439px) {
  .timePopOver {
    top: 50vh !important;
    left: 42vw !important;
    position: absolute !important;
  }
  .transferPopOver {
    width: 80%;
    position: relative;
    left: 103px;
    top: -65px;
  }
}
@media (max-width: 1440px) {
  #dtCloudApp .mat-mdc-tab-link,
  #dtCloudApp .mat-mdc-tab.mdc-tab {
    padding: 0 32px;
  }
  #dtCloudApp .takeoff-categories .mat-mdc-tab.mdc-tab {
    padding: 0px !important;
  }
}
@media only screen and (min-width: 1440px) {
  .timePopOver {
    top: 50vh !important;
    left: 45vw !important;
    position: absolute !important;
  }
  .transferPopOver {
    width: 80%;
    position: relative;
    left: 103px;
    top: -65px;
  }
}
@media (min-width: 1440px) {
  .catalog-tab .mat-tab-header-pagination {
    display: none !important;
  }
}
.mat-mdc-tab-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.no-tab-border .mat-mdc-tab-header {
  border-bottom: none !important;
}
.opacityP5 {
  opacity: 0.5;
}
.mdc-tab__ripple::before,
.mat-mdc-tab .mat-ripple-element,
.mat-mdc-tab-header-pagination .mat-ripple-element,
.mat-mdc-tab-link .mat-ripple-element {
  background-color: transparent;
}
#dtCloudApp .mat-tab-label-white .mat-mdc-tab-link.mat-tab-label-active,
#dtCloudApp .mat-tab-label-white .mat-tab-label.mat-tab-label-active {
  color: var(--white);
}
#dtCloudApp .mat-mdc-card-title {
  margin: 0;
  font-size: 13px;
  font-weight: unset;
  font-family: gilroy-semi-bold;
}
#dtCloudApp .mat-mdc-card-avatar {
  margin-bottom: 0;
}
.dashboard-container .mat-mdc-card-content {
  padding: 0 !important;
}
#dtCloudApp .mat-mdc-card-actions,
.mat-mdc-card-content,
.mat-mdc-card-subtitle {
  margin: 0 !important;
}
#dtCloudApp .mat-mdc-card-content {
  padding: 0;
}
#dtCloudApp #planningOverview .mat-mdc-card-content {
  padding: 12px;
}
#dtCloudApp .mat-mdc-card-content,
.mat-mdc-card-subtitle {
  font-size: 13px;
}
#dtCloudApp .mat-mdc-card-actions {
  padding: 0;
}
.page-container {
  padding: 12px 20px 0 20px;
  overflow: auto;
}
.page-container.page-container-new {
  padding: 12px 24px 0 24px;
}
.installer .page-container {
  padding: 0 !important;
}
.child-container {
  margin: -20px -20px 0 -20px;
}
.page-header {
  background-color: var(--white);
  border-bottom: 1px solid #bdc4c7;
  padding: 0px 16px;
  min-height: 52px;
}
.page-header.page-header-new {
  padding: 0px 24px;
  min-height: 56px;
  justify-content: center;
}
@media (max-width: 599px) {
  .mobile-page-header .title-bar,
  .page-header .title-bar {
    min-height: 56px !important;
    align-items: center;
    align-content: center;
  }
  .mobile-page-header .title-txt,
  .page-header .title-txt,
  .step-header .title-txt {
    color: var(--navy) !important;
  }
}
.step-header {
  margin-bottom: 30px;
}
.page-header .title-bar {
  min-height: 56px;
  align-items: center;
  align-content: center;
}
.page-header .title-txt,
.step-header .title-txt {
  margin-right: 15px;
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 24px;
}
.installer-view .page-header .title-txt,
.installer-view .step-header .title-txt {
  font-size: 32px;
}
.installer-view .page-sub-header {
  font-size: 16px;
  font-family: gilroy-semi-bold;
  color: var(--color-text-primary);
  margin: 0 0 20px 0 !important;
}
.page-header .mat-mdc-tab-nav-bar {
  margin-top: 12px;
}
app-header.p-0 > .page-header {
  padding: 0;
}
app-header.no-border > .page-header {
  border: none;
}
.green,
.Green {
  color: var(--cool-green);
}
.green-i {
  color: var(--cool-green) !important;
}
.white,
.White {
  color: var(--white);
}
.medium-gray {
  color: var(--medium-gray);
}
.cool-gray {
  color: var(--cool-gray);
}
.red1 {
  color: var(--red4);
}
.red,
.Red {
  color: var(--red);
}
.red-i {
  color: var(--red) !important;
}
.pink,
.Pink {
  color: var(--pink);
}
.Blue,
.blue {
  color: var(--blue);
}
.orange,
.Orange {
  color: #fa5907;
}
.navy,
.Navy {
  color: var(--navy) !important;
}
.user-guide-text {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 12px;
  font-style: italic;
  line-height: 14px;
}
.co-status:not(.status-grey) {
  color: var(--white);
  opacity: 0.8;
  font-size: 11px;
  font-family: gilroy-bold;
}
.page-toolbar {
  min-height: 57px;
  max-height: 64px;
  background-color: #f7f9fb;
  border-bottom: 0.5px solid rgba(0, 0, 0, 0.07);
  padding: 0 20px;
}
.primary-content {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 13px;
  cursor: pointer;
}
.highlighted-container {
  background-color: rgba(13, 187, 125, 0.1);
  padding: 5px;
}
.mat-menu-header,
.mat-menu-info {
  pointer-events: none;
  font-family: gilroy-semi-bold;
  font-size: 10px;
  color: var(--cool-grey);
  text-transform: uppercase;
  padding: 5px 16px;
}
.mat-menu-info {
  font-size: 11px;
  font-family: gilroy-medium;
  text-transform: capitalize;
}
.menu-tick.active {
  color: var(--cool-green);
}
.mat-mdc-menu-panel {
  box-sizing: border-box;
  border: 1px solid var(--color-divider-dark);
  border-radius: 4px;
  background: var(--white);
  background-color: var(--white);
  box-shadow: 0 2px 12px 0 rgba(1, 22, 47, 0.16) !important;
  min-height: auto !important;
  max-height: calc(100vh - 200px) !important;
}
.mat-mdc-option.permissions-dropdown {
  min-width: 90px;
}
.mat-mdc-menu-panel.menu-date-range,
.mat-menu-panel.menu-large {
  max-height: calc(100vh - 81px) !important;
}
.mat-mdc-menu-panel.menu-date-range.filter-options,
.mat-menu-panel.menu-large.filter-options {
  max-height: calc(100vh - 130px) !important;
}
.mat-mdc-menu-panel.user-menu {
  min-width: 266px;
}
.mat-mdc-menu-item,
.mat-mdc-menu-item.mdc-list-item {
  height: unset !important;
  min-height: 32px !important;
  line-height: 40px !important;
  font-size: 14px !important;
  font-family: gilroy-regular;
  color: var(--navy);
  background: var(--white);
  padding-top: 8px;
  padding-bottom: 8px;
}
.mat-mdc-menu-item.mdc-list-item:has(.mat-mdc-radio-button),
.mat-mdc-radio-group .mat-mdc-menu-item {
  height: 40px !important;
}
.mat-mdc-menu-content .mat-divider {
  margin: 8px 16px;
  border-radius: 2px;
}
.mat-mdc-menu-item.selected-menu-item {
  color: var(--cool-green);
}
.mat-mdc-menu-panel.filter-menu .mat-mdc-menu-content .mat-mdc-menu-item.selected:not([disabled]) {
  background-color: rgba(13, 187, 125, 0.15) !important;
}
.mat-mdc-menu-item-highlighted:not([disabled]),
.mat-mdc-menu-item.cdk-keyboard-focused:not([disabled]),
.mat-mdc-menu-item.cdk-program-focused:not([disabled]),
.mat-mdc-menu-item:hover:not([disabled]) {
  background-color: rgba(158, 158, 158, 0.2);
}
.menu-detail {
  display: flex;
  flex-direction: column !important;
  padding: 10px 16px;
}
.menu-detail > div {
  margin-bottom: 10px;
}
.menu-detail > div:last-child,
.m-b-0 {
  margin-bottom: 0px;
}
.menu-detail > .menu-info {
  color: var(--medium-gray) !important;
  font-family: gilroy-medium !important;
  font-size: 13px;
  opacity: 0.74 !important;
}
.menu-detail > .statusBtn-blue {
  cursor: pointer;
  margin-top: 5px;
  outline: none;
  padding: 6px;
}
.menu-detail > .statusBtn-blue.disabled {
  color: rgba(0, 0, 0, 0.25);
  background-color: #f3f4f5;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
  pointer-events: none;
}
.menu-detail > .status-done-info {
  display: flex;
  padding: 10px;
  border-radius: 4px;
  margin: 10px 0;
  background-color: rgba(231, 232, 233, 0.7);
  color: var(--medium-gray);
}
.menu-detail > .status-done-info > * {
  margin-left: 7px;
}
.stages-drop-trigger {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: white;
  max-height: 36px;
  min-height: 36px;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 65px;
  min-width: 76px;
  font-family: gilroy-medium;
  white-space: nowrap;
  padding: 0 24px;
}
.stages-drop-trigger.projectOverview,
.stages-drop-trigger.quoteOverview,
.stages-drop-trigger.coOverview {
  min-width: 148px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px !important;
}
.priority-drop-trigger {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border: unset;
  background-color: transparent;
  max-height: 28px;
  min-height: 28px;
  cursor: pointer;
  min-width: 180px;
  max-width: 180px;
  font-family: gilroy-medium;
}
.stages-drop-trigger[disabled] {
  cursor: default;
}
.stages-drop-trigger.status-dd-border {
  border-color: var(--silver);
}
.mat-mdc-menu-item.stages-drop-down .mdc-list-item__primary-text {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-width: 200px;
}
.mat-mdc-menu-item.priority-drop-down {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  min-width: 150px;
}
.mat-mdc-menu-item.stages-drop-down .mdc-list-item__primary-text > div {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.mat-mdc-menu-item.stages-drop-down i {
  visibility: hidden;
  color: var(--cool-green);
  font-size: 17px;
  margin-right: 7px;
  top: 5px;
  position: relative;
}
.mat-mdc-menu-item.stages-drop-down.active i {
  visibility: visible;
}
.mat-mdc-menu-item.stages-drop-down.active span {
  color: var(--cool-green);
}
.mat-mdc-menu-item.stages-drop-down .status-tag,
.stages-drop-trigger .status-tag {
  width: 16px;
  height: 16px;
  padding: 0;
  border-radius: 50%;
  min-width: 16px;
}
.filter-group {
  border-bottom: 1px solid var(--light-gray2);
  padding-bottom: 15px;
  padding-top: 10px;
}
.filter-group:first-of-type {
  padding-top: 0;
}
.filter-group:last-of-type {
  border-bottom: none;
}
.filter-group-header {
  font-family: gilroy-bold;
  color: var(--medium-gray);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  line-height: 12px;
}
app-filter .mat-mdc-button {
  padding: 0px !important;
  min-width: 40px !important;
}
.filter-panel {
  overflow: auto;
  min-width: 250px;
  padding: 20px 5px 20px 10px;
}
.filter-title {
  font-family: gilroy-semi-bold;
  color: rgba(95, 104, 116, 0.75);
  font-size: 10px;
  text-transform: uppercase;
  opacity: unset;
  margin-bottom: 10px;
}
.filter-item {
  min-height: 30px;
  display: block;
}
app-filter .mat-mdc-button.active {
  background-image:
    linear-gradient(
      to bottom,
      rgba(1, 22, 47, 0),
      rgba(1, 22, 47, 0.02)),
    linear-gradient(#dcdfe2, #dcdfe2);
  opacity: 1;
}
app-filter .mat-mdc-button:hover {
  background-color: rgba(158, 158, 158, 0.2);
}
.mat-mdc-list-base .mat-mdc-list-item {
  height: 30px;
}
#app-navigator.mat-mdc-list-base .mat-mdc-list-item {
  padding: 0 !important;
  margin: 8px 8px 8px 16px;
  width: auto;
  height: 36px;
}
#app-navigator.mat-mdc-list-base > .mat-mdc-list-item:first-of-type {
  margin-top: 0;
}
#app-navigator.mat-mdc-list-base .sub-nav-background .mat-mdc-list-item {
  padding: 0 8px 0 12px !important;
  margin: 8px 0 8px 8px;
}
#app-navigator.mat-mdc-list-base .sub-nav-background .mat-mdc-list-item.active {
  padding-right: 0 !important;
  margin-right: 8px;
}
.app-nav-open-icon,
.app-nav-close-icon {
  box-sizing: border-box;
  height: 44px !important;
  width: 44px !important;
  border: 1px solid var(--silver);
  border-radius: 4px;
  background-color: var(--white);
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  padding: 10px;
  visibility: hidden;
}
.app-nav-close-icon {
  position: absolute;
  right: 16px;
  z-index: 2;
  top: 4px;
  visibility: visible;
}
.appsidenav-hidden .app-nav-open-icon {
  visibility: visible;
}
.appsidenav-hidden + .app-nav-close-icon {
  visibility: hidden;
}
@media screen and (min-width: 768px) and (max-width: 842px) {
  #app-navigator.mat-mdc-list-base .mdc-list-item__content {
    padding: 0 0px 0 4px !important;
  }
}
@media screen and (max-width: 959px) {
  .m-l-xs-0 {
    margin-left: 0px !important;
  }
  .m-t-x-0 {
    margin-top: 0px !important;
  }
}
#app-navigator.mat-mdc-list-base .mat-mdc-list-item-interactive::before {
  background: unset;
}
.appsidenav-collapsed #app-navigator.mat-mdc-list-base .mat-mdc-list-item {
  padding: 0 0px 0 3px !important;
}
.appsidenav-collapsed #app-navigator.mat-mdc-list-base .mat-mdc-list-item.main-nav.active::after {
  content: "";
  width: 2px;
  right: 4px;
  position: absolute;
  border-radius: 2px;
  opacity: 0.6;
  height: 36px;
}
.appsidenav-collapsed #app-navigator.mat-mdc-list-base .mat-mdc-list-item.active {
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.2) !important;
  border-radius: 4px;
}
.appsidenav-collapsed .content-to-hide-when-collapsed,
.content-to-show-when-collapsed {
  display: none !important;
}
.appsidenav-collapsed .content-to-show-when-collapsed {
  display: unset !important;
}
.appsidenav-collapsed .trial-warning {
  height: 37px;
}
#dtCloudApp .mat-mdc-checkbox {
  --mat-checkbox-selected-checkmark-color: var(--white);
}
.mdc-checkbox {
  transform: scale(0.6666);
}
.mat-mdc-header-cell .mat-mdc-checkbox .mdc-form-field.mat-internal-form-field {
  max-height: 26px !important;
}
#dtCloudApp .mat-mdc-checkbox .mdc-checkbox__ripple {
  background: unset;
}
#dtCloudApp .mat-mdc-checkbox .mdc-checkbox {
  padding-right: 8px;
}
#dtCloudApp .todoCheckList .mat-mdc-checkbox .mdc-checkbox {
  padding-right: 0px !important;
}
.mat-mdc-dialog-container .mdc-checkbox {
  flex: 0 0 24px;
  height: 24px;
  width: 24px;
}
.mat-mdc-dialog-container .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__background,
.mat-mdc-dialog-container .mdc-checkbox .mdc-checkbox__native-control {
  height: 24px;
  width: 24px;
}
.mat-mdc-dialog-container .mat-mdc-checkbox-touch-target {
  width: 30px;
  height: 30px;
}
.mat-mdc-dialog-container .mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__checkmark {
  max-width: 16px;
  margin: auto;
}
.checklist-msg .mat-mdc-slide-toggle label,
.mat-mdc-slide-toggle.checklist-msg label,
.checklist-msg .mat-mdc-checkbox label,
.mat-mdc-checkbox.checklist-msg label {
  font-size: 14px !important;
  font-family: gilroy-regular !important;
}
.checklist-msg {
  font-family: gilroy-regular;
  font-size: 14px;
  line-height: 20px;
}
.mat-mdc-checkbox,
.mat-mdc-checkbox label,
.mat-mdc-slide-toggle label {
  font-family: gilroy-medium;
  font-size: 13px;
  color: var(--navy);
}
.mat-mdc-menu-panel .mat-mdc-checkbox label,
.mat-mdc-menu-panel .mat-mdc-slide-toggle label {
  font-size: 14px;
  font-family: gilroy-regular;
}
.secondary-text .mat-mdc-checkbox label {
  color: var(--medium-gray);
  font-size: 12px;
}
.mat-checkbox-layout {
  white-space: normal !important;
}
.table-container mat-table mat-header-cell:first-of-type {
  padding-left: 10px;
}
.table-container mat-table mat-cell:first-of-type {
  padding-left: 10px;
}
.invite-user-form .mat-mdc-checkbox-list .mat-checkbox-inner-container,
.invite-user-form .mat-checkbox .mat-checkbox-inner-container {
  margin: 0 5px 0 0;
}
.mat-mdc-checkbox-list .mat-checkbox-inner-container,
.mat-checkbox .mat-checkbox-inner-container {
  height: 12px;
  width: 12px;
}
.mat-mdc-checkbox-list.attachment-selection .mat-checkbox-inner-container,
.mat-checkbox.attachment-selection .mat-checkbox-inner-container {
  height: 12px;
  width: 12px;
  border-radius: 50%;
  border: 1px solid springgreen;
}
.mat-mdc-checkbox.mat-accent {
  --mat-checkbox-unselected-icon-color: #bdc4c7;
  --mat-checkbox-unselected-pressed-icon-color: #6f7782;
}
.mdc-checkbox__mixedmark {
  width: 100%;
  height: 0;
  border-width: 1px;
  border-style: solid;
  opacity: 1;
}
.mdc-checkbox__native-control:indeterminate ~ .mdc-checkbox__background .mdc-checkbox__mixedmark,
.mdc-checkbox__native-control[data-indeterminate=true] ~ .mdc-checkbox__background .mdc-checkbox__mixedmark {
  transform: scaleX(1) rotate(0deg);
  opacity: 1;
  margin-left: 2px;
  margin-right: 2px;
  margin-top: 0;
  width: 8px;
  height: 2px;
  border-color: var(--cool-green) !important;
}
.mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate ~ .mdc-checkbox__background {
  background-color: var(--white) !important;
  border-color: var(--cool-green) !important;
}
.mat-checkbox-frame {
  background-color: var(--white);
  border-color: rgba(163, 166, 170, 0.67);
  border-radius: 1px !important;
  border-width: 1px !important;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.09);
}
mat-checkbox.mat-checkbox-checked .mat-checkbox-frame {
  border: 1px solid var(--green-blue2);
}
.mat-mdc-checkbox.mat-accent.sms-settings-checkbox {
  --mat-checkbox-unselected-icon-color: 1px solid var(--blue);
  --mat-checkbox-unselected-pressed-icon-color: 1px solid var(--blue);
}
.chk-blue-bg.mat-mdc-checkbox.mat-checkbox-checked .mat-checkbox-frame {
  border: 1px solid var(--blue);
}
.mat-checkbox-checked.mat-accent .mat-checkbox-background,
.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
  background-color: var(--green-blue);
  opacity: 0;
  transform: rotate(90deg);
}
.chk-blue-bg.mat-checkbox-checked.mat-accent .mat-checkbox-background,
.chk-blue-bg.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
  background-color: var(--blue);
  opacity: 0;
  transform: rotate(90deg);
}
.mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background,
.mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
  background-color: var(--medium-gray) !important;
  opacity: 0;
  transform: rotate(90deg);
}
.rounded-check-box .mat-checkbox-inner-container {
  min-width: 17px;
  min-height: 17px;
  border-radius: 50%;
  overflow: hidden;
  border: 1.7px solid var(--slate-grey);
  top: 1px;
}
.rounded-check-box.rounded-check-box2 .mat-checkbox-inner-container {
  top: -1px;
}
.rounded-check-box.mat-checkbox-checked .mat-checkbox-inner-container {
  border: 1.7px solid var(--cool-green);
}
.rounded-check-box.mat-checkbox-checked svg.mat-checkbox-checkmark {
  width: 12px;
  left: 1px;
  top: 1px;
}
.rounded-check-box .mat-checkbox-frame {
  border-color: transparent;
}
.rounded-check-box .mat-checkbox-background {
  height: 15px;
}
.rounded-check-box.mat-checkbox-indeterminate .mat-checkbox-background {
  background-color: white;
  top: -0.8px;
  opacity: 0;
  transform: rotate(90deg);
}
.rounded-check-box.mat-checkbox-indeterminate .mat-checkbox-background .mat-checkbox-mixedmark {
  background-color: var(--slate-grey);
  height: 1.5px !important;
  opacity: 0;
  transform: rotate(90deg);
}
.mat-checkbox-checkmark-path {
  stroke: var(--white) !important;
}
#dtCloudApp .mat-pseudo-checkbox {
  border-radius: 1px;
  border: 1px solid;
  border-color: rgba(163, 166, 170, 0.67);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.09);
}
.mat-pseudo-checkbox-checked,
.mat-pseudo-checkbox-indeterminate,
.mat-accent .mat-pseudo-checkbox-checked,
.mat-accent .mat-pseudo-checkbox-indeterminate {
  background: var(--green-blue);
}
.mat-mdc-radio-button .mat-radio-label-content {
  font-size: 13px;
  font-family: gilroy-medium;
  font-weight: unset;
  white-space: pre-wrap;
}
.mat-mdc-radio-button.propay-settings-radio .mat-radio-label-content {
  height: 19px;
  color: #072548;
  font-family: Gilroy-medium;
  font-size: 16px !important;
  line-height: 19px;
}
.mat-toolbar,
.mat-toolbar h1,
.headline {
  color: var(--black);
  font: 500 26px gilroy-semi-bold;
}
.dt-dialog.accept-proposal {
  min-height: calc(100vh - 40px);
  max-width: 893px !important;
  width: 100%;
}
.accept-proposal .mat-mdc-dialog-content {
  align-items: start;
  display: flex;
  justify-content: center;
  padding: 50px 0;
  max-height: calc(100% - 100px);
  min-height: calc(100% - 100px);
}
@media only screen and (max-width: 599px) {
  .minor-dialog .mat-mdc-dialog-content.duplicatet-task {
    padding: 0 16px;
    margin: 32px 0;
    min-height: calc(100vh - 290px);
  }
  .stages-drop-trigger {
    border-color: var(--silver);
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
    background:
      linear-gradient(
        180deg,
        rgba(1, 22, 47, 0) 0%,
        rgba(1, 22, 47, 0.02) 100%);
  }
  .timePopOver {
    top: 50vh !important;
    left: 20vw !important;
    position: absolute !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .timePopOver {
    top: 50vh !important;
    left: 35vw !important;
    position: absolute !important;
  }
  .transferPopOver {
    width: 80%;
    position: relative;
    left: 103px;
    top: -65px;
  }
}
@media only screen and (max-width: 599px) {
  div.oppGraphAndTaskContainer {
    height: auto !important;
    display: block !important;
  }
  .dt-dialog .mat-mdc-dialog-actions,
  .dt-dialog2 .mat-dialog-actions {
    margin-bottom: 64px;
  }
}
.content-primary,
.primary-text {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 13px;
  cursor: pointer;
}
.primary-text-12px {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 12px;
  cursor: pointer;
}
.p2,
.secondary-text,
.secondary-header {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 12px;
}
.title {
  color: var(--navy);
  font-family: gilroy-semi-bold;
}
.gilroy-semi-bold {
  font-family: gilroy-semi-bold;
}
.gilroy-bold {
  font-family: gilroy-bold;
}
.gilroy-medium {
  font-family: gilroy-medium;
}
.restrict-bold,
.restrict-bold span.gilroy-bold {
  font-family: gilroy-medium;
}
.primary-header {
  color: #072548;
  font-family: Gilroy-medium;
  font-size: 20px;
}
.acronym-container {
  height: 56px;
  min-height: 56px;
  max-height: 98px;
  width: 56px;
  min-width: 56px;
  max-width: 56px;
  border-radius: 4px;
  background-color: var(--light-gray2);
  text-align: center;
}
.acronym-container.small {
  height: 42px;
  min-height: 42px;
  max-height: 42px;
  width: 42px;
  min-width: 42px;
  max-width: 42px;
}
.acronym-container.large {
  height: 96px;
  min-height: 96px;
  max-height: 96px;
  width: 96px;
  min-width: 96px;
  max-width: 96px;
}
.acronym-container.extra-large {
  height: 124px;
  min-height: 124px;
  max-height: 124px;
  width: 124px;
  min-width: 124px;
  max-width: 124px;
}
.acronym-container.h-w-32px,
.hw-32 {
  height: 32px;
  min-height: 32px;
  max-height: 32px;
  width: 32px;
  min-width: 32px;
  max-width: 32px;
}
.acronym-container.hw-48 {
  height: 48px;
  min-height: 48px;
  max-height: 48px;
  width: 48px;
  min-width: 48px;
  max-width: 48px;
}
.acronym-container.h-w-88px {
  height: 88px;
  min-height: 88px;
  max-height: 88px;
  width: 88px;
  min-width: 88px;
  max-width: 88px;
}
.acronym-container.large.no-width,
.acronym-container.extra-large.no-width {
  width: auto;
  max-width: none;
}
.acronym-container span,
.acronym {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 12px;
  text-align: center;
}
.acronym-container.large span {
  font-size: 16px;
}
.text-overflow {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.disabled-link,
.disabled-link a {
  color: var(--medium-gray) !important;
  cursor: default;
  font-family: gilroy-medium;
  font-size: 13px;
  line-height: 15px;
  background-color: unset !important;
  pointer-events: none;
}
.show-filters {
  min-width: 275px;
  max-width: 275px;
}
.show-filters2 {
  min-width: 150px;
  max-width: 150px;
}
.filter-header {
  text-transform: uppercase;
  font-family: gilroy-bold;
  font-size: 10px;
  letter-spacing: 0.6px;
  color: rgba(95, 104, 116, 0.75);
}
.part-number-content {
  min-height: 24px;
  height: auto;
  min-width: 90px;
  border: 1px solid var(--silver);
  border-radius: 4px;
  background-color: var(--white);
  align-self: center;
  padding: 0 10px;
  overflow: hidden;
}
.part-number-text {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 11px;
  line-height: 13px;
  text-align: center;
}
.content-header2 {
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 13px;
}
.welcome-text {
  color: var(--navy);
  font-family: gilroy-light-italic;
  font-size: 18px;
}
.invalid-text {
  color: var(--red);
  font-family: gilroy-medium;
  font-size: 13px;
}
.label-text {
  color: var(--navy);
  font-size: 13px;
  font-family: gilroy-semi-bold;
}
.label-text-grey {
  color: #afb6be;
  font-family: Gilroy-medium;
  font-size: 13px;
}
.mdc-form-field > label {
  cursor: pointer;
}
.mdc-form-field > label {
  margin-left: -8px;
  padding-left: 0px !important;
}
.mat-mdc-slide-toggle .mdc-form-field > label,
.p-l-8-i {
  padding-left: 8px !important;
}
.mat-mdc-slide-toggle[labelposition=before] .mdc-form-field > label {
  padding-left: 0px !important;
  padding-right: 8px;
}
.mat-mdc-slide-toggle.label-p-r-24[labelposition=before] .mdc-form-field > label {
  padding-right: 24px;
}
.mat-form-field-underline {
  display: none;
}
.mat-mdc-form-field {
  font-size: 13px;
  font-family: gilroy-semi-bold;
}
.mat-mdc-form-field-infix .mat-mdc-input-element,
.editable-content {
  box-sizing: border-box;
  height: 33px;
  border: 1px solid var(--silver);
  border-radius: 2px;
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
  padding: 0 10px;
  font: unset;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
}
.editable-content {
  margin: 0;
  padding: 10px;
  height: 100%;
}
.editable-content:focus {
  border-color: var(--cool-green);
}
.mat-mdc-form-field.xs-input .mat-mdc-form-field-infix .mat-mdc-input-element {
  height: 40px;
  font-size: 16px;
}
.mat-mdc-form-field.custom-date-picker.xs-input .mat-mdc-form-field-infix .mat-datepicker-toggle .mat-mdc-icon-button {
  margin-top: 0px;
}
#dtCloudApp .mat-mdc-form-field-infix {
  min-height: 32px;
}
#dtCloudApp .wirepath-details .mat-mdc-form-field-infix {
  padding: 0px;
}
#dtCloudApp .reminderDatewidth .mat-mdc-form-field-infix {
  min-width: 180px !important;
}
#dtCloudApp .service-contract-date .mat-mdc-form-field-infix {
  min-height: unset;
}
#dtCloudApp .service-contract-date .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
  padding-top: unset;
  padding-bottom: unset;
}
.po-product-cost .mat-mdc-form-field-infix {
  display: flex;
}
#dtCloudApp .userGroup0padding.mat-mdc-form-field-type-mat-select .mat-mdc-form-field-infix {
  padding: 0 !important;
}
#dtCloudApp .mat-mdc-form-field-type-mat-select .mat-mdc-form-field-infix {
  padding-bottom: 0;
}
.service-detail .edit-detail .mat-mdc-form-field-infix,
.less-height-input .mat-mdc-form-field-infix {
  min-height: 24px !important;
}
.mat-mdc-input-element {
  background-color: var(--white);
}
.mat-mdc-form-field-infix .input-suffix + .mat-mdc-input-element {
  padding-right: 20px !important;
}
.mat-mdc-form-field-infix .input-suffix.feet + .mat-mdc-input-element {
  padding-right: 34px !important;
}
.mat-mdc-form-field-infix .input-suffix.metres + .mat-mdc-input-element {
  padding-right: 50px !important;
}
.mat-mdc-form-field-infix .input-prefix + .mat-mdc-input-element {
  padding-left: 20px !important;
}
.fr-CA .mat-mdc-form-field-infix .input-prefix + .mat-mdc-input-element {
  padding-left: 40px !important;
}
.mat-mdc-form-field-infix .input-prefix.currency-symb-border + .mat-mdc-input-element {
  padding-left: 35px !important;
}
.fr-CA .mat-mdc-form-field-infix .input-prefix.currency-symb-border + .mat-mdc-input-element {
  padding-left: 52px !important;
}
.mat-mdc-form-field.ng-valid .mat-mdc-form-field-infix .mat-mdc-input-element {
  color: var(--navy);
  background-color: #fff;
}
.mat-focused .mat-mdc-form-field-infix .mat-mdc-input-element {
  border: 1px solid var(--cool-green);
}
.mat-focused.mat-form-field-invalid .mat-mdc-form-field-infix .mat-mdc-input-element {
  border: 1px solid var(--red);
}
.mat-form-field-label {
  font: 500 13px gilroy-semi-bold;
}
.mat-form-field-can-float .mat-input-server:focus + .mat-form-field-label-wrapper .mat-form-field-label,
.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label {
  -webkit-transform: translateY(-1.34375em) scale(1);
  transform: translateY(-1.34375em) scale(1);
  width: 133.33333%;
}
.mat-mdc-form-field-label,
.mat-form-field.mat-focused .mat-form-field-label {
  color: var(--navy);
}
.mat-mdc-form-field.mat-form-field-invalid .mat-form-field-label {
  color: var(--red);
}
.mat-mdc-form-field .mat-mdc-form-field-infix .mat-form-field-label-wrapper label {
  padding-left: 10px;
}
textarea.mat-mdc-input-element.cdk-textarea-autosize,
.dt-textarea textarea.mat-mdc-input-element,
#schedule-textarea {
  padding-top: 10px;
}
.dt-textarea:not(.short-description) textarea.mat-mdc-input-element,
#schedule-textarea {
  min-height: 66px;
  height: auto;
}
.mat-mdc-form-field-hint,
.dummy-validation {
  font-size: 12px;
  font-family: gilroy-semi-bold;
  letter-spacing: normal;
}
.mat-mdc-form-field-hint {
  color: var(--medium-gray);
}
#dtCloudApp .dt-input.mat-mdc-input-element {
  box-sizing: border-box;
  height: 33px;
  border: 1px solid var(--silver);
  border-radius: 2px;
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
  padding: 0 10px;
  font: unset;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
  margin: 10px 0;
}
#dtCloudApp .dt-input.mat-mdc-input-element:focus {
  border: 1px solid var(--cool-green);
}
.zero-spacing-form-field.mat-mdc-form-field-type-mat-select {
  height: 33px;
}
.zero-spacing-form-field .mat-mdc-form-field-infix {
  padding: 0 !important;
}
.zero-spacing-form-field .mat-mdc-select {
  margin: 0;
}
.inline-editor mat-form-field {
  height: 36px;
}
.inline-editor mat-form-field.text-area-form-field {
  height: unset;
}
.input-height-33-i {
  height: 33px !important;
}
.inline-editor .mat-mdc-form-field-infix {
  padding: 0 !important;
}
.padding-less .mat-mdc-form-field-subscript-wrapper,
.no-form-field-subscript .mat-mdc-form-field-subscript-wrapper,
.ngx-mat-timepicker .mat-mdc-form-field-subscript-wrapper {
  display: none;
}
.inline-editor .mat-form-field-wrapper {
  padding-bottom: 0;
}
.inline-editor .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0;
}
.inline-editor .mat-mdc-form-field.ng-valid .mat-mdc-form-field-infix .mat-mdc-input-element,
.inline-editor .mat-mdc-select {
  margin-top: 0;
}
.inline-editor.inline-editor-has-title .mat-mdc-form-field.ng-valid .mat-mdc-form-field-infix .mat-mdc-input-element {
  margin-top: 5px;
}
.inline-editor .price-prefix-top-35:after,
.inline-editor .price-sufix-top-35:after {
  top: 20px;
}
.inline-editor .price-prefix-top-25:after,
.inline-editor .price-sufix-top-25:after {
  top: 25px !important;
}
.inline-editor .mat-radio-container {
  margin-top: 0;
  height: 20px !important;
}
.inline-editor .mat-mdc-form-field-infix .mat-mdc-input-element,
.inline-editor .mat-mdc-form-field-infix .mat-select {
  margin-top: 0;
}
.inline-editor .mat-mdc-form-field-infix {
  padding: 0;
  border-top-width: 0;
}
.inline-editor .mat-mdc-form-field-infix .input-prefix,
.inline-editor .mat-mdc-form-field-infix .input-suffix {
  top: 9px;
}
#laborTypeForm .inline-editor .mat-mdc-form-field-infix .input-prefix,
#laborTypeForm .inline-editor .mat-mdc-form-field-infix .input-suffix {
  top: 10px;
}
.address .mat-form-field-wrapper {
  padding-bottom: 4px !important;
  padding-top: 4px;
}
.company-address .address .mat-form-field-wrapper {
  padding-bottom: 16px !important;
}
.company-address .p-15 {
  padding: 0;
}
.company-address .address-country-container {
  margin-top: -20px;
}
.address .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0;
}
.address .mat-mdc-form-field.ng-valid .mat-mdc-form-field-infix .mat-mdc-input-element {
  margin-top: 0;
}
.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: 32px;
}
button {
  outline: none;
}
.mat-mdc-button {
  line-height: 15px !important;
  letter-spacing: 0;
  min-width: 98px !important;
  padding: 6px 12px !important;
  font-family: gilroy-medium;
  white-space: nowrap;
  height: 36px !important;
  font-size: 14px;
  border-radius: 5px !important;
}
.mat-mdc-menu-trigger.mat-mdc-button .mdc-button__label {
  order: -1;
}
.mat-mdc-button.xs-button {
  font-size: 16px;
  padding: 16px 24px !important;
}
.btn-with-more .mat-mdc-button {
  border-radius: 4px 0px 0px 4px !important;
  min-width: 124px !important;
}
.btn-with-more .mat-mdc-button:last-of-type {
  border-top-right-radius: 5px !important;
  border-bottom-right-radius: 5px !important;
}
.mat-mdc-mini-fab .mat-button-wrapper {
  padding: 0 !important;
}
.mat-mdc-mini-fab .mat-button-wrapper > * {
  vertical-align: unset;
}
.mini-fab-container {
  flex-direction: column;
  display: flex;
  place-content: center;
  align-items: center;
  padding: 8px 16px;
}
.mat-mdc-button.primary,
button.primary,
.ConfigFooter__AddTo.primary,
.mat-mdc-mini-fab.primary {
  border: 1px solid #03ad71;
  background-color: var(--green-blue2);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  color: var(--white) !important;
  font-family: gilroy-semi-bold;
}
.dashBoard-activeLink {
  border: 1px solid #03ad71 !important;
  background-color: var(--green-blue2) !important;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1) !important;
  color: var(--white) !important;
  font-family: gilroy-semi-bold !important;
  border-radius: 4px !important;
}
.mat-mdc-button.destruction,
button.destruction {
  border: 1px solid red;
  background-color: var(--red);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  color: var(--white);
  font-family: gilroy-semi-bold;
}
.mat-mdc-button.blue,
button.blue,
.mat-mdc-mini-fab.blue {
  border: 1px solid blue;
  background-color: var(--blue2);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  color: var(--white);
  font-family: gilroy-semi-bold;
}
.mat-mdc-mini-fab.blue {
  border: none;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.08) 100%),
    var(--blue);
  box-shadow: 0px 2px 4px rgb(1 22 47 / 16%);
}
.mat-mdc-button.primary.large,
.mat-button.mat-secondary.large {
  height: 50px;
  font-size: 16px;
  font-family: gilroy-semi-bold;
}
.mat-mdc-button.primary:hover,
button.primary:hover,
.ConfigFooter__AddTo.primary:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25);
}
.mat-mdc-button.primary.cdk-focused {
  background-color: #0c9d6a;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.25);
}
.mat-mdc-button.primary.cdk-focused.cdk-keyboard-focused {
  border: 1px solid #01724a;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.35);
}
.mat-mdc-button.primary[disabled],
.mat-button[disabled][disabled] {
  font-family: gilroy-medium;
  color: #bdc4c7 !important;
  background-color: var(--white) !important;
  box-sizing: border-box;
  border: 2px solid #bdc4c7 !important;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06) !important;
}
button.mat-mdc-button.blue-button {
  background-color: var(--blue);
  border-color: var(--blue);
  color: white;
}
.mat-mdc-button.mat-secondary {
  border: 2px solid var(--silver2);
  background-color: var(--white) !important;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
  color: var(--color-text-primary);
}
.mat-mdc-button.mat-secondary:hover {
  box-shadow: 0 2px 4px 0 rgba(82, 2, 2, 0.35);
}
.mat-mdc-button.mat-secondary.flat-button {
  border: unset;
  background-color: var(--white);
  background: unset;
  box-shadow: unset;
  color: var(--color-text-primary);
}
.mat-mdc-button.mat-secondary.cdk-focused.cdk-program-focused {
  border: 1px solid #9fa2a6;
  background-color: #f1f0f0;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
}
.mat-mdc-button.mat-secondary.cdk-focused.cdk-mouse-focused {
  border: 1px solid var(--silver);
  background-color: #f1f0f0;
  box-shadow: 0 2px 4px 0 #00000054;
}
.mat-mdc-button.destructive,
.mat-mdc-menu-item.destructive {
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%) !important;
  color: var(--color-alert) !important;
  font-size: 14px;
  font-family: gilroy-semi-bold;
}
.mat-mdc-button.mat-secondary.destructive,
.mat-mdc-menu-item.mat-secondary.destructive {
  margin-left: 10px !important;
  font-family: "gilroy-medium" !important;
  color: var(--color-alert) !important;
  border-radius: 5px !important;
  border: solid 2px var(--color-alert) !important;
  background-color: var(--white);
}
.mat-mdc-button.mat-secondary.destructive.checklistBtnFont,
.mat-mdc-menu-item.mat-secondary.destructive.checklistBtnFont {
  font-family: "gilroy-semi-bold" !important;
}
#dtCloudApp .mdc-list-item__primary-text,
#dtCloudApp .mat-mdc-menu-item-text {
  color: inherit;
  display: flex;
  flex-direction: row;
  align-items: center;
  white-space: normal;
  width: 100%;
}
#dtCloudApp .menu-content-space-between .mat-mdc-menu-item-text {
  align-items: center;
  justify-content: space-between;
  gap: 64px;
}
.custom-service-call-filter .mat-mdc-menu-item-text {
  justify-content: flex-start !important;
  gap: 5px !important;
}
#dtCloudApp .todoOptions .mat-mdc-menu-item-text,
#dtCloudApp .user-menu-info-container .mat-mdc-menu-item-text {
  justify-content: unset !important;
  gap: unset !important;
}
#dtCloudApp .mdc-list-item__primary-text div span {
  padding-right: 8px;
}
.mat-mdc-button.destructive {
  border: 1px solid var(--silver);
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
}
.mat-mdc-button.destructive:hover,
.mat-mdc-menu-item.destructive:hover {
  background-color: #fbc6c6 !important;
}
.mat-mdc-button.destructive:hover {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.35);
}
.mat-mdc-button.destructive.cdk-focused.cdk-program-focused,
.mat-mdc-menu-item.destructive.cdk-focused.cdk-program-focused {
  background-color: #f1f0f0;
}
.mat-mdc-button.destructive.cdk-focused.cdk-mouse-focused,
.mat-mdc-menu-item.destructive.cdk-focused.cdk-mouse-focused {
  background-color: #fbc6c6;
}
.mat-mdc-button.primary.blue:not(:disabled) {
  background-color: var(--blue);
  border: 1px solid var(--blue);
}
.mat-mdc-icon-button.more-menu-icon-button {
  height: 18px;
  width: 18px;
  line-height: 18px;
}
button.mat-mdc-button.new-attachment {
  height: 30px;
  max-height: 30px;
  min-width: 65px !important;
  width: auto;
  text-align: end;
  font-family: gilroy-medium;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
  color: #1d2836 !important;
  border-radius: 2px !important;
  margin-left: 20px;
}
button.mat-mdc-button.new-attachment:before {
  content: "+";
  position: relative;
  left: -3px;
}
.btn-with-more-btn {
  border-radius: 0 5px 5px 0;
  background-color: var(--cool-green);
  height: 32px;
  width: 25px;
}
.btn-with-more .btn-with-more-btn.mat-mdc-button {
  padding: 0 !important;
  min-width: 32px !important;
  border-radius: 0 4px 4px 0 !important;
  background-color: var(--cool-green);
}
@media (max-width: 599px) {
  .btn-with-more-btn {
    height: 26px;
  }
}
.btn-with-more-btn.secondary {
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  background-color: var(--white);
  border: 1px solid var(--silver);
}
button img {
  margin-right: 10px;
}
.back-arrow {
  background-color: white;
  border: 1px solid lightgray;
  border-radius: 5px;
  width: 40px;
  height: 40px;
  max-height: 40px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.close-btn {
  height: 40px;
  width: 40px;
  background-color: var(--white);
  position: absolute;
  z-index: 10001 !important;
  margin-left: -56px;
  margin-top: 32px;
  border-radius: 4px;
  cursor: pointer;
  border: 1px solid #C4CCDA;
}
.isIphone.close-btn {
  z-index: 9999 !important;
}
.more-btn {
  height: 28px;
  width: 34px;
  border: 1px solid var(--silver);
  border-radius: 4px;
  background-color: var(--white);
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
}
.filter-btn {
  padding: 0 8px !important;
  width: 30px;
  height: 30px;
  border-radius: 5px !important;
  background-image:
    linear-gradient(
      to bottom,
      rgba(1, 22, 47, 0),
      rgba(1, 22, 47, 0.02)),
    linear-gradient(var(--white), var(--white));
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
  border: solid 0.5px var(--silver) !important;
  min-height: 25px;
  font-size: 13px;
  text-transform: capitalize;
  line-height: 16px !important;
  margin-right: 10px !important;
  opacity: 1;
}
.filter-btn.active {
  background-image:
    linear-gradient(
      to bottom,
      rgba(1, 22, 47, 0),
      rgba(1, 22, 47, 0.02)),
    linear-gradient(#dcdfe2, #dcdfe2);
}
.mat-mdc-button.item-status-button .mat-button-focus-overlay {
  opacity: 0 !important;
}
.mat-mdc-select {
  outline: 0;
  box-sizing: border-box;
  height: 33px;
  line-height: 33px;
  border: 1px solid var(--silver2);
  border-radius: 2px;
  box-shadow: 0px 1px 5px rgb(0 0 0 / 6%);
  padding: 0 10px;
  font: 500 13px gilroy-medium;
  color: var(--gray2);
  margin-top: 5px;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0.0001) 2.56%,
      rgba(1, 22, 47, 0.022928) 100%),
    var(--white);
}
.smsOptin.mat-mdc-select {
  font-family: "gilroy-medium" !important;
  max-width: 200px;
}
.red.smsOptin.mat-mdc-select {
  color: var(--red);
}
.gray.smsOptin.mat-mdc-select {
  color: var(--medium-gray);
}
.mat-mdc-select-trigger {
  align-items: center;
  height: 31px;
}
.dt-mat-filter-select {
  margin-top: 25px;
}
.mat-mdc-select-panel {
  border: 1px solid var(--color-divider-dark);
  box-shadow: 0px 2px 12px 0px rgba(1, 22, 47, 0.16) !important;
  border-radius: 4px !important;
}
.mat-mdc-select.filter,
.mat-select.filter .mat-select-trigger {
  height: 25px;
  line-height: 25px;
}
.mat-mdc-select.filter {
  margin-top: 0;
}
.mat-mdc-form-field {
  font-size: 13px;
  font-family: gilroy-medium;
  position: relative;
}
.mat-mdc-form-field.width-auto {
  width: auto;
}
.mat-mdc-form-field.width-auto .mat-mdc-form-field-infix {
  width: auto;
}
.mat-mdc-form-field.input-wrapper {
  padding: 0 10px;
}
.mat-mdc-form-field.no-padding .mat-form-field-wrapper,
.mat-form-field.no-padding .mat-form-field-wrapper .mat-form-field-flex {
  padding: 0 !important;
}
.mat-mdc-form-field.no-padding .mat-form-field-wrapper .mat-form-field-flex .mat-mdc-form-field-infix {
  padding: 0 !important;
  border: none;
}
.mat-select-trigger {
  height: 31px;
  line-height: 31px;
}
.mat-mdc-option.mat-selected:not(.mat-mdc-option-multiple):not(.mat-option-disabled) {
  background: var(--light-gray2);
}
.primary .mat-mdc-option.mat-selected:not(.mat-option-disabled) {
  color: #072548;
}
.mat-select-arrow {
  color: var(--black-pearl);
}
.mat-select-arrow-wrapper {
  display: inherit !important;
  height: 0px !important;
}
.account-registration-container .mat-horizontal-stepper-header-container {
  display: none !important;
}
.account-registration-container .mat-horizontal-content-container {
  padding: 0;
}
.full-page-dialog.mat-horizontal-stepper-header-container {
  display: none !important;
}
.full-page-dialog .mat-horizontal-content-container {
  padding: 0;
}
.headline-main {
  font-weight: unset;
  padding-right: 15px;
  padding-left: 16px;
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 26px;
  margin-left: 2px;
}
.headline {
  font-weight: unset;
  color: var(--navy);
  font-family: gilroy-semi-bold;
}
.wizard-btn {
  height: 33px;
  width: 115px;
  font-family: gilroy-medium;
  font-size: 13px;
  text-align: center;
  position: relative;
  border-radius: 3px;
  line-height: 2.5;
  cursor: pointer;
  box-sizing: border-box;
}
.wizard-btn:after {
  width: 23.335px;
  height: 23.335px;
  content: "";
  position: absolute;
  box-sizing: border-box;
}
.wizard-btn.flat-button:after,
.wizard-btn.complete:after {
  display: none;
}
.wizard-btn-primary {
  background-color: var(--green-blue2);
  color: var(--white);
  border: 1px solid #03ad71;
  font-family: gilroy-semi-bold;
}
.wizard-btn-primary:hover {
  box-shadow: 0 2px 4px 0 rgb(0 0 0 / 35%);
}
.wizard-btn-primary:after {
  top: 5px;
  right: -12px;
  transform: rotate(45deg);
  background-color: var(--green-blue2);
}
.account-registration-wizard .mat-mdc-button.primary[disabled]:after,
.account-registration-wizard .mat-button[disabled][disabled]:after {
  background-color: var(--silver);
}
.wizard-btn-primary .md-ripple-container {
  z-index: 3;
  width: 120%;
}
.wizard-btn-standard {
  border: solid 1px var(--silver) !important;
  background-color: var(--white);
  color: var(--navy);
  font-size: 12px;
}
.wizard-btn-primary.disabled,
.wizard-btn-standard.disabled {
  font-size: 12px;
  color: var(--medium-gray);
  background-color: #f3f4f5 !important;
  border: solid 1px var(--silver);
  cursor: default;
  box-shadow: unset !important;
}
.wizard-btn-standard.disabled:after {
  top: 4px;
  left: -12px;
  transform: rotate(45deg);
  box-shadow: 0 0.5px 2.5px 0 rgba(0, 0, 0, 0.06);
  background-color: #f3f4f5 !important;
}
.wizard-btn-primary.disabled:after {
  background-color: #f3f4f5 !important;
  box-shadow: 0 0.5px 2.5px 0 rgba(0, 0, 0, 0.06);
  border: solid 2px var(--cool-green);
  border-left: none;
  border-bottom: none;
  top: 4px;
}
.wizard-btn-standard .tooltiptext,
.wizard-btn-primary .tooltiptext {
  visibility: hidden;
  position: absolute;
}
.wizard-btn-standard.disabled .tooltiptext,
.wizard-btn-primary.disabled .tooltiptext {
  visibility: hidden;
  max-width: 200px;
  background-color: black;
  color: var(--white);
  text-align: center;
  border-radius: 6px;
  padding: 5px 8px;
  position: absolute;
  z-index: 1;
  font-size: 12px;
  font-family: gilroy-medium;
  top: -9px;
  left: 50%;
  width: max-content;
  -webkit-transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
  line-height: 1;
}
.wizard-btn-primary.disabled .tooltiptext {
  left: unset;
  right: 50%;
}
.wizard-btn-standard.disabled:hover .tooltiptext {
  visibility: visible;
}
.wizard-btn-primary.disabled:hover .tooltiptext {
  visibility: visible;
}
.wizard-btn-primary.disabled:active {
  pointer-events: none;
}
.wizard-btn-standard.disabled:active {
  pointer-events: none;
}
.wizard-btn-standard:after {
  top: 6px;
  left: -11px;
  transform: rotate(45deg);
  background-color: var(--white);
  border: solid 1px var(--silver);
  border-right: none;
  border-top: none;
  box-sizing: border-box;
}
.wizard-btn-standard:hover {
  box-shadow: 0 2px 4px 0 rgb(0 0 0 / 35%);
}
.wizard-btn-standard:active:after {
  background-color: #f1f0f0;
  cursor: pointer;
  background-color: #f1f0f0;
}
.wizard-btn-standard:active {
  background-color: #f1f0f0;
  cursor: pointer;
  border: 1px solid var(--silver);
  border-radius: 2px;
  background-color: #f1f0f0;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.33);
  background-color: #f1f0f0;
}
.wizard-btn-standard .md-ripple-container {
  z-index: 3;
}
.wizard-footer {
  position: absolute;
  bottom: 0;
  height: 60px;
  width: 100%;
}
.edit-mode .mat-mdc-input-element:disabled {
  background: white;
  color: var(--navy);
}
.edit-mode .mat-mdc-form-field-infix .mat-mdc-input-element {
  border: unset;
  box-shadow: unset;
}
.edit-detail .mat-form-field-label-wrapper {
  top: -15px;
}
.edit-detail label,
.edit-label {
  color: var(--slate-gray) !important;
  font-family: gilroy-medium !important;
  font-size: 13px !important;
}
@media (min-width: 600px) {
  .detail-panel {
    min-width: 350px;
    width: 350px;
  }
}
.detail-panel .mat-mdc-form-field-infix {
  padding: 0px !important;
}
.field-P {
  padding: 15px 0px 10px 0px;
}
.address-map {
  max-width: 90px;
  max-height: 90px;
}
.address-map img {
  min-width: 90px;
  min-height: 90px;
}
.client-address .address-map,
.client-address .address-map img {
  min-width: 48px;
  min-height: 48px;
}
.example-header-image {
  background-size: cover;
}
.attachment img {
  height: 32px;
  border-radius: 2px;
  object-fit: cover;
}
.attachment-icon {
  color: white;
  background-color: var(--cool-green);
  height: 32px;
  max-width: 11% !important;
  border-radius: 2px;
}
.view-all-attachments {
  color: var(--cool-green);
  font-size: 13px;
}
.attachment-row:hover {
  background: rgba(0, 181, 117, 0.1);
}
.contact-email a {
  text-decoration: none;
  line-height: 23px;
}
.contact-edit-outline {
  padding: 8px;
  border: 1px solid var(--silver);
}
app-address.address .mat-mdc-form-field-infix {
  width: unset !important;
  padding: 0px !important;
  border-top: 1px solid transparent;
}
app-address.address .mat-form-field-appearance-standard.street1 .mat-form-field-flex {
  padding-top: 0px;
}
app-address.address .mat-form-field-appearance-standard.street1 .mat-mdc-form-field-infix .mat-mdc-input-element {
  margin-top: 0px;
}
.edit-mode-address {
  border: 1px solid lightgray;
  padding: 10px;
}
.company-address app-address-detail .edit-mode-address {
  border: none;
  padding: unset;
}
.company-address app-address-detail #address {
  padding: unset;
}
.pac-container:after {
  background-image: none !important;
  height: 0px;
}
.pac-icon {
  background: white;
  width: 0px;
  height: 0px;
}
.pac-item {
  line-height: 34px;
}
.bottom-panel {
  position: absolute;
  bottom: 0;
  right: 150px;
}
.hdpi .pac-icon {
  background-image: none !important;
}
.remove-icon {
  width: 8px !important;
  height: 8px !important;
  position: relative;
  top: -3px;
  left: 1px;
}
.remove-icon path {
  fill: #fff;
}
.hover-more-icon path {
  fill: #fff;
}
.add-icon path {
  fill: var(--cool-green);
}
.add-icon-black path {
  fill: var(--navy);
}
.cancel-subscription-icon-green path {
  fill: var(--cool-green);
}
.cancel-subscription-clock-icon-gray path {
  stroke: var(--medium-gray);
}
.cancel-subscription-clock-icon-green path {
  stroke: var(--cool-green);
}
.cancel-subscription-icon-gray path {
  fill: var(--medium-gray);
}
.forward-arrow svg {
  transform: rotate(270deg);
}
.proposal-preview-btn path {
  fill: #fff;
}
.invite-field-user-icon path {
  fill: var(--cool-green);
}
.remove-icon-background {
  width: 16px !important;
  height: 16px !important;
  border: solid var(--medium-gray);
  background-color: var(--medium-gray);
  border-radius: 50%;
}
.card-medium {
  max-width: 1200px;
}
@media (min-width: 1200px) {
  .card-medium {
    min-width: 1200px;
  }
}
.detail-list .show-on-hover,
.address-icon .show-on-hover,
.page-header .show-on-hover {
  visibility: hidden;
}
.detail-list:hover .show-on-hover,
.address-icon:hover .show-on-hover,
.show-on-hover-container:hover .show-on-hover,
.page-header:hover .show-on-hover {
  visibility: visible;
}
.detail-list .mat-mdc-icon-button {
  width: 30px;
  height: 18px;
  line-height: unset;
}
.status-tag {
  border-radius: 3px;
  color: var(--white);
  font-family: gilroy-medium;
  font-size: 11px;
  text-align: center;
  text-transform: uppercase;
  padding: 5px;
  white-space: nowrap;
  display: inline-block;
  line-height: 11px;
  letter-spacing: 0.5px;
}
.status-tag.item-status,
.status-tag.circle {
  width: 16px;
  height: 16px;
  padding: 0;
  border-radius: 50%;
}
.status-tag.pink1 {
  background-color: var(--pink1);
}
.acronym-background {
  background-color: var(--light-gray2);
  text-align: center;
  vertical-align: middle;
  color: var(--medium-gray);
  text-transform: uppercase;
  font-size: 11px;
  font-family: gilroy-medium;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  display: inline-block;
  width: 32px;
  height: 32px;
  line-height: 32px !important;
}
.empty-grid-message {
  color: #848f9b;
  font-family: gilroy-medium;
  font-size: 13px;
  line-height: 18px;
}
.empty-block {
  display: flex;
  flex-direction: column;
  width: 100%;
  border-radius: 4px;
  padding: 50px 20px;
  justify-content: center;
  align-items: center;
  background-color: var(--light-gray2);
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 13px;
  text-align: center;
  opacity: 0.8;
}
.empty-block > * {
  margin-bottom: 10px;
  max-width: 550px;
}
.empty-block-header {
  font-size: 15px;
}
.inf-label {
  color: var(--medium-gray) !important;
  font-family: gilroy-medium !important;
  font-size: 11px !important;
  opacity: 0.74 !important;
  margin-bottom: 6px;
}
.mobile-notification-icon {
  opacity: 0.6;
}
.mobile-notification-icon.green-icon {
  opacity: 1;
}
.navigation-text {
  font-family: gilroy-semi-bold;
  font-size: 12px;
  color: var(--medium-gray);
  cursor: pointer;
  white-space: nowrap;
  max-width: 100%;
}
.navigation-text span {
  text-overflow: ellipsis;
  overflow: hidden;
  font-family: gilroy-medium;
}
.navigation-text span:hover {
  color: var(--cool-green);
}
.dropzone .dz-message,
.dropzone .dz-preview,
.dropzone .dz-default {
  display: none !important;
}
.drop-btn .dz-message,
.drop-btn .dz-preview,
.drop-btn .dz-default {
  display: none !important;
}
.dropzone.dz-clickable * {
  cursor: pointer;
}
.supplier-logo {
  height: 54px;
  width: 54px;
  border-radius: 5px;
}
.img-upload2 {
  align-items: center;
  background-color: var(--white);
  border-radius: 6px;
  border: 1px dashed var(--silver);
  cursor: default !important;
  display: flex;
  flex-direction: column;
  height: 200px;
  max-height: 200px;
  max-width: 225px;
  min-height: 200px;
  min-width: 225px;
  place-content: center;
  width: 225px;
}
.import-img-upload {
  align-items: center;
  background-color: var(--white);
  border-radius: 6px;
  border: 1px dashed var(--silver);
  cursor: default !important;
  display: flex;
  flex-direction: column;
  height: 136px;
  max-height: 136px;
  max-width: 226px;
  min-height: 136px;
  min-width: 226px;
  place-content: center;
  width: 226px;
}
.img-upload2.valid,
.import-img-upload.valid {
  border: 1px dashed var(--cool-green);
}
.img-upload2.in-valid,
.import-img-upload.in-valid {
  border: 1px dashed var(--red);
}
.img-upload2.valid-file,
.import-img-upload.valid-file {
  background-color: rgba(13, 187, 125, 0.15);
  border: 1px solid var(--cool-green);
}
.file-upload,
.file-upload-success {
  border: 2px solid var(--cool-green);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  padding: 10px;
  pointer-events: none;
}
.file-upload.pre-import {
  border-color: var(--medium-gray);
}
.import-step-text,
.wizard-step-text {
  color: #1d2836;
  font-family: gilroy-semi-bold;
  font-size: 21px;
}
.import-step-text {
  text-align: center;
}
.img-upload {
  height: 180px;
  width: 192px;
  min-height: 100% !important;
  min-width: 192px;
  max-height: 100% !important;
  max-width: 192px;
  cursor: pointer;
  border: 1px dashed var(--silver);
  border-radius: 8px;
  background-color: var(--light-gray);
  padding: 0 !important;
}
.img-upload.import-upload-container {
  height: 210px;
  max-height: 210px;
  max-width: 240px;
  min-height: 210px;
  min-width: 240px;
  width: 240px;
}
.img-upload.valid-image {
  border: 1px solid var(--silver);
}
.img-upload.valid,
.image-upload-multiple.valid {
  border: 1px solid var(--cool-green) !important;
}
.img-upload.in-valid,
.image-upload-multiple.in-valid {
  border: 1px solid var(--red) !important;
}
.img-upload.in-valid .arrow-up-box,
.image-upload-multiple.in-valid .arrow-up-box {
  color: var(--red);
}
.file-upload-with-url-option .img-upload {
  border-radius: 8px 8px 0 0;
  border-bottom: unset;
  height: 145px !important;
  width: 192px !important;
}
app-upload-file.attachments-content div div:not(.file-upload-with-url-option) .img-upload {
  border: 1px dashed var(--silver);
  border-radius: 8px;
  height: 180px !important;
}
app-upload-file.attachments-content .img-upload {
  width: 192px !important;
  min-height: 100% !important;
  min-width: 192px !important;
  max-height: 100% !important;
  max-width: 192px !important;
  cursor: pointer;
  background-color: var(--light-gray);
  padding: 0 !important;
  margin: 20px 0px 20px 0px;
}
app-upload-file.attachments-content .img-upload.todo-uploadContent {
  width: 192px !important;
  min-height: 100% !important;
  min-width: 192px !important;
  max-height: 100% !important;
  max-width: 192px !important;
  cursor: pointer;
  background-color: var(--light-gray);
  padding: 0 !important;
  margin: 0px !important;
}
app-upload-file.attachments-content2 .img-upload {
  position: relative;
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  height: 146px;
  width: 146px;
  min-height: 146px;
  min-width: 146px;
  max-height: 146px;
  max-width: 146px;
  margin: 10px 0px 10px 0px;
}
app-upload-file.attachments-content2 .img-upload.servicecCall {
  margin: 10px !important;
}
#fileUpload textarea#txtUploadUrl {
  min-height: 33px;
  height: 36px;
  border-radius: 0 0 8px 8px !important;
  border: 1px dashed var(--silver);
  white-space: nowrap;
  overflow: hidden;
}
.attachments-dialog app-button-with-menu .dz-preview.dz-image-preview {
  display: none !important;
}
.dz-preview.dz-image-preview,
#attachmentUploadComp .dz-preview.dz-image-preview {
  display: none !important;
}
.img-upload.dropzone-over {
  border: 1px solid var(--cool-green);
}
.img-upload.dropzone-error {
  border: 1px solid var(--red) !important;
}
.arrow-up-box,
.dropzone-icon {
  height: 31px;
  width: 31px;
  padding: 5px;
  font-size: 18px;
  border: 1px solid;
  border-radius: 4px;
  color: var(--cool-green);
  text-align: center;
}
.drag-error .dropzone-icon {
  color: var(--red);
  border-color: var(--red);
}
.drag-error .img-text.error-text {
  color: var(--red);
  border-color: var(--red);
}
.img-text {
  color: var(--medium-gray);
  font-size: 13px !important;
  text-align: center;
}
.upload-success,
.green-border {
  border: 1px solid var(--cool-green) !important;
}
.upload-failed {
  border: 1px solid var(--red) !important;
}
.moreIcon-position {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  pointer-events: auto;
  cursor: pointer;
}
.design-filter .mat-form-field-wrapper {
  padding-bottom: 0px !important;
}
.design-filter .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0px;
}
.design-filter .mat-mdc-form-field-infix {
  padding: 5px 0 5px 0px;
  border-top: unset;
}
.settings-header {
  padding: 8px 0px 8px 0px;
}
.item-count,
.settings-header > .title {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 20px;
}
.header-mat-select.mat-mdc-form-field {
  max-width: fit-content;
}
.header-mat-select .mat-form-field-wrapper {
  padding-bottom: 0px;
}
.header-mat-select.mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0px;
}
.header-mat-select .mat-mdc-form-field-infix {
  padding: 0px;
  border-top: unset;
}
.group-header {
  font-family: gilroy-semi-bold;
  font-size: 16px;
  color: var(--navy);
}
.status-preview {
  color: var(--white);
  border-radius: 3px;
  padding: 8px 24px;
  line-height: 11px;
  white-space: nowrap;
  font-family: gilroy-medium;
  white-space: normal;
  line-height: 16px;
}
.preview-container {
  font-size: 11px !important;
  text-transform: uppercase !important;
  padding: 8px !important;
  line-height: 11px !important;
  font-family: gilroy-regular !important;
}
.statusBtn-orange.oval,
.statusBtn-blue.oval,
.statusBtn-green.oval,
.statusBtn-red.oval,
.statusBtn-yellow.oval,
.statusBtn-grey.oval,
.statusBtn-gray.oval,
.statusBtn-Orange.oval,
.statusBtn-Blue.oval,
.statusBtn-Green.oval,
.statusBtn-Red.oval,
.statusBtn-Yellow.oval,
.statusBtn-Grey.oval {
  padding: 3px 7px;
  border-radius: 10px;
  text-transform: capitalize;
  display: inline-block;
  line-height: 11px;
}
.status-tag.orange.oval,
.status-tag.blue.oval,
.status-tag.green.oval,
.status-tag.red.oval,
.status-tag.yellow.oval,
.status-tag.grey.oval,
.status-tag.gray.oval,
.status-tag.Orange.oval,
.status-tag.Blue.oval,
.status-tag.Green.oval,
.status-tag.Red.oval,
.status-tag.Yellow.oval,
.status-tag.Grey.oval {
  padding: 3px 7px;
  border-radius: 10px;
  text-transform: capitalize;
  display: inline-block;
  line-height: 11px;
}
.statusBtn-orange,
.statusBtn-blue,
.statusBtn-green,
.statusBtn-red,
.statusBtn-yellow,
.statusBtn-grey,
.statusBtn-gray,
.statusBtn-Orange,
.statusBtn-Blue,
.statusBtn-Green,
.statusBtn-Red,
.statusBtn-Yellow,
.statusBtn-Grey,
.statusBtn-purple,
.statusBtn-pink {
  color: var(--white);
  font-size: 11px;
  border-radius: 3px;
  text-transform: uppercase;
  padding: 3px;
  line-height: 11px;
  white-space: nowrap;
  font-family: gilroy-medium;
  width: max-content;
  padding: 5px;
  letter-spacing: 0.5px;
}
.status-purple {
  background-color: var(--purple4);
  color: var(--white);
}
.status-pink {
  background-color: var(--pink1);
  color: var(--white);
}
.status-preview.orange,
.status-preview.Orange,
.status-kanban .Orange,
.status-orange,
.status-Orange {
  background-color: var(--orange);
  color: var(--white);
}
.status-preview.blue,
.status-preview.Blue,
.status-kanban .Blue,
.status-blue,
.status-Blue {
  background-color: var(--blue);
  color: var(--white);
}
.status-preview.green,
.status-preview.Green,
.status-kanban .Green,
.status-green,
.status-Green {
  background-color: var(--cool-green);
  color: var(--white);
}
.status-preview.red,
.status-preview.Red,
.status-kanban .Red,
.status-red,
.status-Red {
  background-color: var(--red);
  color: var(--white);
}
.statusBtn-pink,
.statusBtn-Pink,
.status-preview.pink,
.status-preview.Pink,
.status-kanban .Pink,
.status-pink,
.status-Pink {
  background-color: var(--pink);
  color: var(--white);
}
.status-preview.yellow,
.status-preview.Yellow,
.status-kanban .Yellow,
.status-yellow,
.status-Yellow {
  background-color: var(--yellow);
  color: var(--navy);
}
.status-preview.grey,
.status-preview.Grey,
.status-preview.gray,
.status-preview.Gray,
.status-kanban .Grey,
.status-kanban .Gray,
.status-grey,
.status-Grey,
.status-gray,
.status-Gray {
  background-color: var(--light-gray2);
  color: var(--navy);
}
.status-preview.lightgray,
.status-preview.LightGray,
.status-kanban .LightGray,
.status-lightgray,
.status-LightGray {
  background-color: #9ca3af;
  color: var(--navy);
}
.statusBtn-orange,
.statusBtn-Orange,
.status-orange {
  background-color: var(--orange);
  color: var(--navy);
}
.statusBtn-blue,
.statusBtn-Blue,
.status-blue {
  background-color: var(--blue);
  color: var(--white);
}
.statusBtn-green,
.statusBtn-Green,
.status-green {
  background-color: var(--cool-green);
}
.statusBtn-red,
.statusBtn-Red,
.status-red {
  background-color: var(--red);
  color: var(--white);
}
.statusBtn-pink,
.statusBtn-Pink,
.status-pink {
  background-color: var(--pink);
  color: var(--white);
}
.statusBtn-red1,
.statusBtn-Red1,
.status-red1,
.status-Red1 {
  background-color: var(--red1);
}
.statusBtn-yellow,
.statusBtn-Yellow,
.status-yellow,
.status-Yellow {
  background-color: var(--yellow);
  color: var(--navy);
}
.statusBtn-grey,
.statusBtn-Grey,
.status-grey,
.status-Grey,
.statusBtn-gray,
.statusBtn-Gray,
.status-gray,
.status-Gray {
  background-color: var(--light-gray2);
  color: var(--navy);
}
.status-blue1,
.status-Blue1 {
  background-color: var(--blue1);
  color: var(--white);
}
.status-blue2,
.status-Blue2 {
  background-color: var(--blue2);
  color: var(--white);
}
.status-blue3,
.status-Blue3 {
  background-color: var(--blue3);
  color: var(--white);
}
.status-gray1,
.status-Gray1 {
  background-color: var(--gray1);
  color: var(--white);
}
.status-gray2,
.status-Gray2 {
  background-color: var(--gray2);
  color: var(--white);
}
.status-gray3,
.status-Gray3 {
  background-color: var(--gray3);
  color: var(--white);
}
.status-green1,
.status-Green1 {
  background-color: var(--green1);
  color: var(--white);
}
.status-green2,
.status-Green2 {
  background-color: var(--cool-green);
  color: var(--white);
}
.status-green3,
.status-Green3 {
  background-color: var(--green3);
  color: var(--white);
}
.status-orange1,
.status-Orange1 {
  background-color: var(--orange1);
  color: var(--white);
}
.status-orange2,
.status-Orange2 {
  background-color: var(--orange2);
  color: var(--white);
}
.status-orange3,
.status-Orange3 {
  background-color: var(--orange3);
  color: var(--white);
}
.status-purple1,
.status-Purple1 {
  background-color: var(--purple1);
  color: var(--white);
}
.status-purple2,
.status-Purple2 {
  background-color: var(--purple2);
  color: var(--white);
}
.status-purple3,
.status-Purple3 {
  background-color: var(--purple3);
  color: var(--white);
}
.status-red1,
.status-Red1 {
  background-color: var(--red1);
  color: var(--white);
}
.status-red2,
.status-Red2 {
  background-color: var(--red);
  color: var(--white);
}
.indicator-button {
  width: fit-content;
  border: 1px solid;
  display: flex;
  border-radius: 25px;
  padding: 5px 10px;
  align-items: center;
  background-color: var(--white);
  border: 1px solid var(--silver);
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.02) 100%);
}
.indicator {
  height: 9px;
  width: 9px;
  border-radius: 50%;
}
.indicator.yellow,
.indicator.Yellow {
  background-color: #fbdd30cc;
}
.indicator.green,
.indicator.Green {
  background-color: var(--cool-green);
}
.indicator.blue,
.indicator.Blue {
  background-color: var(--blue);
}
.indicator.grey,
.indicator.Gray {
  background-color: #808080;
}
.indicator.red,
.indicator.Red {
  background-color: var(--red);
}
.indicator.orange,
.indicator.Orange {
  background-color: var(--orange);
}
.list-title {
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
  line-height: 20px;
}
.mat-mdc-icon-button .mat-mdc-button-ripple,
.mat-mdc-icon-button .mat-mdc-button-persistent-ripple,
.mat-mdc-icon-button .mat-mdc-button-persistent-ripple::before {
  display: none;
}
.mat-mdc-icon-button .mat-mdc-button-touch-target {
  height: 28px !important;
  width: 28px !important;
}
.mat-mdc-radio-button {
  line-height: 40px;
}
.mat-mdc-radio-button.mat-accent {
  --mat-mdc-radio-ripple-color: transparent;
  --mat-mdc-radio-checked-ripple-color: transparent;
}
.mat-mdc-radio-button .mdc-form-field {
  color: var(--navy);
}
.mat-mdc-radio-button.full-width-radio-button .mdc-form-field,
.mat-mdc-radio-button.full-width-radio-button .mdc-form-field > label {
  width: 100%;
}
.mat-mdc-radio-button .mdc-form-field > label {
  line-height: 1;
  display: flex;
  align-items: center;
  padding-left: 0;
}
.mat-mdc-radio-button.display-unset .mdc-form-field > label {
  display: unset;
}
.mat-mdc-radio-button.mat-accent .mat-radio-inner-circle,
.mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element:not(.mat-radio-persistent-ripple),
.mat-radio-button.mat-accent.mat-radio-checked .mat-radio-persistent-ripple,
.mat-radio-button.mat-accent:active .mat-radio-persistent-ripple {
  background-color: var(--green-blue);
}
#dtCloudApp .mat-mdc-radio-button .mdc-radio {
  padding: 0 8px 0 0;
}
#dtCloudApp table tr td .mat-mdc-radio-button .mdc-radio {
  padding: 0 8px !important;
}
.mdc-radio__background {
  top: -4px;
}
.mat-mdc-radio-group.radio-button-label-with-info .mat-mdc-radio-button label,
.mat-mdc-radio-button.radio-button-label-with-info label {
  flex-direction: column;
  align-items: flex-start;
}
.mat-calendar-body {
  font-size: 12px;
}
.mat-calendar-body-cell-content {
  width: 60% !important;
  height: 60% !important;
  border-radius: 3px !important;
}
.mat-calendar-header {
  padding: 0 8px !important;
}
.servicecallCalender .mat-calendar-header {
  padding: 0 8px !important;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background-color: var(--blue);
  z-index: 1;
}
.servicecallCalender .mat-calendar-table-header th {
  padding-right: 24px !important;
}
.mat-calendar-next-button::after,
.mat-calendar-previous-button::after {
  margin: 0 !important;
}
.mat-calendar-period-button {
  font-family: "gilroy-semi-bold";
}
.mat-calendar-body-label[colspan="7"],
.mat-calendar-arrow {
  display: none !important;
}
.mat-calendar-body-label {
  color: transparent !important;
}
.mat-calendar-table,
.ngx-mat-timepicker-table {
  background-color: var(--white);
  padding: 0;
  border-spacing: unset;
}
.ngx-mat-timepicker-table td {
  box-shadow: unset;
  padding: 1px;
}
.mat-calendar-table-header-divider::after {
  background: transparent !important;
}
.date-picker-white-bg .mat-form-field-appearance-fill .mat-form-field-flex {
  background-color: var(--white);
}
.ngx-mat-timepicker-tbody > *:first-of-type,
.ngx-mat-timepicker-tbody > *:last-of-type {
  display: none;
}
.ngx-mat-timepicker-tbody .mat-form-field-appearance-legacy .mat-mdc-form-field-infix {
  padding: 0;
  margin-top: 0;
  border: unset;
}
.ngx-mat-timepicker-tbody .mat-form-field-appearance-legacy .mat-form-field-wrapper {
  padding: 0;
  margin: 0;
}
.ngx-mat-timepicker-tbody .mat-mdc-form-field-infix .mat-mdc-input-element {
  height: 32px;
  padding: 0 2px;
  margin: 0px 0px;
  min-width: 32px;
}
.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field {
  max-width: 32px !important;
  width: 32px !important;
}
.mat-datepicker-content .time-container:after {
  display: none;
}
.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-meridian .mat-mdc-button {
  min-width: 30px !important;
  border-radius: 2px !important;
  padding: 0 5px !important;
  font-size: 12px;
  width: 32px !important;
  height: 26px !important;
}
.mat-datepicker-content .actions {
  position: absolute;
  right: 10px;
  bottom: 8px;
  padding: 0 !important;
}
.mat-datepicker-content .actions .mat-mdc-button.mat-mdc-outlined-button {
  height: 26px;
  min-width: 0px !important;
  padding: 0 5px !important;
}
.custom-date-picker .mat-form-field-prefix {
  position: absolute;
  top: 25px;
}
.custom-date-picker .mat-mdc-input-element {
  padding: 0 0 0 35px;
}
.custom-mat-icon .mat-form-field-prefix {
  position: absolute;
  top: 5px;
  color: #aab5c0;
  margin: 6px 6px;
}
.custom-mat-icon .mat-mdc-input-element {
  padding: 0 0 0 35px;
}
#dtCloudApp .ng-select.custom-select {
  margin-top: 10px !important;
}
#dtCloudApp .ng-select.custom-select.m-t-0i {
  margin-top: 0px !important;
}
#dtCloudApp .ng-select.custom-select.phase-select {
  margin-right: 10px;
  min-width: 190px;
  margin-top: 0px !important;
}
#dtCloudApp .ng-select.custom-select.m-0 {
  margin: 0 !important;
}
@media (max-width: 599px) {
  #dtCloudApp .ng-select.custom-select.m-0-xs {
    margin: 0 !important;
  }
}
#dtCloudApp .company-information .ng-select.custom-select,
#dtCloudApp .custom-select-m-t-5 .ng-select.custom-select {
  margin-top: 5px !important;
}
#dtCloudApp .custom-select-m-t-0 .ng-select.custom-select {
  margin-top: 0px !important;
}
#dtCloudApp .ng-select.custom-select .ng-select-container {
  min-height: 0px;
}
#dtCloudApp .ng-select.custom-select ::ng-deep .ng-select-container {
  min-height: 0px;
}
#dtCloudApp .ng-select .ng-select-container {
  min-height: unset;
  color: var(--navy) !important;
  font-size: 14px !important;
  font-family: "gilroy-regular" !important;
}
#dtCloudApp .opportunity-stages-color-xs .ng-select.ng-select-single:not(.ng-select-opened) .ng-select-container {
  border-color: transparent !important;
}
#dtCloudApp .opportunity-stages-color-xs .ng-select.ng-select-single.ng-select-opened > .ng-select-container {
  border: solid 1px var(--blue);
  background-color: var(--white);
  box-shadow: unset !important;
  border-radius: 5px;
  height: 36px;
}
#dtCloudApp .ng-select.client-owner-select .ng-select-container,
#dtCloudApp .ng-select.ng-select-single .ng-select-container {
  border-radius: 4px;
}
#dtCloudApp .opportunity-stages-color-xs .ng-select.ng-select-single .ng-select-container .ng-arrow-wrapper {
  display: none;
}
#dtCloudApp .project-stages-color-xs .ng-select.ng-select-single:not(.ng-select-opened) .ng-select-container {
  border-color: transparent !important;
}
#dtCloudApp .project-stages-color-xs .ng-select.ng-select-single.ng-select-opened > .ng-select-container {
  border: solid 1px var(--blue);
  background-color: var(--white);
  box-shadow: unset !important;
  border-radius: 5px;
  height: 36px;
}
#dtCloudApp .project-stages-color-xs .ng-select.ng-select-single .ng-select-container .ng-arrow-wrapper {
  display: none;
}
#dtCloudApp .opportunity-stages-system-state-xs .ng-select.ng-select-single .ng-select-container {
  border: none;
}
#dtCloudApp .opportunity-stages-system-state-xs .ng-select.ng-select-single .ng-select-container .ng-arrow-wrapper {
  display: none;
}
#dtCloudApp .opportunity-stages-system-state-xs .ng-select.ng-select-single .ng-select-container .ng-value-container {
  padding: 0;
  color: var(--color-text-secondary);
}
#dtCloudApp .project-stages-system-state-xs .ng-select.ng-select-single .ng-select-container {
  border: none;
}
#dtCloudApp .project-stages-system-state-xs .ng-select.ng-select-single .ng-select-container .ng-arrow-wrapper {
  display: none;
}
#dtCloudApp .project-stages-system-state-xs .ng-select.ng-select-single .ng-select-container .ng-value-container {
  padding: 0;
  color: var(--color-text-secondary);
}
#dtCloudApp .labor-type-img-upload .img-upload {
  width: 100% !important;
  min-width: 100% !important;
  height: 102px;
  display: flex;
  justify-content: center;
}
#dtCloudApp .labor-type-img-upload .img-upload .img-text {
  display: flex;
  flex-direction: row;
  gap: 3px;
}
#dtCloudApp .ng-select.roleSelect .ng-select-container {
  color: rgba(0, 0, 0, 0.87);
  font-family: gilroy-semi-bold !important;
  font-size: 14px !important;
}
#dtCloudApp ng-select.ng-select.installer-resource,
.font-16-i {
  font-size: 16px !important;
}
#dtCloudApp ng-select.ng-select.custom-select2 {
  margin-top: 0px;
  max-width: 180px;
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-single .ng-select-container .ng-clear-wrapper .ng-clear {
  display: none;
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-single .ng-select-container:hover .ng-clear-wrapper .ng-clear {
  display: block;
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-single .ng-select-container:hover {
  height: 24px;
  border-radius: 5px;
  box-shadow: inset 0 1px 4px 0 rgba(180, 170, 170, 0.06);
}
#dtCloudApp ng-select.ng-select.custom-select2 .ng-select-container:hover {
  border: 1px solid #ccc;
}
#dtCloudApp ng-select.ng-select.custom-select2 .ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
  line-height: 20px;
  padding: 5px 10px;
}
#dtCloudApp .quote-tax-dropdown .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 110px !important;
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-single .ng-select-container .ng-value-container .ng-input {
  top: 0px;
  left: 0;
  padding-left: 10px;
  padding-right: 50px;
  line-height: 20px;
}
app-address.qb-address .mat-mdc-form-field {
  margin-bottom: 20px !important;
}
app-address.qb-address .address-country {
  position: relative;
  bottom: 5px;
}
#dtCloudApp ng-select.ng-select.opportunity-tax .ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
  min-height: 30px !important;
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-single .ng-select-container:focus {
  height: 24px;
  border-radius: 5px;
  box-shadow: inset 0 1px 4px 0 rgba(180, 170, 170, 0.06);
}
#dtCloudApp ng-select.ng-select.custom-select2 .ng-select-container:focus {
  border: 1px solid var(--cool-green);
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-single .ng-select-container {
  height: 24px;
  border-radius: 5px;
  box-shadow: unset;
}
#dtCloudApp ng-select.ng-select.custom-select2.ng-select-clearable .ng-select-container {
  right: 24px;
}
ng-select.ng-select.custom-select2:hover .ng-value-container,
ng-select.ng-select.custom-select2:focus .ng-value-container {
  padding-right: 0px;
}
#dtCloudApp ng-select.ng-select.custom-select2 .ng-select-container {
  border: unset;
}
#dtCloudApp .ng-select.ng-select-opened > .ng-select-container {
  background: #fff;
  border-color: var(--cool-green);
}
.ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  place-content: center flex-start;
  align-items: center;
  flex: 1 1 0%;
}
mat-slide-toggle {
  position: relative;
}
#dtCloudApp .mdc-switch {
  height: 20px;
  width: 42px !important;
  background-repeat: no-repeat;
}
.custom-toggle .mdc-switch {
  background-position-x: -6px;
  background-position-y: -5px;
  background-image: url("./media/toggle-VGCABMVU.svg");
}
#dtCloudApp .custom-toggle.mat-mdc-slide-toggle-checked .mdc-switch {
  background-position-x: 0;
  background-image: url("./media/toggle-selected-TMLWZSBC.svg");
}
#dtCloudApp .mdc-switch * {
  display: none;
}
#dtCloudApp .mdc-switch.mdc-switch--disabled {
  opacity: 0.5 !important;
}
.dollar-or-percent .mdc-switch {
  background-image: url("./media/toggle-percent-3NGLCVGE.svg");
}
#dtCloudApp .dollar-or-percent.mat-mdc-slide-toggle-checked .mdc-switch {
  background-position-x: 0;
  background-position-y: 0;
  background-image: url("./media/toggle-dollar-PI7PD2ZW.svg");
}
.toggle-currency {
  position: absolute;
  left: 21px;
  top: 2px;
  line-height: 10px;
  cursor: pointer;
  background-color: var(--green-blue);
  color: #fff;
  padding: 2px 2px;
  text-align: center;
}
.dollar-or-percent.mat-mdc-slide-toggle-checked .toggle-currency {
  color: var(--green-blue);
  background-color: var(--white);
}
.fr-CA .dollar-or-percent.mat-mdc-slide-toggle-checked .toggle-currency {
  height: 15px;
  top: 1px;
  padding-top: 4px;
  padding-right: 5px;
}
.dollar-or-percent .mat-slide-toggle-bar {
  height: 17px;
  width: 38px;
  background-repeat: no-repeat;
  background-size: 0;
  background-position-x: 23px;
  background-position-y: center;
  background-color: var(--cool-green);
}
.dollar-or-percent .mat-slide-toggle-thumb-container {
  position: static;
  z-index: 1;
  width: 20px;
  height: 20px;
  top: 1px;
  left: 1px;
  transform: translate3d(0, 0, 0);
  transition: all 80ms linear;
  transition-property: transform;
}
.dollar-or-percent .mat-slide-toggle-thumb {
  left: 10px;
  top: 3px;
  border-radius: 2px;
  width: 38px;
  height: 17.6px;
  background-image: url("./media/toggle-percent-3NGLCVGE.svg");
  background-color: var(--green-blue);
}
.fr-CA .dollar-or-percent .mat-slide-toggle-bar,
.fr-CA .dollar-or-percent .mat-slide-toggle-thumb {
  width: 58px;
}
.dollar-or-percent .mat-mdc-slide-toggle.mat-slide-toggle-ripple {
  position: absolute;
  top: calc(50% - 20px);
  left: calc(50% - 20px);
  height: 0px;
  width: 0px;
  z-index: 1;
  pointer-events: none;
}
.dollar-or-percent.mat-mdc-slide-toggle.mat-checked .mat-slide-toggle-bar {
  background-color: var(--green-blue);
}
.dollar-or-percent.mat-mdc-slide-toggle.mat-checked .mat-slide-toggle-thumb {
  background-image: url("./media/toggle-dollar-PI7PD2ZW.svg");
  background-color: var(--green-blue);
}
.dollar-or-percent.mat-mdc-slide-toggle.mat-checked .mat-slide-toggle-thumb-container {
  transform: unset;
}
.dollar-or-percent.mat-checked .mat-slide-toggle-bar {
  background-position-x: 4px;
}
.status-probability {
  padding: 2px 7px;
  line-height: 15px;
  font-family: gilroy-semi-bold;
  font-size: 13px;
  text-align: center;
}
.status-probability.orange,
.status-probability.Orange {
  background-color: #d1670f1a;
  color: #fa5907;
}
.status-probability.gray,
.status-probability.Gray {
  background-color: #7e8a961a;
  color: var(--medium-gray);
}
.status-probability.green,
.status-probability.Green {
  background-color: #0e9e271a;
  color: var(--green-blue);
}
.status-probability.blue,
.status-probability.Blue {
  background-color: var(--blue) 1a;
  color: var(--blue);
}
.status-probability.yellow,
.status-probability.Yellow {
  background-color: #fbdd3033;
  color: #ffbf00;
}
.status-probability.red,
.status-probability.Red {
  background-color: #d10f3b1a;
  color: #d10c38;
}
.fill-orange {
  fill: #fa5907 !important;
}
.fill-gray {
  fill: var(--medium-gray) !important;
}
.fill-green {
  fill: var(--green-blue) !important;
}
.fill-blue {
  fill: var(--blue) !important;
}
.fill-yellow {
  fill: #eee3c1 !important;
}
.fill-red {
  fill: #d10c38 !important;
}
.no-records {
  font-family: gilroy-medium;
  color: var(--medium-gray);
  line-height: 16px;
  padding: 20px 10px;
  text-align: center;
  height: 110px;
}
.resource.no-records {
  padding: 16px 0px;
}
.table-container .loading-progressor {
  margin-top: unset !important;
}
.bread-crumb {
  position: relative;
  min-height: 32px;
  min-width: 200px;
}
.bread-crumb:first-of-type {
  border-radius: 4px 0 0 4px;
}
.bread-crumb:last-of-type {
  border-radius: 0 4px 4px 0;
}
.bread-crumb::before {
  content: "";
  left: -16px;
  background: transparent !important;
  min-height: 32px;
}
.bread-crumb-current-bg {
  background: var(--blue) !important;
  color: var(--white);
  position: relative;
  z-index: 0;
  min-height: 32px;
}
.bread-crumb-current-bg::after,
.bread-crumb-current-bg::before {
  content: "";
  position: absolute;
  top: 0;
  right: -15px;
  width: 32px;
  height: 32px;
  min-height: 32px;
  transform: scale(0.7) rotate(45deg);
  z-index: 1;
  background:
    linear-gradient(
      50deg,
      transparent 50%,
      var(--blue) 50%) !important;
  transition: all 0.5s;
  box-shadow: 3px -2px 0 0px rgba(255, 255, 255, 1), 1px -3px 0 0px rgba(255, 255, 255, 1);
}
.bread-crumb-current-bg:last-of-type::after {
  content: "";
  display: none;
  min-height: 32px;
}
.bread-crumb-bg {
  background: var(--cool-green);
  color: var(--white);
  position: relative;
  min-height: 32px;
}
.bread-crumb-bg::after,
.bread-crumb::before {
  content: "";
  position: absolute;
  top: 0;
  right: -15px;
  width: 32px;
  height: 32px;
  transform: scale(0.7) rotate(45deg);
  z-index: 1;
  background:
    linear-gradient(
      50deg,
      transparent 50%,
      var(--cool-green) 50%);
  transition: all 0.5s;
  box-shadow: 3px -2px 0 0px rgba(255, 255, 255, 1), 1px -3px 0 0px rgba(255, 255, 255, 1);
  min-height: 32px;
}
.bread-crumb-bg:last-of-type::after,
.bread-crumb:first-of-type::before {
  content: "";
  display: none;
  min-height: 32px;
}
.mat-mdc-radio-group.ticked .mat-mdc-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle {
  background-color: var(--white) !important;
  background-image: url("./media/checkbox_checked_green-FBNJAAD7.svg");
  background-color: transparent !important;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: center center;
  transform: scale(1) !important;
}
.background-white {
  background-color: white !important;
}
.radio-with-info .mat-mdc-radio-button {
  padding: 5px 0;
  margin-bottom: 15px;
}
.radio-with-info .service-plan-radio-btn.mat-mdc-radio-button:last-child {
  margin-bottom: 0px;
}
.radio-with-info .mat-radio-label-content {
  padding-left: 15px;
}
.radio-with-info .mat-mdc-radio-button .radio-header {
  color: black;
  font-family: gilroy-bold;
  font-size: 13px;
  line-height: 15px;
}
.radio-with-info .mat-mdc-radio-button .radio-info {
  opacity: 0.6;
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 13px;
  line-height: 15px;
}
.mat-mdc-radio-group.ticked.medium .mat-mdc-radio-button {
  padding: 5px 0;
  margin-bottom: 5px;
}
.mat-mdc-radio-group.ticked.medium .mat-radio-container {
  width: 15px;
  height: 15px;
}
.mat-mdc-radio-group.ticked.medium .mat-radio-outer-circle {
  height: 15px;
  width: 15px;
}
.price-settings .mat-mdc-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
  background-color: var(--green-blue) !important;
}
.price-settings .mat-mdc-radio-button.mat-accent .mat-radio-inner-circle {
  background-color: inherit !important;
}
.price-settings .mat-mdc-radio-button.mat-accent .mat-radio-inner-circle::before {
  content: "\2713" !important;
  color: var(--white);
  font-size: 30px;
  font-weight: bold;
  position: relative;
  top: -10px;
  right: 1px;
}
.mat-mdc-radio-group.ticked.medium .mat-mdc-radio-button.mat-accent.mat-radio-checked .mat-radio-inner-circle {
  background-size: 15px 15px;
  background-position: 0 0;
}
.mat-secondary.btn-bg-none {
  margin-left: 10px;
  border: none;
  background: none;
  box-shadow: none;
}
.input-disabled .mat-mdc-input-element:disabled {
  background: white;
}
.mat-mdc-form-field.input-disabled .mat-mdc-form-field-infix .mat-mdc-input-element {
  border: none;
  box-shadow: none;
  border-radius: unset;
  padding: 0;
  margin: 0;
  height: 20px;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
}
.mat-mdc-form-field.input-disabled .mat-mdc-form-field-infix .mat-form-field-label-wrapper label {
  padding-left: 0 !important;
}
#dtCloudApp .ng-select.ng-select-single.input-disabled .ng-select-container {
  border: none;
  box-shadow: none;
  border-radius: unset;
  padding: 0;
  height: 16px;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
  background: none;
}
#dtCloudApp .ng-select.input-disabled .ng-select-container .ng-value-container {
  padding-left: 0px;
}
#dtCloudApp .ng-select.input-disabled .ng-arrow-wrapper {
  cursor: default;
  display: none;
}
.opp-right-text .mat-mdc-form-field-infix {
  min-height: 24px;
  height: 24px;
  border-top: unset;
}
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element {
  margin-top: 0px;
  height: 22px;
  text-align: right;
  border: unset;
  box-shadow: unset;
  padding: 2px 8px !important;
  line-height: normal;
}
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element:hover {
  border: 1px solid var(--silver);
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
}
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element:focus {
  border: 1px solid var(--cool-green) !important;
}
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element.website-focus:focus,
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element.email-focus:focus,
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element.phone-focus:focus {
  color: var(--navy);
}
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element.website-focus,
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element.email-focus,
.opp-right-text .mat-mdc-form-field-infix .mat-mdc-input-element.phone-focus {
  color: var(--cool-green);
}
.people-icon svg #Symbols g {
  stroke: var(--gray1);
}
app-contacts-integration,
app-client-integration {
  position: relative;
}
.category-rule-content {
  position: relative;
  background-color: rgba(0, 0, 0, 0.05) !important;
}
.category-rule-content .inherited {
  background-color: rgba(0, 0, 0, 0.05) !important;
  pointer-events: none;
}
.category-rule {
  height: 130px;
  border-radius: 4px;
  background-color: var(--black);
  opacity: 0.9;
  padding: 16px 24px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 2;
}
.category-rule-assigned {
  color: var(--white);
  font-family: gilroy-bold;
  font-size: 13px;
  letter-spacing: 0;
  text-align: center;
}
.category-rule-set {
  max-width: 342px;
  color: var(--white);
  font-family: gilroy-semi-bold;
  font-size: 12px;
  letter-spacing: 0;
  text-align: center;
}
.mat-mdc-button.category-rule-button {
  color: var(--white) !important;
}
.mat-mdc-button.category-rule-button.disable {
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.37);
  border-radius: 2px;
  box-shadow: 0 2px 4px 0 rgba(3, 3, 3, 0.06);
}
.mat-mdc-button.category-rule-button.edit {
  border-radius: 2px;
  background-color: var(--white);
  box-shadow: 0 2px 4px 0 rgba(3, 3, 3, 0.19);
}
.mat-mdc-button.category-rule-button.edit span {
  color: #1d2836;
  font-family: gilroy-semi-bold;
  font-size: 13px;
  letter-spacing: 0;
  text-align: center;
}
.pricing-mask .mask-content {
  height: 100px;
}
.pricing-mask .mask-image-container {
  height: 100px;
  text-align: center;
  max-height: 100px !important;
  max-width: 200px !important;
  align-content: center;
  align-items: center;
  justify-content: center;
  display: flex;
}
.sipv-bkgnd-grid {
  width: 100%;
}
#dtCloudApp .detail-panel ng-select .ng-arrow-wrapper {
  visibility: hidden;
}
#dtCloudApp .detail-panel ng-select.ng-select-opened .ng-select-container,
#dtCloudApp .detail-panel ng-select.ng-select-focused .ng-select-container {
  border: 1px solid var(--cool-green) !important;
}
#dtCloudApp .detail-panel ng-select.ng-select-opened .ng-select-container .ng-arrow-wrapper,
#dtCloudApp .detail-panel ng-select.ng-select-focused .ng-select-container .ng-arrow-wrapper,
#dtCloudApp .detail-panel ng-select .ng-select-container:hover .ng-arrow-wrapper {
  visibility: visible;
}
mark {
  background: none;
  color: var(--blue);
}
.odd-row {
  background-color: var(--cool-grey-three);
}
.even-row {
  background-color: var(--white);
}
.opportunity-title mat-form-field .mat-mdc-form-field-flex {
  padding: 0px;
}
.opportunity-title mat-form-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix {
  padding: 0;
  margin: 0;
  border: unset;
}
.opportunity-title mat-form-field .mat-mdc-form-field-flex {
  padding: 0;
}
.opp-number {
  font-size: 24px;
  color: var(--medium-gray);
  font-family: gilroy-regular;
  white-space: nowrap;
}
.icon-possition {
  position: relative;
  top: 3px;
}
.client-type {
  color: var(--medium-gray);
  font-size: 11px;
  border: 1px solid var(--medium-gray);
  padding: 4px 12px;
  border-radius: 3px;
  margin-left: 10px;
  font-family: gilroy-semi-bold;
  text-transform: uppercase;
}
#dtCloudApp .ng-select img {
  width: 25px;
  height: 25px;
  min-width: 25px;
  border-radius: 50%;
  border: 2px solid var(--light-gray2);
  text-align: center;
  overflow: hidden;
}
.ng-select {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
}
.ng-select .resource-opt-sel {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 8px;
}
.todo-assignees-container .ng-select .ng-select-container {
  height: 100% !important;
  min-height: 36px !important;
}
.todo-assignees-container .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder {
  top: unset !important;
}
.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .todo-assignees {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 8px;
  border-radius: 24px !important;
  font-size: 14px !important;
  height: 24px !important;
  padding: 0px 6px !important;
  color: var(--white) !important;
  background-color: #1DB77A !important;
  flex-direction: row;
  align-items: center;
}
.ng-select .ng-dropdown-footer {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-content: space-between;
  width: 100%;
  padding: 0;
}
.ng-dropdown-panel .ng-dropdown-footer {
  border-top: unset;
  padding: 0 16px;
}
.ng-select .ng-dropdown-footer div,
.ng-dropdown-panel .ng-dropdown-footer div {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 32px;
}
.ng-select .ng-dropdown-footer div:first-child,
.ng-dropdown-panel .ng-dropdown-footer div:first-child {
  border-top: 1px solid var(--color-divider);
}
.font-size-10 {
  font-size: 10px !important;
}
.font-size-11 {
  font-size: 11px !important;
}
.font-size-12,
.font-12 {
  font-size: 12px !important;
}
.font-size-13,
.font-13 {
  font-size: 13px !important;
}
.font-size-14 {
  font-size: 14px !important;
}
.font-size-15 {
  font-size: 15px !important;
}
.font-size-16 {
  font-size: 16px !important;
}
.font-size-18 {
  font-size: 18px !important;
}
.font-size-20 {
  font-size: 20px !important;
}
.font-size-24 {
  font-size: 24px !important;
}
.font-size-30 {
  font-size: 30px;
}
.ng-select .ng-dropdown-footer div a:nth-child(2),
.ng-dropdown-panel .ng-dropdown-footer div a:nth-child(2),
.font-18 {
  font-size: 18px;
}
.ng-dropdown-panel.supplier-select.append-body .ng-dropdown-footer {
  padding: unset;
}
#dtCloudApp .ng-select .acronym,
.contact-acronym {
  background-color: var(--light-gray2);
  line-height: 25px !important;
  border-radius: 50%;
  justify-content: space-around;
  display: flex;
  margin-right: 5px;
  height: 25px;
  width: 25px;
  border: 1px solid var(--light-gray2);
  font-size: 12px;
  color: var(--slate-grey);
  align-items: center !important;
}
.elipseName {
  display: block;
  z-index: 5;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 1;
  white-space: nowrap;
}
.mat-mdc-form-field.edit-detail .mat-mdc-form-field-infix .websiteInput.mat-mdc-input-element:focus,
.mat-form-field.edit-detail .mat-mdc-form-field-infix .emailInput.mat-mdc-input-element:focus,
.mat-form-field.edit-detail .mat-mdc-form-field-infix .phoneInput.mat-mdc-input-element:focus {
  color: var(--navy);
}
.mat-mdc-form-field.edit-detail .mat-mdc-form-field-infix .websiteInput.mat-mdc-input-element,
.mat-form-field.edit-detail .mat-mdc-form-field-infix .emailInput.mat-mdc-input-element,
.mat-form-field.edit-detail .mat-mdc-form-field-infix .phoneInput.mat-mdc-input-element,
.cool-green {
  color: var(--cool-green);
}
app-upload-file.attachments-content.floorplan .img-upload {
  max-width: 100% !important;
  width: 100% !important;
  min-width: 100% !important;
}
app-upload-file.attachments-content.floorplan .img-upload md-icon {
  height: 34.67px;
  width: 52px;
  min-height: 34.67px;
  min-width: 52px;
  max-height: 34.67px;
  max-width: 52px;
  opacity: 0.5;
  margin: 0px;
}
app-upload-file.attachments-content.floorplan .img-upload .img-text,
app-upload-file.attachments-content.floorplan .img-upload a {
  font-size: 15px !important;
}
.filter-toggler-mobile-drawings {
  position: fixed;
  top: 111px;
  z-index: 10;
  width: 20px;
  height: 40px;
  border: 1px solid rgb(206, 208, 211);
  line-height: 40px;
  border-radius: 0px 5px 5px 0px;
  border-left-width: 0px;
}
.dtc-pdf-preview-canvas,
.dtc-crop-overlay-canvas {
  top: 130px !important;
}
.drawing-card {
  margin-top: 20px;
  height: 230px;
  width: 252px;
  object-fit: contain;
  position: relative;
}
.coverage-view .waring-banner-new.blue .mat-mdc-button.primary {
  border: 1px solid #fff;
  background-color: var(--blue);
  width: 69px;
  min-width: 69px !important;
  margin: auto;
  margin-right: 98px;
  height: 27px;
  max-height: 27px !important;
  padding: 0px !important;
}
.proposal-locations .mat-expansion-panel-header-title {
  color: #041932;
  font-family: "gilroy-semi-bold";
  font-size: 16px;
  line-height: 19px;
}
.coverage-view .position-relative {
  width: 128px;
  margin-left: 40px;
}
.proposal-locations .mat-expansion-indicator {
  position: absolute;
  left: 100px;
  margin-top: -5px;
}
.proposal-locations .mat-expanded .mat-expansion-indicator {
  margin-top: 4px !important;
}
.proposal-locations .mat-expansion-indicator::after {
  padding: 2px !important;
  color: #7e8a96 !important;
}
.proposal-locations .mat-expansion-panel {
  box-shadow: none;
  border: 0px;
}
.proposal-locations .mat-expansion-panel-header:not([aria-disabled=true]) {
  height: 30px;
  padding-left: 12px !important;
}
.proposal-locations .mat-expansion-panel-body {
  padding: 0px !important;
}
.coverage-view .svg-warning g path {
  fill: var(--blue) !important;
}
.coverage-view .waring-banner-new.blue {
  background-color: #d0e9f6 !important;
}
.coverage-view .mat-mdc-form-field-infix {
  max-width: 116px !important;
}
.coverage-view .preview-header {
  justify-content: start;
}
.coverage-view input {
  text-align: right;
}
.coverage-view .preview-row.start {
  min-width: 67% !important;
}
.coverage-view .preview-row.end {
  min-width: 100% !important;
  justify-content: inherit;
}
.coverage-view .mat-mdc-form-field {
  margin: 0px;
}
.coverage-view .mat-mdc-slider {
  margin-left: 40px;
}
.coverage-view .preview-header,
.coverage-view .preview-row {
  height: 40px;
}
.coverage-view .mat-slider-horizontal .mat-slider-wrapper {
  top: 8px;
}
.coverage-view span.span-label {
  width: 50px;
}
.mat-mdc-menu-item[disabled] {
  background: #f3f4f5 !important;
  color: rgba(0, 0, 0, 0.38);
}
.settings-menu-drawings .mat-mdc-menu-item[disabled] .mat-accent .mat-slider-track-fill,
.settings-menu-drawings .mat-mdc-menu-item[disabled] .mat-accent .mat-slider-thumb,
.settings-menu-drawings .mat-mdc-menu-item[disabled] .mat-accent .mat-slider-thumb-label {
  background-color: var(--cool-grey);
}
.drawing.router-base-container.whiteboard {
  height: 100vh !important;
}
.drawing.router-base-container {
  overflow: hidden;
}
.duplicate-drawing .mat-mdc-dialog-content {
  min-height: 0px !important;
  margin: 15px 0px !important;
}
.drawing-card img {
  height: 190px;
  margin: 0px;
}
.drawing-card .hover-position {
  display: none;
  height: 230.49px;
  width: 252.49px;
  position: absolute;
  z-index: 10;
  background-color: rgba(44, 61, 82, 0.75);
  border-radius: 4px;
  -webkit-transform: translateY(-20px);
  -ms-transform: translateY(-20px);
  transform: translateY(-20px);
  cursor: pointer;
  top: 0px;
}
.drawing-card:hover .hover-position {
  display: flex;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  border: 1px solid var(--green-blue);
}
.drawing-card .hover-position .file-hovr-btn {
  color: var(--white);
  border: 1px solid var(--white);
  border-radius: 3px;
  cursor: pointer;
  line-height: 29px !important;
}
.drawing-card .hover-position span {
  position: absolute;
  right: 10px;
}
svg#sipv-svg {
  background-color: var(--white) !important;
  height: calc(100vh - 60px) !important;
  z-index: 100;
}
.sipv-bkgnd-grid {
  height: 100% !important;
  width: 100% !important;
  filter: none !important;
}
.heading-label-drawings {
  color: var(--medium-gray);
  font-family: gilroy-bold;
  font-size: 10px;
  line-height: 12px;
  padding: 10px 16px;
  padding-bottom: 5px;
}
.mat-accent .mat-slider-track-fill,
.mat-accent .mat-slider-thumb,
.mat-accent .mat-slider-thumb-label {
  color: var(--cool-green);
}
.mat-accent .mat-slider-track-fill,
.mat-accent .mat-slider-thumb,
.mat-accent .mat-slider-thumb-label {
  background-color: var(--cool-green);
}
.mat-accent .mat-slider-track-fill,
.mat-accent .mat-slider-thumb,
.mat-accent .mat-slider-thumb-label {
  background-color: var(--cool-green);
}
.settings-menu-drawings .delete-btn {
  color: var(--red);
}
.display-none {
  display: none !important;
}
.display-flex {
  display: flex;
}
.display-flex-i {
  display: flex !important;
}
.drawing .design-sub-group-header {
  font-size: 16px;
  font-family: gilroy-bold;
}
.drawing-options {
  height: 44px;
  min-width: 680px;
  margin: 5px auto;
  border: 1px solid var(--light-gray2);
  border-radius: 3px;
  background-color: var(--white);
  box-shadow: 0 2px 4px 0 var(--cool-grey);
  position: absolute;
  bottom: 15px;
  margin-left: -352px;
  left: 50%;
  padding: 0px 10px;
  z-index: 100;
  padding-left: 0px;
}
.drawing-options.wirepath-view {
  margin-left: -437px;
}
.menu-location-draw .icon-location {
  margin-left: 20px !important;
  margin-right: 5px !important;
}
.sipv-click-overlay-rect {
  fill: transparent !important;
}
.menu-location-draw .icon-check {
  position: absolute;
  top: 14px;
}
.drawing .cursor-copy {
  cursor: copy !important;
}
.drawing .cursor-add,
.drawing .cursor-add svg#sipv-svg {
  cursor: url(/assets/icons/draw_cursor.svg), auto !important;
}
.drawing .cursor-comment,
.drawing .cursor-comment svg#sipv-svg,
.cursor-comment g {
  cursor: url(/assets/icons/comment_whiteboard.svg), auto !important;
}
.drawing .cursor-erasor,
.drawing .cursor-erasor svg#sipv-svg,
.cursor-erasor g {
  cursor: url(/assets/icons/eraser_pen.svg) 6 15, auto !important;
}
.drawing .cursor-text,
.drawing .cursor-text svg#sipv-svg {
  cursor: text !important;
}
.drawing .cursor-ink .sipv-location-overlay,
.drawing .cursor-ink svg#sipv-svg {
  cursor: url(/assets/icons/edit_pen.svg) 6 15, auto !important;
}
.drawing .cursor-draw,
.drawing .cursor-draw svg#sipv-svg,
.cursor-draw g {
  cursor: url(/assets/icons/draw-location-new.svg) 10 10, auto !important;
}
.drawing-options .mat-mdc-button {
  min-width: 0px !important;
  width: auto !important;
  padding: 0px 10px !important;
  margin: 3px 1px;
  min-height: 33px;
}
.drawing-options .mat-mdc-button.active,
.drawing-options .mat-button:hover,
.drawing-options .mat-button:hover {
  background-color: var(--light-gray2) !important;
  opacity: 1;
}
.mat-menu-planviews .mat-mdc-menu-item,
.settings-menu-drawings .mat-mdc-menu-item {
  height: 30px !important;
  line-height: 30px !important;
}
.settings-menu-drawings .mat-slider-horizontal {
  height: 30px;
  min-width: 128px;
  padding: 0px;
  margin-top: -15px;
}
.mat-menu-planviews .mat-mdc-menu-item.active {
  background-color: rgba(158, 158, 158, 0.2);
}
.whiteboard.drawing .router-container {
  padding: 0px !important;
  height: 100vh !important;
  overflow: hidden;
}
.drawing .router-container {
  padding: 0px !important;
  overflow: hidden;
}
#container-PPE-scroll:has(.drawing) {
  overflow: hidden !important;
}
.drawing #divInputText {
  position: absolute;
  background-color: rgb(209, 56, 12);
  border-radius: 3px;
  z-index: 100;
}
.drawing #divInputText input {
  border-radius: 2px;
  opacity: 0.9;
  border: 0px;
  height: 26px;
  color: rgb(209, 56, 12);
  padding: 5px 10px;
  min-width: 188px;
}
#uploadImageDrawing {
  opacity: 0;
  position: absolute;
  height: 40px;
  left: 0px;
  width: 160px;
  z-index: 10;
  cursor: pointer;
}
.drawing .select-plan-btn {
  color: var(--medium-gray);
}
.drawing .mat-mdc-menu-item.active {
  background-color: var(--light-gray2);
}
.drawing.whiteboard .drawing-options {
  min-width: 730px !important;
  margin-left: -337px;
  max-width: 775px !important;
  left: 50% !important;
}
.drawing .btn-close {
  min-width: 0px;
  width: 40px;
  height: 40px;
  margin-top: 12px;
  border: 1px solid var(--silver);
  box-shadow: none;
}
.drawing .mat-mdc-button.destructive,
.mat-mdc-menu-item.destructive {
  background: none !important;
}
#whiteboardContainer .sipv-comment {
  display: block !important;
}
#whiteboardComment .sipv-comment text {
  font-size: 25px;
}
#whiteboardComment p {
  margin-top: 3px;
}
#whiteboardComment a {
  margin-top: 15px;
}
#whiteboardCommentButton {
  color: var(--red4) !important;
}
#whiteboardComment .img {
  height: 20px;
  width: 20px;
  display: inline-block;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-size: 20px;
}
#whiteboardComment .button_groups {
  width: 100%;
}
#whiteboardComment {
  position: absolute;
  min-height: 100px;
  width: 313px;
  border: 1px solid var(--light-gray2);
  border-radius: 2px;
  background-color: var(--white);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
  z-index: 100;
  padding: 15px;
  overflow: auto;
  cursor: pointer;
  max-height: 300px;
}
#whiteboardComment #trix-create-task-toolbar {
  margin-top: 10px;
}
#whiteboardComment trix-toolbar .block_tools,
#whiteboardComment trix-toolbar .text_tools {
  margin-right: 13px;
}
#whiteboardComment .header {
  color: var(--color-text-primary);
  font-family: Gilroy-bold;
  font-size: 13px;
  line-height: 15px;
  padding: 3px 10px;
  margin: 0px;
  vertical-align: super;
  border-bottom: 0px;
}
.drawing .header label {
  line-height: 59px;
  padding-left: 10px;
}
.drawing .header {
  margin: 0px 10px;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
  width: 100%;
  margin: 0px;
  padding: 0px 10px;
  z-index: 2;
}
.drawing-panel .mat-mdc-dialog-container {
  padding: 0px !important;
}
.drawing.whiteboard .router-filter {
  position: absolute;
  top: 80px;
}
.line-drawing-dialog,
.HW-100 {
  height: 100%;
  width: 100%;
}
.line-drawing-dialog .mat-mdc-dialog-container {
  padding: 0px;
}
.drawing.whiteboard .items-list {
  height: calc(100vh - 220px);
}
.wirepath-name .mat-mdc-form-field-infix {
  margin-top: -30px;
  min-width: 90px;
  width: auto !important;
}
.items-list .span-qty {
  background-color: #eef0f1;
  padding: 3px 4px;
  border-radius: 2px;
  margin-left: 5px;
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 12px;
  line-height: 14px;
}
.file-whiteboard .drawing.whiteboard .items-list {
  height: calc(100vh - 160px) !important;
}
.file-whiteboard #WhiteboardComponent {
  background-color: var(--black) !important;
  opacity: 0.8 !important;
}
.file-whiteboard .drawing.whiteboard svg#sipv-svg {
  height: calc(100vh - 0px) !important;
  overflow: hidden;
}
.overflow-auto {
  overflow: auto;
}
.overflow-auto-i {
  overflow: auto !important;
}
.file-whiteboard .router-base-container,
.overflow-hidden {
  overflow: hidden !important;
}
.overflow-unset {
  overflow: unset !important;
}
.file-whiteboard .mat-mdc-dialog-container,
.over-flow-hidden .mat-dialog-container {
  overflow: hidden;
}
.drawing-l-details #taskForm .mat-mdc-form-field {
  max-width: 100% !important;
}
.drawing-l-details app-activity-list,
.width100-i {
  width: 100% !important;
  max-width: 100% !important;
}
.drawing-l-details app-activity-list .widget-ndb .mat-mdc-card {
  margin-left: 20px;
}
.drawing-items .mat-mdc-list-base {
  margin-top: 0px;
  padding-top: 0px;
  width: 100%;
}
.drawing-items .draw-icon svg path,
.drawing-items .arrow-right svg g rect {
  fill: var(--cool-green);
}
.drawing-items .arrow-right svg g,
.drawing-items .arrow-right svg path {
  stroke: var(--cool-green);
  fill: var(--cool-green);
}
.location-detail-drawing .img-upload {
  width: 100%;
  max-width: 100%;
  height: 100px !important;
  min-height: 100px !important;
  margin: 20px 10px;
}
.preview-pane-upload .img-upload {
  width: 100%;
  max-width: 100%;
  max-height: 230px !important;
  min-height: 230px !important;
  margin: 0px;
  border: 1px solid transparent;
}
.image-count {
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  font-size: 12px;
  position: absolute;
  top: 90%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  padding: 5px;
  border-radius: 25px;
  line-height: 22px;
  width: 60px;
  border-radius: 22px;
  cursor: pointer;
}
.image-count polyline {
  stroke: white;
}
.drawing .router-filter .router-filter-content {
  height: calc(100vh - 68px);
  overflow: hidden;
  overflow-y: auto;
}
.drawing .router-filter.router-filter-takeoffs .router-filter-content {
  height: calc(100vh - 68px);
  overflow: hidden;
  overflow-y: hidden;
}
.router-filter-content.location-items-filter {
  overflow: hidden !important;
}
#whiteboardComment .noteCreate-nt,
#locationDetails .noteCreate-nt {
  width: 100%;
}
.location-description .ql-editor {
  min-height: 230px;
  max-height: 300px;
}
#whiteboardComment .ql-snow .visible-toolbar,
#locationDetails .ql-snow .visible-toolbar {
  width: 100%;
  flex-wrap: wrap;
}
.drawing .router-filter .router-filter-content.location-items-filter {
  position: absolute;
  top: 0px;
  background-color: var(--white);
  width: 100%;
  z-index: 2;
}
.drawing-items .mat-mdc-list-base .mdc-list-item__content,
.drawing-items .mat-mdc-list-base .mat-list-option .mat-list-item-content {
  padding: 0px !important;
}
.drawing-items .mat-mdc-list-base .mat-mdc-list-item .mat-mdc-list-item-icon,
.drawing-items .mat-mdc-list-base .mat-mdc-list-item .mdc-list-item__primary-text img,
.drawing-items .mat-mdc-list-base .mat-list-option .mat-list-icon {
  height: 50px;
  width: 50px;
  border-radius: 0px !important;
  object-fit: contain;
  padding: 0px;
  border-radius: 3px !important;
  margin-right: 8px !important;
}
.drawing-items .mat-mdc-list-base .mdc-list-item__content:hover,
.drawing-items .mat-mdc-list-base .mat-list-option .mat-list-item-content:hover {
  background-color: #eaecee;
}
.drawing .btn-menu-location {
  position: absolute;
  right: -23px;
  width: auto;
  min-width: 0px !important;
  width: 24px;
  transition: 0.5s;
  border-top: 0px;
  border-top: 0px;
  z-index: 1;
  top: 20px;
  padding: 0px !important;
  border: 1px solid #e0e0e0;
  border-left: 0px;
  height: 48px !important;
  width: 24px;
  border-radius: 0px 15px 15px 0px !important;
  background-color: var(--cool-green);
  border: 0px;
}
.file-whiteboard .mat-mdc-dialog-container {
  background-color: transparent !important;
  padding: 0px;
  position: relative;
}
.file-whiteboard .mat-mdc-dialog-container {
  background-color: #fff !important;
}
.file-whiteboard .sipv-bkgnd-grid,
.file-whiteboard svg#sipv-svg {
  background-color: transparent !important;
  fill: transparent !important;
}
.file-whiteboard .drawing.whiteboard .router-filter {
  margin-top: -18px;
}
.file-whiteboard .drawing .btn-close {
  margin-left: 10px !important;
}
.file-whiteboard .drawing .header {
  position: absolute;
  width: 100%;
  left: 0px;
  padding: 0px;
  margin: 0px;
  height: 62px;
  top: 0px;
}
.file-whiteboard .router-base-container {
  margin-top: 54px;
  height: 100% !important;
}
.file-whiteboard .sipv-bkgnd-grid,
.file-whiteboard svg#sipv-svg {
  background-color: transparent !important;
  fill: transparent !important;
}
.drawing .sipv-location-overlay-rect {
  fill: var(--white) !important;
}
.drawing .tooltip .client-supplied {
  color: #7180c6;
  font-family: Gilroy-bold;
  font-size: 10px;
  line-height: 12px;
  position: relative;
  padding-left: 20px;
}
.drawing .tooltip .client-supplied md-icon {
  height: 17px;
  width: 13px;
  min-height: 17px;
  min-width: 13px;
  position: absolute;
  left: 75px;
  color: inherit !important;
}
.drawing .tooltip {
  padding: 13px;
  z-index: 1000;
  position: absolute;
  min-height: 58px;
  width: 269px;
  border: 3px solid;
  border-radius: 4px;
  background-color: var(--white);
  cursor: pointer;
}
.drawing .tooltip label {
  color: var(--color-text-primary);
  font-family: gilroy-bold;
  font-size: 13px;
  line-height: 15px;
  width: 200px !important;
  overflow: hidden;
}
.drawing .tooltip label,
.drawing .tooltip p {
  overflow: hidden;
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-left: 10px;
  text-align: left;
  width: 200px;
}
.drawing .tooltip p {
  color: var(--medium-gray);
  font-family: gilroy-regular;
  font-size: 12px;
  line-height: 14px;
  margin: 0px;
  margin-top: 6px;
}
.drawing .tooltip img {
  object-fit: contain;
}
.drawing-l-details .details {
  padding: 10px 15px;
  line-height: 20px;
}
.drawing-l-details .overlay {
  position: absolute;
  left: 0;
  right: 0;
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: 0.5s ease;
  border: unset;
  height: 40px;
  bottom: 15px;
}
.drawing-l-details .count-text {
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  font-size: 12px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  padding: 5px;
  border-radius: 25px;
  line-height: 22px;
  min-width: 60px;
  border-radius: 22px;
  cursor: pointer;
}
.drawing-l-details label.sub-header {
  font-size: 16px;
  font-family: gilroy-bold !important;
  color: var(--color-text-primary);
  margin-bottom: 18px;
  line-height: 30px;
}
.drawing-l-details .btn-reactangle {
  height: 80px;
  width: 80px;
  min-width: 80px !important;
  display: inline-block;
  border-radius: 8px;
  background-color: #f8f8f8;
  margin: 5px !important;
  cursor: pointer;
  white-space: normal;
  text-align: center;
  align-items: center;
}
.drawing-l-details .label-price {
  color: var(--color-text-primary);
  font-family: Gilroy-bold;
  font-size: 16px;
  line-height: 19px;
  text-align: right;
}
.drawing-l-details .location-price {
  color: var(--color-text-primary);
  font-family: Gilroy-bold;
  font-size: 24px;
  line-height: 29px;
  margin: 10px 0px;
}
.drawing-l-details .location-name,
.font16 {
  font-size: 16px;
}
.font16 {
  line-height: 20px;
}
.drawing-l-details .location-file {
  width: 100%;
  height: 278px;
  background-color: rgb(31, 42, 54);
  cursor: pointer;
  background-size: cover;
}
.drawing-l-details .btn-close-details,
#locationDetails .drawing-l-details .btn-close-details {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 100;
  height: 26px;
  width: 26px !important;
  border-radius: 4px !important;
  background-color: rgba(0, 0, 0, 0.6);
  min-width: 0px !important;
}
.drawing-l-details .btn-image {
  color: var(--white);
  background-color: rgba(37, 8, 8, 0.6);
  font-size: 12px;
  position: absolute;
  top: 139px;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  padding: 5px !important;
  border-radius: 50% !important;
  cursor: pointer;
  min-height: 34px !important;
  min-width: 34px !important;
  height: 34px;
  width: 34px;
}
.drawing-l-details .span-tax {
  color: var(--medium-gray);
  font-family: Gilroy-regular;
  font-size: 12px;
  line-height: 25px;
  margin: 10px 15px;
}
.drawing-l-details .btn-previous {
  left: 28px;
}
.drawing-l-details .btn-next {
  left: auto;
  right: 0px;
}
.drawing-l-details .btn-image.mat-mdc-button[disabled][disabled] {
  background-color: rgba(0, 0, 0, 0.2) !important;
}
.drawing-l-details .img-preview {
  height: 32px;
  width: 32px;
  object-fit: contain;
  margin-top: 5px;
  vertical-align: middle;
  margin-right: 8px;
}
.drawing-l-details .take-picture {
  position: absolute;
  bottom: 64px;
  left: 150px;
  color: var(--cool-green);
}
.drawing-l-details .location-upload {
  position: relative;
  color: var(--medium-gray);
}
.drawing-l-details .no-image {
  position: absolute;
  top: 64px;
  z-index: 1;
  left: 165px;
  text-align: center;
}
.drawing .router-filter {
  position: fixed !important;
  min-width: 350px !important;
  max-width: 350px !important;
  margin-left: -350px !important;
  z-index: 10;
}
.drawing .router-filter.visible {
  background-color: var(--white);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3) !important;
  z-index: 300;
  margin-left: 0px !important;
}
.drawing .locations {
  padding: 16px;
}
.drawing #locationDetails {
  position: absolute;
  top: 0px;
  left: 320px;
  background-color: var(--white);
  box-shadow: 0 0 8px 0 rgba(255, 255, 255, 0.8);
  border: 1px solid #e1e2e3;
  height: 100%;
  width: 0px;
  transition: width 0.5s;
  z-index: 10;
  margin: 1px;
  overflow-y: auto;
  overflow-x: hidden;
}
.drawing .span-pin {
  border-radius: 50%;
  height: 15px;
  width: 15px;
  border: 1px solid #979797;
  background-color: var(--red);
  margin-left: 5px;
}
.drawing .file-header .span-text {
  color: rgb(126, 138, 150);
  line-height: 32px;
}
.drawing .search-items {
  margin-top: 12px;
  z-index: 2;
  position: absolute;
  max-width: 650px;
  width: 650px;
  left: 50%;
  margin-left: -325px;
}
.drawing .search-items.wirepath {
  max-width: 414px !important;
}
.drawing .search-items.wirepath input.input-search {
  border: 1px solid var(--green-blue);
  border-radius: 4px;
  background-color: var(--white);
  color: var(--green-blue);
  padding-left: 40px;
}
.drawing .search-items.wirepath input.input-search::-webkit-input-placeholder,
.drawing .search-items.wirepath input.input-search::-moz-placeholder {
  color: var(--green-blue) !important;
}
.drawing .search-items.wirepath.selected input {
  color: var(--blue) !important;
}
.drawing .search-items.wirepath #closeButton {
  background-color: var(--blue) !important;
}
.drawing .search-items.wirepath.selected input.input-search {
  border: 1px solid var(--blue);
  background-color: rgba(25, 152, 217, 0.1);
}
.drawing .add-items .item-row .mat-form-field-appearance-legacy .mat-mdc-form-field-infix {
  padding: 0px !important;
  margin: 0px !important;
  padding-left: 0px !important;
  border: 0px !important;
}
.drawing .advanced-details .mat-form-field-appearance-legacy .mat-mdc-form-field-infix {
  padding: 0px !important;
  margin: 0px !important;
  padding-left: 10px !important;
  border: 0px !important;
}
.drawing .add-items .item-row .mat-form-field-suffix {
  padding-right: 5px;
  color: var(--medium-gray);
  font-size: 13px;
  padding-top: 3px;
}
.drawing .add-items .item-row .mat-form-field-appearance-legacy .mat-form-field-wrapper,
.drawing .advanced-details .mat-form-field-appearance-legacy .mat-form-field-wrapper {
  padding: 0px !important;
  margin: 0px !important;
}
.drawing .search-items.wirepath .input-search-icon {
  right: 5px;
  top: 5px;
  width: auto;
  min-width: 27px !important;
  height: 27px;
  padding-left: 5px !important;
  padding-right: 5px !important;
}
.drawing .sipv-drawing-overlay-rect {
  fill: var(--white) !important;
}
.file-whiteboard .drawing .search-items {
  position: fixed;
}
.search-items input {
  -webkit-user-select: text !important;
}
.drawing .add-items .search-items {
  width: 375px !important;
  position: relative;
  left: 0px;
  margin-left: auto;
}
.drawing .add-items .wirepath-add-item .search-items {
  width: 100% !important;
  margin-top: 0px;
}
.mat-menu-drawing-items button.mat-mdc-menu-item {
  width: 100%;
  height: 30px !important;
  line-height: 30px !important;
}
.mat-menu-drawing-items .mat-mdc-menu-content {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.add-accessory-drawing .minor-dialog .mat-mdc-dialog-content {
  padding: 0px !important;
  margin: 0px !important;
}
.drawing .span-icon {
  font-size: 32px;
  line-height: px;
  color: rgb(126, 138, 150);
}
.drawing #locationDetails.active {
  width: 425px;
}
.drawing.whiteboard #locationDetails.active {
  width: 400px;
  height: calc(100vh - 90px);
}
.drawing .file-header label {
  color: var(--white);
  margin-left: 60px;
}
.drawing .file-header .mat-mdc-button {
  min-width: 40px !important;
  width: auto;
  height: 40px;
  position: relative;
}
.drawing .file-header .mat-mdc-button.active {
  border-bottom: 2px solid var(--green-blue) !important;
  border-radius: 0px !important;
}
.drawing .line-vr {
  height: 33px;
  width: 1px;
  background-color: rgb(126, 138, 150);
  margin-top: 4px;
}
.drawing .div-add {
  position: absolute;
  top: 45px;
  width: 100%;
}
.file-whiteboard .drawing .div-add {
  min-width: 600px;
  margin: auto;
  z-index: 100;
  margin-top: -8px;
}
.file-whiteboard .drawing .div-add .input-search-icon {
  height: 32px;
  width: 32px;
  min-width: 32px !important;
  position: absolute;
}
.mat-mdc-list-base .drawing-item.mat-mdc-list-item.active .mat-list-text {
  margin-top: 10px !important;
}
.drawing #productMinimizedView .mat-mdc-button {
  border: 1px solid #e0e0e0;
  box-shadow: 0 2px 4px 0 rgba(4, 25, 50, 0.1);
  background-color: #fff;
  display: inline-block;
  width: 20px;
  min-width: 0px !important;
  margin: 0px;
  margin-bottom: 20px;
}
.drawing #productMinimizedView {
  position: absolute;
  right: 0px;
  top: 0px;
  width: auto;
  padding: 15px;
  height: 100%;
  border: 1px solid #e0e0e0;
  box-shadow: 0 2px 4px 0 rgba(4, 25, 50, 0.1);
  writing-mode: vertical-rl;
  z-index: 100;
  background-color: #fff;
}
.drawing #productMinimizedView .minimized-text {
  padding: 0px 15px;
  margin-bottom: 15px;
}
.drawing #productMinimizedView span.minimized-text {
  color: #7e8a96 !important;
}
.drawing #productMinimizedView label.minimized-text {
  font-family: gilroy-bold;
}
.drawing #locationAssignment md-checkbox .md-label {
  margin-bottom: 1px;
  margin-left: 25px;
}
.drawing #locationAssignment .label-link-to {
  color: var(--medium-gray);
  font-family: Gilroy-regular;
  font-size: 10px;
}
.drawing #locationAssignment .input-wrapper {
  padding: 8px 0px;
}
.drawing #locationAssignment .popup-location {
  position: relative;
  padding: 20px;
}
.drawing #locationAssignment .popup-location:before,
.drawing #locationAssignment .popup-location:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  position: absolute;
  margin-top: -6px;
}
.drawing #locationAssignment .popup-location.left:after {
  left: -10px;
  border-right: 13px solid #fff;
}
.drawing #locationAssignment .popup-location.left:before {
  left: -12px;
  border-right: 15px solid rgba(1, 22, 47, 0.16);
}
.drawing #locationAssignment .popup-location.right:after {
  right: -13px;
  border-left: 13px solid #fff;
}
.drawing #locationAssignment .popup-location.right:before {
  right: -17px;
  border-left: 15px solid rgba(1, 22, 47, 0.16);
}
.drawing #locationAssignment .popup-location.bottom:after {
  bottom: 10% !important;
}
.drawing #locationAssignment .popup-location.bottom:before {
  bottom: 10% !important;
}
.drawing #locationAssignment .popup-location.top:after {
  top: 10% !important;
}
.drawing #locationAssignment .popup-location.top:before {
  top: 10% !important;
}
.drawing #locationAssignment {
  position: absolute;
  box-sizing: border-box;
  height: 320px;
  width: 268px;
  border: 1px solid rgba(1, 22, 47, 0.16);
  background-color: var(--white);
  box-shadow: 0 2px 13px 0 rgba(0, 0, 0, 0.12);
  z-index: 1000;
}
.drawing #deleteView {
  position: absolute;
  right: 0px;
  width: 0px;
  padding: 10px;
  transition: width 0.5s;
  height: 100vh;
  background-color: var(--white);
  box-shadow:
    0 2px 4px -1px rgba(0, 0, 0, 0.2),
    0 4px 5px 0 rgba(0, 0, 0, 0.14),
    0 1px 10px 0 rgba(0, 0, 0, 0.12);
}
.drawing #deleteView.active {
  width: 262px;
}
.drawing #deleteView .mat-mdc-button.mat-secondary {
  min-width: 0px !important;
  width: auto;
}
.drawing .inline-btn {
  min-width: 30px;
  display: inline-block;
  margin-right: 19px;
}
.drawing .inline-btn .mat-mdc-button {
  position: absolute;
  bottom: -3px;
}
.image-quoting .no-images-view .img-upload {
  height: 114px !important;
  min-height: 114px !important;
  min-width: 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  border: 0px !important;
}
.image-quoting .no-images-view .img-text {
  max-width: 114px;
  line-height: 20px;
}
.span-yesterday {
  border-radius: 1px;
  color: #c22c0a !important;
  font-size: 12px;
}
.span-today {
  border-radius: 1px;
  color: #079f89 !important;
  font-size: 12px;
}
.mat-mdc-dialog-container .taskCreate {
  margin: -16px -12px;
}
.task-note .ql-snow * {
  flex-wrap: wrap;
}
.taskCreate .mat-mdc-dialog-content {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 194px !important;
  max-width: 285px;
  max-height: 289px;
}
.taskCreate .mat-form-field-wrapper {
  padding-bottom: 0;
}
.taskCreate .mat-mdc-form-field-infix {
  padding-top: 0;
  border-top: 0;
}
.taskCreate .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0;
}
.taskCreate .mat-mdc-dialog-actions {
  padding: 0px 0;
  min-height: 58px;
}
.taskCreate .custom-date-picker .mat-form-field-prefix {
  position: absolute;
  top: 5px;
  left: 2px;
}
.taskCreate .custom-date-picker .mat-form-field-prefix svg {
  max-width: 18px;
}
.mat-mdc-dialog-container .taskCreate-nt {
  margin: -16px -12px;
}
.taskCreate-nt .mat-mdc-dialog-content {
  margin: 0 !important;
  padding: 0 !important;
}
.taskCreate-nt .mat-form-field-wrapper {
  padding-bottom: 0;
}
.taskCreate-nt .mat-mdc-form-field-infix {
  padding-top: 0;
  border-top: 0;
}
.taskCreate-nt .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0;
}
.taskCreate-nt .mat-mdc-dialog-actions {
  padding-top: 20px;
}
.taskCreate-nt .custom-date-picker .mat-form-field-prefix {
  position: absolute;
  top: 19px;
  left: 2px;
}
.taskCreate-nt .custom-date-picker .mat-form-field-prefix svg {
  max-width: 18px;
}
#dtCloudApp .taskCreate-nt .ng-select.custom-select {
  margin-top: 5px !important;
}
.dashboard .mat-mdc-tab-body-wrapper .mat-tab-body.mat-tab-body-active .mat-tab-body-content {
  position: relative;
  overflow-x: hidden;
  overflow-y: hidden;
  z-index: 1;
  flex-grow: 1;
}
.task-note-min-height {
  min-height: 260px;
}
@media (max-width: 599px) {
  .task-note-min-height .noteCreate-nt {
    min-height: 260px;
  }
  .task-note-min-height .taskCreate-nt {
    min-height: 482px;
  }
  .drawing #locationDetails {
    left: -4px !important;
  }
  .file-whiteboard .drawing .search-items {
    left: 40px;
    top: 100px;
  }
  .file-whiteboard .arrow-up-products {
    top: 96px !important;
  }
  .drawing .btn-menu-location {
    border: 0px !important;
    transform: rotate(-90deg);
    top: 15px;
    right: 20px;
    z-index: 1;
  }
  .drawing .header label {
    line-height: 18px;
    padding-left: 10px;
    padding-top: 20px;
  }
  .drawing .file-header .mat-mdc-button {
    padding: 0px 5px !important;
  }
  .drawing .search-items {
    margin-top: 20px !important;
  }
}
.filter-drag-helper {
  background: white;
  min-height: 35px !important;
  min-width: 100px !important;
  padding: 10px !important;
  border-radius: 0 !important;
}
.hint {
  color: var(--cool-grey);
  min-height: 13px;
  font-size: 11px;
  line-height: 13px;
}
.auto-complete-custom.mat-mdc-option {
  height: 30px;
  line-height: 30px;
  min-height: 30px;
}
.auto-complete-custom.mat-mdc-option .mat-option-text {
  font-size: 13px;
  font-family: gilroy-medium;
}
.quick-add-popup {
  max-width: 450px;
  min-width: 350px;
  width: 100%;
}
.quick-add-popup .mat-mdc-button.primary,
.quick-add-popup .mat-button.mat-secondary {
  height: 31px;
  min-width: 63px !important;
  margin-left: 0;
  width: 63px;
  padding: 0 10px !important;
}
.create-estimate .mat-horizontal-stepper-header .mat-step-icon {
  display: none;
}
.create-estimate .mat-horizontal-stepper-header-container {
  border-bottom: 1px solid #e0e0e0;
  max-height: 57px;
}
.create-estimate .mat-stepper-horizontal-line {
  border-top-width: 4px;
  border-top-style: solid;
  flex: auto;
  height: 0;
  margin: 0 -16px;
  min-width: 32px;
  max-width: 50px;
  background-color: rgba(1, 22, 47, 0.5);
}
.create-estimate .mat-horizontal-content-container {
  padding: 0px;
}
.create-estimate .mat-horizontal-stepper-header {
  height: 57px;
}
mat-form-field.plan-input .mat-mdc-form-field-infix,
mat-form-field.plan-input.mat-focused .mat-mdc-form-field-infix {
  padding: 0px;
  margin: 0px;
  border: unset;
  width: unset;
}
mat-form-field.plan-input .mat-form-field-wrapper {
  margin: 0px;
  padding: 0px;
}
#dtCloudApp .report .mat-mdc-card-title {
  color: var(--color-text-primary);
  font-family: Gilroy-medium;
  font-size: 15px;
  line-height: 18px;
  margin: 0px;
  padding: 10px 15px;
}
.mat-sort-header-arrow {
  margin: 0px 8px 0px 0px !important;
}
.report [aria-sort=ascending] .mat-sort-header-arrow::before {
  content: " ";
  background-image: url(/assets/icons/arrow-drop-up.svg);
  background-size: 100%;
  height: 10px;
  width: 8px;
  position: absolute;
  background-repeat: no-repeat;
  top: 4px;
}
.report [aria-sort=descending] .mat-sort-header-arrow::before {
  content: " ";
  background-image: url(/assets/icons/arrow-drop-down.svg);
  background-size: 100%;
  height: 10px;
  width: 8px;
  position: absolute;
  background-repeat: no-repeat;
  top: 4px;
}
.report .mat-sort-header-stem,
.report .mat-sort-header-indicator {
  display: none !important;
}
#dtCloudApp .report .mat-mdc-card-content.table-content .mat-cell,
#dtCloudApp .report .mat-mdc-card-content.table-content .mat-header-cell {
  padding: 10px 0px;
}
#dtCloudApp .report .md-avatar,
#dtCloudApp .report .acronym-content {
  height: 24px;
  width: 24px;
  margin-top: 13px !important;
  line-height: 24px !important;
}
#dtCloudApp .report .md-avatar,
#dtCloudApp .report .acronym-content,
.m-t-0 {
  margin-top: 0 !important;
}
#dtCloudApp .report .acronym-content.acronym-sales {
  margin-top: -15px !important;
  height: 36px;
  width: 40px;
  line-height: 36px !important;
}
#dtCloudApp .report .acronym-content.acronym-sales.m-t-0 {
  margin-top: 0 !important;
}
#dtCloudApp .report .mat-mdc-card-content.table-content label {
  font-size: 13px;
  line-height: 22px;
  padding-left: 16px;
  word-break: break-all;
}
#dtCloudApp .report .mat-mdc-card-content.table-content span.span-opp-name {
  display: block !important;
  line-height: 12px;
  color: var(--cool-grey);
  padding-bottom: 5px;
  padding-left: 16px;
}
#dtCloudApp .report .mat-mdc-card-content.table-content {
  margin-left: 0px !important;
  margin-right: 0px !important;
  margin-top: 0px !important;
}
#dtCloudApp .report .mat-mdc-card-content.table-content tr.mat-mdc-header-row {
  height: 44px;
}
#dtCloudApp .report .mat-mdc-card-content {
  margin: 32px 15px !important;
}
#dtCloudApp .report.report-new .mat-mdc-card-content {
  margin: 12px 15px !important;
}
.report-view {
  margin-top: -15px;
}
.menu-filter .mat-mdc-menu-content .mat-divider {
  margin-top: 10px;
}
.report-filters .menu-button:hover .calendar-icon svg #Group rect:not(first-child),
.report-filters .menu-button.active .calendar-icon svg #Group rect:not(first-child) {
  stroke: var(--green-blue) !important;
}
.report-filters .menu-button.active span,
.report-filters .menu-button.active label {
  fill: var(--green-blue) !important;
}
.report-filters .menu-button.active .mat-button-wrapper,
.report-filters .menu-button:hover .mat-button-wrapper {
  color: var(--green-blue) !important;
}
.menu-filter .mat-mdc-menu-content {
  padding-bottom: 0px !important;
}
.menu-filter .mat-mdc-menu-content label {
  font-family: gilroy-medium !important;
}
#dtCloudApp .report .mat-mdc-card-content label {
  color: var(--color-text-primary);
  font-family: Gilroy-medium;
  font-size: 36px;
  line-height: 42px;
}
#dtCloudApp .report .mat-mdc-card-content label.label-reason,
#dtCloudApp .report .mat-mdc-card-content label.labek-chart,
#dtCloudApp .report .mat-mdc-card-content label.labek-chart {
  font-size: 14px;
}
#dtCloudApp .report {
  overflow: auto;
  height: calc(100vh - 60px);
  margin-top: 0px;
  padding-top: 0px;
}
#dtCloudApp .report .report-card {
  height: 100%;
  min-height: 185px;
}
#dtCloudApp .report tbody tr {
  min-height: 66px;
  height: auto;
}
#dtCloudApp .report .mat-mdc-card-content span.reason {
  line-height: 30px;
}
#dtCloudApp .report .mat-mdc-card-content span.span-owner {
  color: var(--cool-grey);
}
#dtCloudApp .report .mat-mdc-card-content.sales-chart-month {
  padding-top: 70px !important;
  margin: 0px !important;
}
#dtCloudApp .report .mat-mdc-card-content span.under-text {
  font-size: 18px;
  font-family: gilroy-medium;
  padding-left: 10px;
}
.sales-leaderboard .acronym-content {
  height: 36px;
  width: 40px;
  line-height: 33px !important;
  border-radius: 50%;
  margin-top: -13px;
}
.report .disabled-body {
  opacity: 0.4;
  cursor: not-allowed;
}
#dtCloudApp .report .sales-leaderboard .label-chart {
  margin-left: 48px;
  color: var(--color-text-primary);
  font-family: Gilroy-medium;
  font-size: 13px;
  line-height: 14px;
  min-width: 80px;
  margin-top: px;
}
#dtCloudApp .report .sales-leaderboard .row-user {
  margin-bottom: 10px;
}
.report .span-type {
  height: 10px;
  width: 10.29px;
  border-radius: 2px;
  background-color: var(--blue);
  display: inline-block;
}
.report .legends span {
  padding: 5px;
  line-height: 15px;
}
.report .div-empty {
  color: var(--medium-gray);
  font-size: 12px;
  line-height: 14px;
  text-align: center;
  padding: 40px 0px;
}
#projectDashboard .dt-table .dt-table-header .dt-header-cell {
  position: relative;
}
.report .sales-leaderboard svg {
  background: var(--light-gray2);
  height: 10px;
  margin-top: 10px;
  margin-right: 0px;
}
.report .mat-card-header-text {
  margin: 0px;
}
.report .sales-leaderboard .md-avatar {
  margin-top: -13px;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 50% !important;
  margin-right: 12px;
}
.report .sales-bar {
  margin-top: -13px;
  margin-bottom: 10px;
}
.width100 {
  width: 100%;
}
.height100 {
  height: 100%;
}
@media (max-width: 599px) {
  .width100-xs {
    width: 100%;
  }
}
.report .img-row {
  height: 36px;
  width: 36px;
  margin-right: 11px;
  min-width: 36px;
  max-width: 36px;
}
.sales-leaderboard {
  margin: 20px 15px;
}
.report .project-type-chart {
  min-height: 150px;
  margin-top: 50px;
}
.report .span-text {
  line-height: 22px !important;
}
.report .sales-leaderboard .acronym-content {
  height: 36px;
  width: 40px;
  line-height: 33px !important;
  border-radius: 50%;
  background-color: var(--light-gray2);
  text-align: center;
  vertical-align: middle;
  color: var(--medium-gray);
  text-transform: uppercase;
  font-size: 11px;
  font-family: gilroy-medium;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  display: inline-block;
  margin-top: -13px !important;
  margin-right: 12px;
}
.report app-report-filters {
  overflow: auto;
}
.summary-content {
  padding: 5px 0;
}
.summary-header {
  color: var(--cool-grey);
  font-family: gilroy-semi-bold;
  font-size: 10px;
  text-align: left;
  text-transform: uppercase;
}
.width-90 {
  min-width: 90px;
  max-width: 90px;
  width: 90px;
}
.text-a-e {
  text-align: end;
}
.text-a-c {
  text-align: center;
}
mat-form-field.new-item-group .mat-mdc-form-field-infix {
  padding: 0px !important;
  border-top: 0px !important;
}
mat-form-field.new-item-group .mat-form-field-appearance-standard .mat-form-field-flex {
  padding: 0px !important;
}
mat-form-field.new-item-group .mat-form-field-wrapper {
  padding: 0px !important;
}
mat-form-field.new-item-group .mat-form-field-flex {
  padding: 0;
}
.custom-tooltip-description {
  position: fixed;
  color: var(--color-text-primary);
  border-radius: 4px;
  background-color: #fff;
  line-height: 16px;
  box-shadow: 0 7px 16px 0 rgba(0, 0, 0, 0.21);
  text-transform: none;
}
.custom-tooltip {
  position: fixed;
  color: #fff;
  border-radius: 4px;
  background-color: var(--color-text-primary);
  line-height: 16px;
  box-shadow: 0 7px 16px 0 rgba(0, 0, 0, 0.21);
  width: 314px;
  padding: 9px;
  text-transform: none;
  font-size: 12px;
}
.custom-tooltip::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -14px;
  border-width: 7px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}
.custom-tooltip-inventory {
  position: fixed;
  color: black;
  border-radius: 4px;
  background-color: #fff;
  line-height: 16px;
  box-shadow: 0 7px 16px 0 rgba(0, 0, 0, 0.21);
  padding: 9px;
  text-transform: none;
  font-size: 13px;
  font-family: arial;
  z-index: 9;
}
.tooltipwidth {
  max-width: unset !important;
  white-space: normal;
}
quill-editor {
  display: flex;
  flex-direction: column;
}
.description-container quill-editor {
  margin-left: -15px;
}
#emoji-close-div {
  z-index: 998;
}
.text-a-r {
  text-align: right !important;
}
.installer-progress-div {
  position: fixed;
  z-index: 65;
  top: 11px;
  width: 100%;
  height: 1px;
  text-align: center;
  text-align: -webkit-center;
  text-align: -moz-center;
}
.installer-progress-div .download-dismiss {
  margin-left: 20px;
  border: 1.5px solid var(--blue);
  padding: 2px 22px;
  color: var(--blue);
  font-family: "gilroy-bold";
  cursor: pointer;
}
.installer-progress-div .installProgress {
  padding: 20px;
  box-sizing: border-box;
  height: 63px;
  max-width: 730px;
  width: auto;
  border: 1px solid #d2d2d2;
  border-radius: 8px;
  background-color: var(--white);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.25);
}
.installer-progress-div .installProgress .msg-text {
  color: var(--color-text-primary);
  font-family: gilroy-semi-bold;
  font-size: 13px;
  line-height: 15px;
  text-align: left;
}
.installer-progress-div .installProgress .img-div {
  border: 2px solid var(--blue);
  width: 42px;
  height: 42px;
  border-radius: 50%;
  margin: 10px 10px 10px 0;
}
.installer-progress-div .installProgress .img-div .img {
  height: 42px;
  width: 20px;
}
.activity-header {
  padding: 0px 15px 20px 28px;
  color: var(--color-text-primary);
  font-family: gilroy-bold;
  font-size: 13px;
  line-height: 15px;
}
.activity .widget-content p {
  display: block;
  margin-block-start: 0em;
  margin-block-end: 0em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.activity .loading-progressor {
  margin-top: 28px;
  margin-bottom: 28px;
}
.avtivity-detail .dialog-content .custom-date-picker .mat-form-field-prefix {
  position: absolute;
  top: 19px !important;
}
.notification .widget-content .content-col-2 .content-row-1 span p {
  color: rgba(0, 0, 0, 0.54);
  font-family: gilroy-medium;
  font-size: 13px;
  line-height: 15px;
}
.notification .widget-content .content-col-2 .content-row-1 span > b {
  color: var(--color-text-primary);
  font-family: gilroy-medium;
  font-size: 14px;
  line-height: 20px;
}
.notification .widget-content .content-col-2 .content-row-1 span > strong.mentio-user-color {
  color: var(--cool-green) !important;
}
.notification .widget-content .content-col-2 .content-row-1 span > strong {
  font-family: gilroy-bold;
}
.notification b {
  color: var(--color-text-primary);
  font-family: gilroy-bold;
  font-size: 13px;
  line-height: 20px;
}
.notification .mentio-user-color,
.widget-ndb.activity .mentio-user-color {
  color: var(--cool-green) !important;
  font-family: gilroy-bold;
  font-size: 13px;
  line-height: 15px;
}
.notification p {
  color: rgba(0, 0, 0, 0.54);
}
.notification .loading-progressor {
  margin-top: 15px;
  margin-bottom: 20px;
}
.notification span.statusBtn-green {
  background-color: var(--cool-green);
  line-height: 32px;
}
.notification span.productName-green {
  color: #0dbb7d;
  line-height: 32px;
  font-weight: bold;
  cursor: pointer;
}
.notification span.minimum-stock-color {
  color: #fb8030;
}
.notification span.reorder-stock-color {
  color: #e03131;
}
#dtCloudApp .reorder-supplier-list .ng-dropdown-panel {
  width: 100%;
  left: 0px;
}
.editTaxRate {
  position: absolute;
  bottom: 1px;
  right: 35px;
  color: var(--blue);
  background-color: white;
  padding: 7px 5px;
  display: none;
  cursor: pointer;
}
.taxDropdown:hover + .editTaxRate,
.editTaxRate:hover {
  display: block !important;
}
mat-form-field.date-of-birth .mat-form-field-wrapper {
  width: 100%;
}
.price-prefix-box .mat-mdc-form-field-infix .mat-mdc-input-element {
  padding-left: 37px;
  font-size: 15px;
}
.price-prefix .mat-mdc-form-field-infix .mat-mdc-input-element,
.price-prefix-top-35 .mat-mdc-form-field-infix .mat-mdc-input-element {
  padding-left: 18px;
}
#dtCloudApp .qty-prefix .mat-mdc-form-field-infix .mat-mdc-input-element {
  padding-left: 35px;
}
.price-prefix:after,
.qty-prefix:after,
.price-prefix-box::after {
  font-family: gilroy-medium;
  content: "$";
  position: relative;
  left: 8px;
  bottom: 24px;
  color: #1d2836;
  font-size: 14px;
  opacity: 0.7;
}
.price-prefix-box {
  position: relative;
}
.price-prefix-box:after {
  color: #1d2836;
  font-size: 16px;
  opacity: 0.7;
  width: 34px;
  height: 31px;
  left: 0;
  background-color: var(--silver);
  text-align: center;
  padding: 7px 12px;
}
.qty-prefix:after {
  content: "Qty";
  bottom: 25px;
  width: fit-content;
}
.qty-prefix.length-prefix:after {
  content: "Length";
  width: fit-content;
}
.price-sufix .mat-mdc-form-field-infix .mat-mdc-input-element,
.price-sufix-top-35 .mat-mdc-form-field-infix .mat-mdc-input-element {
  padding-right: 18px !important;
}
.price-sufix-top-35.feet .mat-mdc-form-field-infix .mat-mdc-input-element,
.price-sufix.feet .mat-mdc-form-field-infix .mat-mdc-input-element {
  padding-right: 40px !important;
}
.price-sufix-top-35.metres .mat-mdc-form-field-infix .mat-mdc-input-element,
.price-sufix.metres .mat-mdc-form-field-infix .mat-mdc-input-element,
.price-perHr .mat-mdc-form-field-infix .mat-mdc-input-element {
  padding-right: 55px !important;
}
.price-perHr:before {
  content: "per hr";
  right: 5px;
  left: auto;
  position: absolute;
  top: 12px;
  color: #1d2836;
  font-size: 14px;
  opacity: 0.7;
}
.price-sufix.feet:after {
  content: "feet";
  opacity: 1;
  position: absolute;
  right: 10px;
  top: 13px;
}
.price-sufix-top-35.feet:after {
  content: "feet";
  opacity: 1;
  position: absolute;
  right: 10px;
  top: 35px;
}
.fixed-length-input.price-sufix-top-35.feet:after {
  top: 32px;
}
.length-rule-editor .price-sufix.feet:after {
  top: 10.5px;
}
.price-sufix.metres:after,
.price-sufix-top-35.metres:after {
  content: "metres";
  position: absolute;
  right: 10px;
  top: 12px;
  opacity: 0.7;
}
.price-sufix-top-35.metres:after {
  top: 38px;
}
.bread-crumb .stage-ellipsis {
  overflow: hidden;
  width: 140px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.link-icon {
  position: relative;
  top: 6px;
}
.opportunity-title input.opp-input {
  border: none;
  box-shadow: none;
}
.opportunity-title input.opp-input:focus {
  border: 1px solid var(--silver);
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
}
.opportunity-title input.opp-input:focus .opportunity-pencil {
  display: none;
}
#dtCloudApp ng-select.ng-select.custom-select2 .ng-dropdown-panel {
  min-width: 180px;
}
#dtCloudApp ng-select.ng-select.custom-select-leadsource .ng-dropdown-panel {
  min-width: 217px;
}
#dtCloudApp ng-select.ng-select.custom-select-settings .ng-dropdown-panel {
  min-width: 320px;
  right: 0px;
  left: auto;
}
#dtCloudApp ng-select.ng-select.custom-select-settings2 .ng-dropdown-panel {
  left: 0px;
  right: auto;
}
input[disabled] {
  background-color: var(--light-gray2);
}
.ng-select.ng-select-disabled > .ng-select-container,
.mat-mdc-input-element:disabled {
  background-color: var(--light-gray2) !important;
  color: rgba(0, 0, 0, 0.38) !important;
}
.waring-banner-new {
  color: var(--white);
  font-family: gilroy-medium;
  padding: 5px 20px;
  min-height: 36px;
  font-size: 12px;
}
.waring-banner-new.blue {
  background-color: var(--blue);
}
.waring-banner-new.blue .mat-mdc-button.primary {
  border: 1px solid #fff;
  background-color: var(--blue);
  max-height: 23px;
}
.save-default {
  display: flex !important;
  padding: 8px 32px;
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  transition: display 1s ease-in, margin-bottom 1s ease-in;
  margin-bottom: 0;
}
.save-default.hide {
  display: none !important;
  transition: display 1s ease-in, margin-bottom 1s ease-in;
  margin-bottom: -40px;
}
.project-header .mat-form-field-wrapper {
  padding-bottom: 0px;
}
.project-header .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0px;
}
.project-header .mat-mdc-form-field-infix {
  padding: 0px;
  border-top: 0px;
}
.svg_warning g path {
  fill: var(--orange);
}
.svg_warning circle {
  fill: var(--white);
}
.svg_warning > path {
  fill: var(--white);
}
.white-orange-svg .svg_warning g path {
  fill: var(--white);
}
.white-orange-svg .svg_warning circle {
  fill: var(--orange);
}
.white-orange-svg .svg_warning > path {
  fill: var(--orange);
}
.preview-heading {
  height: 50px;
  border-bottom: 1px solid var(--light-gray2);
  align-items: center;
  justify-content: center;
  display: flex;
  color: var(--navy);
  font-family: gilroy-semi-bold;
  font-size: 20px;
}
.sub-preview-body {
  padding: 20px;
}
.cursor {
  cursor: pointer;
}
.avtivity-detail .mat-form-field-wrapper {
  padding: 0;
}
.avtivity-detail .mat-mdc-form-field-infix,
.avtivity-detail .mat-form-field-flex,
.avtivity-detail .dialog-content .mat-mdc-form-field-infix,
.avtivity-detail .dialog-content .mat-form-field-flex {
  padding: 0 !important;
  border-top: 0;
}
app-upload-file.project-task-upload .img-upload {
  width: 100%;
  min-width: 640px;
  max-width: 100%;
  height: 65px;
  max-height: 65px;
  min-height: 65px;
}
@media (max-width: 599px) {
  app-upload-file.project-task-upload .img-upload {
    min-width: 100%;
  }
}
img.image-hight-width {
  border: 1px solid white;
  border-radius: 5px;
  height: 180px !important;
  width: 192px !important;
  min-height: 100% !important;
  min-width: 192px !important;
  max-height: 100% !important;
  max-width: 192px !important;
  background-color: var(--light-gray);
  padding: 0 !important;
  margin: 20px 0px 20px 10px;
}
p {
  line-height: 18px;
  margin: 0px;
}
p img {
  width: 30px;
  height: 30px;
}
.add-accessory-bs .mat-bottom-sheet-container {
  min-width: 100vw !important;
  max-width: 100vw !important;
  overflow: hidden;
  height: 370px;
  max-height: 370px;
}
.co-status-bs {
  border-radius: 10px 10px 0 0;
  padding: 16px 8px !important;
}
.ng-star-inserted ul#breadcrumb > li::before {
  content: none;
}
.ng-star-inserted ul#breadcrumb li:not(.ql-direction-rtl) {
  padding-left: unset !important;
  padding-right: unset !important;
}
ul#breadcrumb {
  list-style: none;
  display: inline-block;
  font-size: 12px;
  padding: 0;
  min-height: 26px;
}
#breadcrumb li {
  float: left;
  background-color: transparent;
  box-shadow: none;
  border-radius: 1.5px;
  margin: 0;
  transition-property: width;
  transition-duration: 2s;
}
.notification #breadcrumb li {
  max-width: 100%;
  display: inline-block;
  flex-wrap: nowrap;
  white-space: nowrap;
}
.notification ul.divide-width li {
  max-width: calc(100% / 2) !important;
}
#breadcrumb li a {
  color: var(--slate-grey);
  display: block;
  background: rgba(206, 208, 211, 0.25);
  text-decoration: none;
  position: relative;
  height: 28px;
  line-height: 28px !important;
  padding: 0 10px 0 5px;
  text-align: center;
  margin-right: 15px;
  font-size: 11px;
}
#breadcrumb li a div {
  width: auto;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  transition-property: width;
  transition-duration: 2s;
}
#breadcrumb li:nth-child(even) a {
  background-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li:nth-child(even) a:before {
  border-color: rgba(206, 208, 211, 0.25);
  border-left-color: transparent;
}
#breadcrumb li:nth-child(even) a:after {
  border-left-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li:first-child a {
  padding-left: 15px;
  -moz-border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px 0 0 4px;
}
#breadcrumb li:first-child a:before {
  border: none;
}
#breadcrumb li:last-child a {
  padding-right: 15px;
  -moz-border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0;
  border-radius: 0 4px 4px 0;
}
#breadcrumb li:last-child a:after {
  border: none;
}
#breadcrumb li a:before,
#breadcrumb li a:after {
  content: "";
  position: absolute;
  top: 0;
  border: 0 solid rgba(206, 208, 211, 0.25);
  border-width: 14px 6px;
  width: 0;
  height: 0;
}
#breadcrumb li a:before {
  left: -12px;
  border-left-color: transparent;
}
#breadcrumb li a:after {
  left: 100%;
  border-color: transparent;
  border-left-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li a:hover {
  color: var(--green-blue);
}
#breadcrumb li a:hover:before {
  border-color: rgba(206, 208, 211, 0.25);
  border-left-color: transparent;
}
#breadcrumb li a:hover:after {
  border-left-color: rgba(206, 208, 211, 0.25);
}
#breadcrumb li a div.parent-cat,
.min-w-40 {
  min-width: 40px !important;
}
#breadcrumb li a div.child-cat {
  min-width: 60px;
}
#breadcrumb li a div.subChild-cat {
  min-width: 80px;
}
.t-a-c {
  text-align: center;
}
.t-a-e {
  text-align: end;
}
.price-container,
.time-container {
  box-sizing: border-box;
  height: 36px;
  border: 1px solid var(--silver);
  border-radius: 2px;
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
  padding: 0 10px;
  font: unset;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
  line-height: 33px;
  padding-left: 19px;
  position: relative;
  margin: 3px 0;
  cursor: pointer;
}
.time-container {
  padding-left: 37px;
  font-size: 15px;
}
.planning-task-due-date {
  position: relative;
  bottom: 50px;
  right: 25px;
}
.planning-task-reminder-date {
  position: relative;
  bottom: 20px;
  right: 25px;
}
.price-container {
  background-color: #fff;
}
.price-container.disabled,
.time-container.disabled {
  background-color: rgba(0, 0, 0, 0.06);
  pointer-events: none;
}
.price-container.box-dollar {
  padding-left: 38px;
  width: 100%;
}
.price-container.box-dollar:after {
  left: -1px;
  text-align: center;
  width: 34px;
  height: 31px;
  background-color: var(--silver);
}
.time-container:after {
  font-family: gilroy-medium;
  content: "";
  position: absolute;
  left: -1px;
  top: 0px;
  color: #1d2836;
  font-size: 14px;
  opacity: 0.7;
  background-image: url("./media/stopwatch-HWVPFMXN.svg");
  width: 34px;
  height: 35px;
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
  background-color: var(--silver);
}
.plan-input .mat-form-field-flex {
  padding-top: 0px !important;
}
mat-form-field.new-item-group .mat-form-field-subscript-wrapper,
mat-form-field.plan-input .mat-form-field-subscript-wrapper {
  overflow: unset !important;
}
.task-detail .dz-preview.dz-image-preview {
  display: none;
}
.task-info .edit-detail .mat-form-field-wrapper {
  padding: 0;
}
.task-info .edit-detail .mat-form-field-appearance-standard .mat-form-field-fle {
  padding: 0;
}
.task-info .edit-detail .mat-form-field-flex {
  padding-top: 0px;
}
.task-info .edit-detail .mat-mdc-form-field-infix {
  border: none;
}
.done-link {
  right: 0;
  margin-top: -40px;
  position: absolute;
}
.company-address .done-link {
  right: 0;
  margin-top: -20px;
  position: absolute;
}
.company-address app-address mat-form-field {
  padding-bottom: 10px;
}
.create-address-dialog .country-posstion {
  bottom: 10px;
  position: relative;
}
.company-information .country-posstion {
  bottom: 20px;
  position: relative;
}
.app-files .attachments-overlay {
  min-height: 170px;
}
.ng-select.custom-select2.group-section.ng-select-single.gray .ng-select-container .ng-value-container .ng-value {
  color: var(--medium-gray);
}
.ng-select.custom-select2.group-section.ng-select-single.red .ng-select-container .ng-value-container .ng-value {
  color: #d10c38;
}
.ng-select.custom-select2.group-section.ng-select-single.green .ng-select-container .ng-value-container .ng-value {
  color: var(--green-blue);
}
.ng-select.custom-select2.group-section.ng-select-single.blue .ng-select-container .ng-value-container .ng-value {
  color: var(--blue);
}
.ng-select.custom-select2.group-section.ng-select-single.yellow .ng-select-container .ng-value-container .ng-value {
  color: #ffbf00;
}
.ng-select.custom-select2.group-section.ng-select-single.orange .ng-select-container .ng-value-container .ng-value {
  color: #fa5907;
}
.dt-dialog.image-viewer-dialog .mat-mdc-dialog-container {
  background-color: rgba(0, 0, 0, 0.5) !important;
}
.image-position {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.sync-cost .edit-label-sync-cost {
  position: absolute;
  right: 7px;
  top: 10px;
}
.sync-cost .edit-label-sync-cost.sync-now-cost {
  color: var(--orange);
}
.sync-cost .sync-color {
  color: var(--orange) !important;
}
.sync-cost .sync-color:focus {
  color: inherit !important;
}
.sync-icon {
  min-width: 12px;
  width: 12px;
  height: 12px;
  min-height: 12px;
}
.non-sync-icon {
  min-width: 16px;
  width: 16px;
  height: 16px;
  min-height: 16px;
}
.sync-cost .sync-loader {
  position: absolute;
  top: 0;
  right: 0;
  left: unset;
}
.sync-cost .sync-loader svg {
  animation-name: sync-spin;
  animation-duration: 600ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
.sync-cost .sync-loader svg path {
  color: var(--orange);
  fill: orange;
}
@keyframes sync-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.circle-right-left-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  border: 1px solid var(--light-gray2);
  background-color: var(--white);
  border-radius: 50%;
  padding: 6px;
  margin: 0 10px;
  position: relative;
}
.dialog-header {
  font-family: gilroy-semi-bold;
  font-size: 26px;
  min-height: 64px;
}
.online-indicator {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  position: relative;
  bottom: -22px;
  left: 18px;
  border: 1px solid var(--white);
}
#attachmentZoneTaskOverview .dz-preview.dz-image-preview,
#attachmentZoneServiceCallDetail .dz-preview.dz-image-preview,
#attachmentZoneProjectOverview .dz-preview.dz-image-preview,
#attachmentZoneProjectTask2 .dz-preview.dz-image-preview,
#attachmentZoneProjectTask .dz-preview.dz-image-preview,
#attachmentZoneOpportunityOverview .dz-preview.dz-image-preview {
  display: none;
}
.attachment-name {
  overflow: hidden;
  width: 230px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#dtCloudApp .ng-select.group-section .ng-select-container {
  font-size: 12px;
}
.bold-text,
.bold-red {
  font-family: gilroy-semi-bold;
}
.bold-red {
  color: var(--red4);
}
.mat-badge-content {
  line-height: 15.9px !important;
  top: -8px !important;
  color: white;
  height: 16px !important;
  min-width: 18px;
  max-width: 18px;
  background-color: var(--red);
  border-radius: 50%;
  font-size: 80%;
  text-align: center;
  left: 12px;
  font-family: gilroy-bold;
}
.hidden {
  display: none;
}
.body.avoid-select * {
  -webkit-user-select: none;
  user-select: none;
}
app-text-editor *,
app-add-items * {
  user-select: unset !important;
  -webkit-user-select: unset !important;
  -moz-user-select: unset !important;
  -webkit-user-drag: none;
}
.item-drag-preview {
  position: absolute;
  max-width: 400px;
  height: 50px;
  line-height: 50px;
  padding: 0 10px;
  color: white;
  background: rgba(0, 0, 0, 0.8);
  z-index: 1000;
  font-size: 14px;
  box-sizing: border-box;
  border-radius: 3px;
  font-family: gilroy-bold;
}
.down-arrow {
  transform: rotate(90deg);
  margin-left: 10px;
  position: relative;
  margin-right: 20px;
}
.summary-menu.project-detail {
  min-width: 320px;
}
.create-new-location-btn {
  border-top: 1px solid #ccc;
  padding: 5px;
  display: flex;
  justify-content: space-between;
  height: 31px;
  align-items: center;
}
.headeName-ellipsis-label {
  color: var(--navy);
  font-family: gilroy-bold !important;
  margin: 0px !important;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.project-labor-product {
  font-size: 18px;
  font-family: gilroy-medium;
  color: var(--navy);
  margin-right: 10px;
}
.green-arrow-icon #Triangle {
  fill: var(--cool-green);
}
#dtCloudApp .ng-select.import-column-selection .ng-select-container {
  color: var(--cool-green) !important;
  border: unset;
  box-shadow: unset;
}
#dtCloudApp .ng-select.import-column-selection.ng-select-focused .ng-select-container {
  border: 1px solid var(--cool-green);
}
#dtCloudApp .ng-select.import-column-selection .ng-dropdown-panel {
  width: 180px;
}
.import-tick {
  background-color: var(--cool-green);
  border-radius: 50%;
  width: 16px;
  height: 16px;
  border: 1px solid var(--cool-green);
}
.sync-loader {
  position: absolute;
  opacity: 1;
}
.sync-loader svg {
  animation-name: sync-spin;
  animation-duration: 600ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
.sync-loader svg path {
  fill: var(--orange);
}
@keyframes sync-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
#dtCloudApp .ng-select.import-dropdown.ng-select-single .ng-select-container {
  height: 24px;
  line-height: 24px;
}
#dtCloudApp .ng-dropdown-panel.client-owner-select {
  margin-left: 8px;
  margin-top: 10px;
}
#dtCloudApp .ng-dropdown-panel.supplier-select.append-body {
  margin-left: 0px !important;
}
#dtCloudApp .ng-dropdown-panel.templatePosition {
  bottom: 0px !important;
}
.ng-select.import-dropdown .ng-arrow-wrapper {
  max-height: 24px;
}
.cancel-delete.material-icons {
  color: var(--medium-gray);
  font-size: 18px;
  cursor: pointer;
}
.ql-editor.ql-blank::before {
  color: var(--medium-gray);
  font-family: gilroy-medium;
  font-size: 13px;
  line-height: 15px;
  pointer-events: none;
  font-style: unset !important;
}
.hide-import {
  display: none !important;
}
.settings-nav .mat-mdc-list-base .mdc-list-item__content {
  padding: 0 12px;
}
.settings-nav .sub-nav-background .mat-mdc-list-base .mdc-list-item__content {
  padding-left: 0;
}
.font-size-12 {
  font-size: 12px !important;
}
.font-size-11 {
  font-size: 11px !important;
}
.text-secondary {
  color: var(--medium-gray);
  font-family: gilroy-medium;
}
.labor-on-add {
  margin-top: -24px;
}
.labor-on-add .time-input-container {
  min-width: 125px !important;
  max-width: 125px !important;
}
.labor-on-add .time-input-container .custom-flex-size {
  max-width: 32px !important;
  min-width: 32px !important;
  min-height: 27px !important;
  max-height: 27px !important;
}
.labor-on-add .time-input-container .time-input-box .custom-flex-size .mat-mdc-form-field input {
  padding: 0 5px;
}
.labor-on-add .time-input-header {
  display: none !important;
}
.labor-on-add .time-input-container .time-input-icons.bottom {
  margin-top: 0px !important;
}
.moremenu-dropdown {
  min-width: 180px !important;
}
app-address-detail.p-billing .no-address {
  padding: 8px 0px 16px 16px !important;
}
app-address-detail.p-site .no-address {
  padding: 16px 0px 8px 16px !important;
}
#quotePaymentMethods mat-checkbox.mat-mdc-checkbox-checked .mat-checkbox-frame,
#quotePaymentMethods .mat-checkbox-checked.mat-accent .mat-checkbox-background,
#quotePaymentMethods .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
  border-radius: 50% !important;
  opacity: 0;
  transform: rotate(90deg);
}
mat-label.lbl-required::after,
mat-label.lbl-required:after {
  content: " *";
  vertical-align: top;
  color: var(--red) !important;
  position: relative;
  top: -2px;
  font-size: 13px !important;
}
.trial-warning {
  height: 67px;
  border-radius: 3px;
  background-color: var(--blue);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  margin-bottom: 20px;
  z-index: 75;
}
.trial-warning > span {
  color: var(--white);
  font-family: gilroy-medium;
  font-size: 13px;
}
.trial-warning .mat-mdc-button {
  height: 23px;
  border-radius: 2px;
  background-color: var(--white);
  box-shadow: 0 2px 4px 0 rgba(3, 3, 3, 0.19);
  color: #1d2836 !important;
  font-family: gilroy-medium;
  font-size: 13px;
  line-height: 15px;
  text-align: center;
  min-width: 70px;
  padding: 4px !important;
  line-height: 13px !important;
  cursor: pointer;
}
.trial-warning .mat-mdc-button.presented {
  color: #1d2836;
}
.trial-warning .mat-mdc-button:hover {
  background-color: var(--white) !important;
}
.trial-warning.expired {
  height: 29px;
}
.trial-warning-extend {
  border-radius: 0 3px 3px 0;
  background-color: #147bb5;
  font-family: gilroy-semi-bold;
  font-size: 12px;
  height: 35px;
  line-height: 15px;
  width: 100%;
  text-align: center;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: transparent !important;
}
.ql-snow .ql-picker.ql-header {
  width: 43px !important;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""])::before {
  content: "" !important;
  top: 2px;
  left: 3px;
  min-height: 20px;
  max-height: 20px;
  max-width: 20px;
  min-width: 20px;
  height: 20px;
  width: 20px;
  background-size: 20px;
  background-repeat: no-repeat;
  background-image: url("./media/format-size-NSC7LXXU.svg") !important;
}
.ql-snow .ql-picker.ql-header:not(.ql-color-picker):not(.ql-icon-picker) svg {
  right: -6px !important;
  top: 79% !important;
}
.ql-snow button.ql-bold svg,
.ql-snow button.ql-underline svg,
.ql-snow button.ql-strike svg,
.ql-snow button.ql-blockquote svg,
.ql-snow button.ql-list svg,
.ql-snow button.ql-clean svg,
.ql-snow button.ql-link svg,
.ql-snow button.ql-image svg,
.ql-snow button.ql-emoji svg,
.ql-snow button.ql-indent svg,
.ql-align.position-relative.ql-picker.ql-icon-picker .ql-picker-label svg,
.ql-snow button.ql-italic svg {
  display: none;
}
.ql-snow button.ql-bold::after,
.ql-snow button.ql-underline::after,
.ql-snow button.ql-strike::after,
.ql-snow button.ql-blockquote::after,
.ql-snow button.ql-list::after,
.ql-snow button.ql-clean::after,
.ql-snow button.ql-link::after,
.ql-snow button.ql-image::after,
.ql-snow button.ql-emoji::after,
.ql-snow button.ql-indent::after,
.ql-align.position-relative.ql-picker.ql-icon-picker .ql-picker-label::after,
.ql-snow button.ql-italic::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 3px;
  min-height: 20px;
  max-height: 20px;
  max-width: 20px;
  min-width: 20px;
  height: 20px;
  width: 20px;
  background-size: 20px;
  background-repeat: no-repeat;
}
.ql-snow button.ql-bold::after {
  background-image: url("./media/editor-bold-CMSV4RMZ.svg") !important;
}
.ql-snow button.ql-italic::after {
  background-image: url("./media/editor-italic-OXA2733I.svg") !important;
}
.ql-snow button.ql-underline::after {
  background-image: url("./media/editor-underline-LGVLZSQM.svg") !important;
}
.ql-snow button.ql-strike::after {
  background-image: url("./media/editor-Strikethrough-HAEESY4D.svg") !important;
}
.ql-snow button.ql-blockquote::after {
  background-image: url("./media/editor-Quote-N2K6MD6B.svg") !important;
}
.ql-snow button.ql-clean::after {
  background-image: url("./media/clear-format-EJ6XCGC6.svg") !important;
}
.ql-snow button.ql-link::after {
  background-image: url("./media/editor-link-KKKA55MP.svg") !important;
}
.ql-snow button.ql-emoji::after {
  background-image: url("./media/editor-smile-QHLC4CUP.svg") !important;
}
.ql-snow button.ql-image::after {
  background-image: url("./media/gallery-section-QS6TY5YC.svg") !important;
}
.ql-snow button.ql-indent[value="+1"]::after {
  background-image: url("./media/Increase-Indent-U3I236NJ.svg") !important;
}
.ql-snow button.ql-indent[value="-1"]::after {
  background-image: url("./media/decrease-indent-2LMH6EM5.svg") !important;
}
.ql-snow button.ql-list[value=bullet]::after {
  background-image: url("./media/editor-list-V6NYPK4I.svg") !important;
}
.ql-snow button.ql-list[value=ordered]::after {
  background-image: url("./media/numbered-list-PMR2SGJX.svg") !important;
}
.ql-align.position-relative.ql-picker.ql-icon-picker .ql-picker-label::after {
  background-image: url("./media/editor-align-MMGFRUIM.svg") !important;
}
.ql-snow .ql-picker-options {
  padding: 4px 0;
}
.ql-snow .ql-picker-options .ql-picker-item {
  padding: 5px 10px;
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  background-color: rgba(158, 158, 158, 0.2);
  color: inherit;
}
.ql-toolbar.ql-snow {
  font-family: gilroy-medium;
}
.service-plan-terms-and-conditions-editor .ql-toolbar.ql-snow {
  position: sticky;
  top: -32px;
}
.ql-snow .ql-picker {
  color: var(--navy);
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  background-color: rgba(158, 158, 158, 0.2);
  color: var(--black);
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: black !important;
}
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-fill {
  fill: var(--black);
}
@media (max-width: 599px) {
  .auto-width-xs,
  .auto-width-xs .mat-mdc-form-field-infix {
    width: auto !important;
    min-width: auto !important;
  }
  .mat-mdc-button:not(.filter-btn),
  .mat-mdc-icon-button,
  .mat-mdc-outlined-button,
  .mat-mdc-unelevated-button {
    min-width: 34px !important;
  }
  .mat-mdc-button.filter-btn {
    min-width: 34px !important;
  }
  .mat-mdc-select {
    margin-top: 0;
  }
  .reponsive-icon-button {
    height: auto !important;
    line-height: 1 !important;
  }
}
.text-primary-semi-bold {
  color: var(--dark-blue);
  font-family: gilroy-semi-bold;
  font-size: 13px;
  font-weight: unset;
}
strong {
  font-weight: bold !important;
}
.category-selection .mat-form-field-wrapper .mat-form-field-flex .mat-mdc-form-field-infix {
  padding: 6px 0 0 0 !important;
}
.category-selection .mat-form-field-wrapper .mat-form-field-flex .mat-form-field-label-wrapper .mat-form-field-label {
  padding-left: 0 !important;
}
.responsive-search-container .to-hide,
.to-hide,
.responsive-search-container .to-show,
.to-show {
  display: none !important;
}
@media (max-width: 599px) {
  .responsive-search-wrapper {
    position: relative;
  }
  .responsive-search-container .search-input-container,
  .responsive-search-container .to-hide,
  .responsive-search-container .showResponsiveSearch .to-show {
    display: none !important;
  }
  .responsive-search-container .to-show,
  .responsive-search-container .showResponsiveSearch .to-hide {
    display: inline-block !important;
  }
  .responsive-search-container .showResponsiveSearch .search-input-container {
    display: flex !important;
  }
  .responsive-search-container .showResponsiveSearch .search-input-container {
    width: 100%;
  }
  .responsive-search-container .showResponsiveSearch {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #fff;
    left: 0;
    top: 0;
    padding: 0 20px;
    z-index: 2;
  }
  .responsive-items-container .showResponsiveItemsContainer {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #fff;
    left: 0;
    top: 0;
    z-index: 2;
  }
  .page-toolbar .responsive-search-container:not(.p-h-20-search) .showResponsiveSearch,
  .responsive-search-container.p-h-0-search .showResponsiveSearch {
    padding: 0;
  }
  .responsive-search-wrapper .search-items input.input-search {
    min-width: unset;
  }
}
.full-width-search-container .search-input-container {
  width: 100%;
}
.mat-mdc-menu-item.apply-filter.client-btn:hover:not([disabled]) {
  background-color: var(--cool-green);
}
.text-primary {
  color: var(--navy);
  font-family: gilroy-medium;
}
.client-moremenu .mat-mdc-menu-content {
  min-width: 150px;
  padding: 0px !important;
}
.mat-mdc-menu-panel.projects-more-menu .mat-mdc-menu-content,
.mat-mdc-menu-panel .mat-mdc-menu-content {
  padding: 0px !important;
}
.mat-mdc-menu-panel.owner-manager-more-menu .mat-mdc-menu-content {
  padding: 0px !important;
  max-height: 300px !important;
}
.template-width {
  max-width: 286px !important;
}
.mat-mdc-menu-panel.projects-more-menu {
  min-width: 120px;
  min-height: 40px !important;
  height: 42px;
}
.description-column.show-less .description-row * {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
}
.description-column.show-less .description-row ul,
.description-column.show-less .description-row ol {
  display: block;
  padding: 0;
  list-style: none;
  margin: -2px;
}
.description-column.show-less .description-row ul > li,
.description-column.show-less .description-row ol > li {
  display: inline;
  position: relative;
  padding-left: 9px !important;
}
.description-column.show-less .description-row ul > li:after,
.description-column.show-less .description-row ol > li:after {
  content: "";
  width: 4px;
  height: 4px;
  background-color: black;
  border-radius: 50%;
  position: absolute;
  top: 5px;
  left: 2px;
}
.description-column.show-less .description-row br {
  display: none;
}
.display-block {
  display: block !important;
}
.add-btn {
  margin-right: 10px;
  padding-right: 85px !important;
}
.add-btn:after {
  content: "Add to Many";
  font-size: 13px;
  width: 118px;
  top: 13px;
  position: absolute;
}
.dialog-min-editor .ql-container {
  min-height: 200px;
}
.item-create-mode .ql-container {
  min-height: 64px;
}
.item-create-mode.editor-height .ql-container {
  min-height: 132px;
}
.item-create-mode .ql-editor {
  max-height: 300px;
}
.service-plan-terms-and-conditions-editor .ql-container,
.service-plan-terms-and-conditions-editor .ql-editor {
  min-height: 280px;
}
.hide-arrow .ng-arrow-wrapper {
  display: none !important;
}
#importCSV .ng-select .ng-select-container .ng-value-container .ng-placeholder {
  color: var(--navy) !important;
  margin-top: 0;
}
#importCSV .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input,
#divBrandsList .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-input {
  margin-top: -6px;
}
.headerMappingContent .gridContent .ng-select .ng-arrow-wrapper .ng-arrow {
  border-color: var(--cool-green) transparent transparent;
}
.project-phase.ng-select .ng-arrow-wrapper .ng-arrow {
  border-color: var(--cool-green) transparent transparent !important;
  border-width: 8px 6px 1.5px;
}
.project-phase.ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  border-color: transparent transparent var(--cool-green) !important;
  border-width: 1.5px 6px 8px;
}
.project-phase.ng-select.ng-select-single .ng-select-container {
  border: unset !important;
}
.button-with-more > button.mat-mdc-button.blue-button:last-child {
  opacity: 0.8;
}
app-tax-select .ng-option,
.padding-unset {
  padding: unset !important;
}
app-tax-select .ng-option > div {
  padding: 8px 10px;
}
.stretch-image .drop-image-container img {
  object-fit: cover !important;
}
#dtCloudApp .company-information .ng-select.custom-select {
  margin-top: 5px !important;
}
#match-product #addItemPanel .add-items-content1 {
  height: 326px !important;
  max-height: 326px !important;
}
#match-product #addItemPanel {
  min-height: 360px;
}
#match-product {
  position: absolute;
  width: 500px;
}
.manage-integrations .mat-mdc-button.mat-secondary {
  box-shadow: unset !important;
}
.sticky {
  position: sticky !important;
  position: -webkit-sticky !important;
}
table#brands-table > tbody > tr:first-child,
table#product-table > tbody > tr:first-child {
  margin-top: 40px;
}
.skelton-loading {
  position: relative;
  overflow: hidden;
  background-color: var(--light-gray2);
}
.skelton-loading::before {
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 50%;
  z-index: 1;
  width: 500%;
  margin-left: -250%;
  -webkit-animation: loadingAnimation 0.9s linear infinite;
  animation: loadingAnimation 0.9s linear infinite;
  background:
    linear-gradient(
      110deg,
      rgba(255, 255, 255, 0) 46%,
      rgba(255, 255, 255, 0.35) 50%,
      rgba(255, 255, 255, 0) 54%) 50% 50%;
}
.kanban-container {
  display: flex;
  flex-direction: column;
  padding: 20px;
  max-height: calc(100vh - 105px);
}
.kanban-skelton-row {
  display: flex;
  flex-direction: row;
}
.kanban-skelton-filter {
  background-color: var(--light-gray2);
  width: 125px;
  height: 31px;
  margin-right: 15px;
}
.kanban-skelton-search-text {
  background-color: var(--light-gray2);
  width: 262px;
  height: 27px;
}
.kanban-skelton-list-row-1 {
  background-color: var(--light-gray2);
  height: 100px;
  min-height: 125px;
  width: 35%;
  margin-top: 15px;
  margin-right: 15px;
}
.kanban-skelton-list-row-2 {
  background-color: var(--light-gray2);
  height: 60px;
  display: flex;
  margin-top: 15px;
}
.kanban-skelton-list-row-2 {
  background-color: var(--light-gray2);
  height: 100px;
  min-height: 300px;
  width: 71.5%;
  margin-top: 15px;
  margin-right: 15px;
}
.kanban-skelton-list-row-3 {
  background-color: var(--light-gray2);
  height: 100px;
  min-height: 500px;
  width: 35%;
  margin-top: 15px;
  margin-right: 15px;
}
.more-menu-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}
.position-relative {
  position: relative;
}
.ng-star-inserted #importCSV ul > li::before {
  content: "";
}
.installer {
  background-color: var(--white);
  max-height: calc(100vh - 74px);
}
.installer .header,
.installer-tasks .header {
  padding: 5px 5px 5px 20px;
  background-color: #eef0f1;
  border-bottom: 1px solid var(--light-gray2);
  color: var(--medium-gray);
  font-family: gilroy-semi-bold;
}
.installer .today-schedule {
  margin: 10px 0;
}
.installer .today-schedule .phase-div .box,
.phase-div .box {
  border: 1px solid var(--silver);
  border-radius: 3px;
  padding: 5px;
  margin-right: 5px;
  max-height: 28px;
}
.installer .today-schedule .phase-div .box .color-indicator,
.phase-div .box .color-indicator {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background-color: var(--blue);
  margin: 2px 7px 2px 2px;
}
.installer .today-schedule mat-list.project,
.installer .mat-mdc-list-base,
.installer-tasks .mat-mdc-list-base {
  background-color: var(--white);
  padding: 0;
}
.installer .mob-primary {
  min-height: 28px;
  margin: 10px 0;
}
.installer .mat-mdc-list-base .mat-mdc-list-item,
.installer .mat-mdc-list-base .mat-list-option,
.installer-tasks .mat-mdc-list-base .mat-list-item {
  border-left: 5px solid transparent;
  height: 80px;
  cursor: pointer;
  line-height: 80px;
}
.installer .mat-mdc-list-base .mat-mdc-list-item p.name,
.installer .mat-mdc-list-base .mat-list-option p.name,
.installer-tasks .mat-mdc-list-base .mat-list-item p.name {
  color: var(--navy);
  font-size: 14px;
  font-family: gilroy-medium;
}
.installer .mat-mdc-list-base .mat-mdc-list-item p.detail,
.installer .mat-mdc-list-base .mat-list-option p.detail,
.installer-tasks .mat-mdc-list-base .mat-list-item p.detail {
  color: var(--medium-gray);
  font-size: 15px;
  font-family: gilroy-medium;
  padding-top: 6px;
}
.installer app-resource-avatars div {
  float: right;
}
.installer #txt-app-search {
  width: 325px !important;
}
.installer-check-in {
  margin: 0 20px 20px 20px;
  border-radius: 8px;
  min-width: 90vw !important;
}
.mat-mdc-form-field-infix .mat-mdc-input-element.date-textbox-style {
  border: none !important;
  box-shadow: none !important;
  height: 24px;
  margin-top: 0px;
  font-family: gilroy-medium;
  font-size: 13px;
  color: #7e8a96 !important;
  max-width: 70px !important;
  padding: 0px !important;
}
.quote-location-auto .mat-option-text {
  white-space: nowrap !important;
}
#planningOverview .mat-card-header-text {
  margin: 12px;
}
#dtCloudApp #planningOverview .mat-mdc-card-title {
  color: var(--color-text-primary);
  font-family: gilroy-medium;
  font-size: 15px;
  line-height: 18px;
}
@media screen and (max-width: 1080px) {
  .wizard-btn-primary {
    margin-right: 70px;
  }
}
app-upload-file.attachments-content.project-attachment .img-upload {
  min-height: 158px !important;
}
.subscription-card {
  width: 326px;
  height: 475px;
  margin: 10px;
  border: 1px solid #e8e9ea;
  padding: 10px;
  transition: transform 1.1s;
}
mat-card.subscription-card mat-card-title {
  font-size: 26px !important;
  line-height: 32px;
  font-family: gilroy-semi-bold;
}
mat-card.subscription-card mat-card-title,
mat-card.subscription-card mat-card-subtitle {
  font-family: gilroy-bold;
  text-align: center;
  color: #1d2836;
}
mat-card.subscription-card .mat-mdc-card-header .mat-mdc-card-header-text,
mat-card.account-managements .mat-mdc-card-header .mat-mdc-card-header-text {
  width: 100% !important;
}
mat-card.subscription-card mat-card-header .note {
  font-family: gilroy-light-italic;
  font-size: 12px;
  text-align: center;
  color: var(--medium-gray);
  display: block;
}
mat-card.subscription-card ul {
  font-family: gilroy-medium;
  font-size: 16px;
  color: var(--color-text-primary);
  height: 245px;
  padding: 40px 15px 15px 15px;
}
mat-card.subscription-card ul li,
mat-card.summary-card ul li {
  line-height: 26px;
  list-style: none;
}
mat-card.subscription-card ul li::before,
mat-card.summary-card ul li::before {
  content: "\2022";
  color: var(--cool-green);
  font-weight: bold;
  font-size: 35px;
  display: inline-block;
  width: 1.4em;
  margin: 0;
  position: absolute;
}
mat-card.subscription-card .mat-checkbox,
mat-card .mat-checkbox label {
  color: var(--cool-green);
  font-family: gilroy-medium;
  font-size: 16px;
}
mat-card.payment-card .mat-checkbox label {
  font-size: 13px !important;
  color: var(--navy) !important;
}
.mat-mdc-card-header {
  padding: 12px !important;
  justify-content: space-between;
}
mat-card.subscription-card .mat-mdc-card-header .mat-card-header-text {
  width: 100%;
}
.custom-checkbox {
  width: 149px;
  height: 24px;
  border-radius: 4px;
}
.custom-checkbox input#status {
  display: none;
}
.custom-checkbox input#status + label {
  height: 100%;
  width: 100%;
}
.custom-checkbox input#status + label > .status-switch {
  cursor: pointer;
  width: 100%;
  height: 100%;
  position: relative;
  font-size: 13px;
  font-family: gilroy-regular;
  transition: all 0.5s ease;
  border-radius: 4px;
}
.custom-checkbox input#status + label > .status-switch:before,
.custom-checkbox input#status + label > .status-switch:after {
  height: 87%;
  width: 50%;
  display: flex;
  align-items: center;
  position: absolute;
  justify-content: center;
  transition: all 0.3s ease;
  top: 0;
}
.custom-checkbox input#status + label > .status-switch:before {
  background-color: var(--white);
  content: attr(data-checked);
  color: var(--color-text-primary);
  border-radius: 4px;
  border: 2px solid var(--light-gray2);
}
.custom-checkbox input#status + label > .status-switch:after {
  right: 0;
  content: attr(data-unchecked);
  background-color: var(--green-blue);
  box-shadow: 0px 1px 4px rgba(13, 187, 125, 0.25);
  color: var(--white);
  border-radius: 4px;
  border: 2px solid var(--cool-green);
}
.custom-checkbox input#status:checked + label > .status-switch {
}
.disabled-mode .custom-checkbox input#status:checked + label > .status-switch,
.disabled-mode .custom-checkbox input#status + label > .status-switch:before {
  background-color: var(--cool-grey);
  color: var(--white);
}
.disabled-mode .custom-checkbox input#status + label > .status-switch:after {
  color: var(--cool-grey);
}
.custom-checkbox input#status:checked + label > .status-switch:after {
  left: 0;
  content: attr(data-checked);
}
.custom-checkbox input#status:checked + label > .status-switch:before {
  right: 0;
  content: attr(data-unchecked);
}
.account-management-card-small {
  width: 450px;
  min-height: 150px;
  color: #1d2836;
  margin: 30px 10px;
  display: block;
}
.account-management-card-small .account-management-header {
  font-family: gilroy-semi-bold;
  font-size: 14px !important;
}
.account-management-card-small mat-card-content {
  padding: 15px;
  font-family: gilroy-semi-bold;
  font-size: 16px !important;
  display: block;
}
.account-management-card-small mat-card-content .number {
  font-size: 24px;
  padding: 3px;
}
.account-management-card-small .add-on-row {
  display: block;
  font-size: 16px;
  font-family: gilroy-semi-bold;
  line-height: 40px;
}
mat-datepicker-content .time-container1:before {
  font-family: gilroy-medium;
  content: "";
  position: relative !important;
  opacity: 0.7;
  background-image: url("./media/stopwatch-HWVPFMXN.svg");
  width: 26px;
  height: 26px !important;
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
  background-color: var(--silver) !important;
  align-self: center;
  margin-right: 8px;
  font-size: 12px;
}
.mat-datepicker-content .time-container1:after {
  display: none;
}
.mat-datepicker-content .time-container1 {
  height: unset;
  border: unset;
  box-shadow: unset;
  padding: 5px 10px;
  margin: 0;
  line-height: unset;
  border-top: 1px solid var(--silver);
  justify-content: start !important;
}
.datepicker-prefix-icon {
  position: absolute;
  left: 0;
}
.price-container,
.time-container1 {
  box-sizing: border-box;
  height: 33px;
  border: 1px solid var(--silver);
  border-radius: 2px;
  box-shadow: inset 0 1px 4px 0 rgba(0, 0, 0, 0.06);
  padding: 0 10px;
  font: unset;
  font-size: 13px;
  font-family: gilroy-medium;
  color: var(--navy);
  line-height: 33px;
  padding-left: 6px;
  position: relative;
  margin: 3px 0;
  cursor: pointer;
}
.time-container1 {
  padding-left: 37px;
  font-size: 15px;
}
.price-container.disabled,
.time-container1.disabled {
  background-color: rgba(0, 0, 0, 0.06);
  pointer-events: none;
}
.time-container1:after {
  font-family: gilroy-medium;
  content: "";
  position: absolute;
  left: -1px;
  top: 0px;
  color: #1d2836;
  font-size: 14px;
  opacity: 0.7;
  background-image: url("./media/stopwatch-HWVPFMXN.svg");
  width: 34px;
  height: 31px;
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
}
.total {
  font-family: gilroy-semi-bold;
  font-size: 36px;
  line-height: 43px;
  color: #1d2836;
}
.paynow-box {
  width: 450px;
  margin: 15px 10px;
}
.paynow-box .unorder-list {
  padding: 0px;
}
.paynow-box .unorder-list .input-wrapper {
  width: 160px;
}
.paynow-box .unorder-list .list-item {
  padding: 5px !important;
}
.add-circle {
  border-radius: 50%;
  text-align: center;
  height: 20px;
  width: 20px;
  background-color: #f3f4f5;
  border: 1px solid rgba(163, 166, 170, 0.67);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.09);
  color: #03a068;
  display: inline-grid;
}
.add-circle-icon,
.remove-circle-icon {
  font-size: 15px;
  margin-top: 2px;
  font-weight: 600;
}
.remove-circle {
  border-radius: 50%;
  text-align: center;
  height: 20px;
  width: 20px;
  margin-left: 0;
  background-color: #f3f4f5;
  border: 1px solid rgba(163, 166, 170, 0.67);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.09);
  color: #03a068;
  display: inline-grid;
}
.remove-circle.disabled {
  color: var(--medium-gray);
}
.remove-circle.disabled:active {
  pointer-events: none;
}
.full-page-dialog,
.full-height {
  height: 100vh;
  width: 100vw;
}
.user-filter {
  max-width: 92px;
}
.user-filter .mat-mdc-form-field-infix {
  border: 0;
}
.user-filter,
.user-filter .mat-form-field-wrapper,
.user-filter .mat-mdc-form-field-infix,
.user-filter .mat-form-field-wrapper .mat-form-field-appearance-standard .mat-form-field-flex,
.user-filter .mat-form-field-flex {
  padding: 0 !important;
}
.user-filter .mat-mdc-select {
  margin: 0;
}
.ppe-container .mat-drawer-content {
  padding: 24px;
}
.ppe-container .project-dashboard-container .mat-drawer-content {
  padding: 0px;
}
@media (max-width: 1024px) {
  .ppe-container .mat-drawer-content {
    padding: 16px;
  }
}
.ppe-container h2.primary-header {
  margin-top: 0;
  margin-bottom: 0;
  line-height: 29px;
}
.ppe-container app-activity-list > div {
  padding: 0 !important;
}
.ppe-container .ppe-toolbar {
  margin-bottom: 32px;
}
.ppe-container .ppe-toolbar > *:not(:last-child) {
  margin-right: 16px !important;
}
.ppe-toolbar .mat-form-field-appearance-standard .mat-form-field-flex {
  padding: 0;
}
.ppe-toolbar .mat-mdc-form-field-infix {
  padding: 0;
  border: unset;
}
.ppe-filters {
  margin-bottom: 32px;
  margin-top: -16px;
}
.non-installer-notif {
  max-width: 370px;
  min-width: 370px;
}
@media (max-width: 599px) {
  .installer-notif {
    width: 100%;
  }
}
.ppe-container .widget-ndb {
  padding-left: 0 !important;
}
.ppe-container .widget-ndb > :last-child {
  padding-left: 15px;
}
.ppe-container .filter-container {
  padding: 12px 8px;
}
.ppe-container .filter-container.ppt {
  padding: 8px 0px;
}
.ppe-container .filter-applied .ppe-toolbar {
  margin-bottom: 0;
}
.project-activity-task-list .widget-ndb > :last-child {
  padding-left: 0px;
}
.taskDueDate .mat-form-field-wrapper {
  padding: 0px;
}
.taskDueDate .mat-mdc-form-field-infix {
  padding: 0px;
  border: 0px;
}
.taskDueDate.mat-form-field-appearance-standard .mat-form-field-flex {
  padding-top: 0px;
}
ng-select.ng-select.custom-select2.group-xs.ng-select-single .ng-value-container {
  padding-left: 0px;
}
#dtCloudApp .ng-select.group-section.group-xs .ng-select-container {
  font-size: 13px !important;
  font-family: gilroy-semi-bold;
}
app-upload-file.attachments-content.project-attachment .img-upload {
  margin: 0px;
}
.task-overview-header.dt-dialog-toolbar {
  min-height: 128px;
  max-height: 128px;
  height: 128px;
}
.color-picker .preset-area .preset-color {
  border: 1px solid #a9a9a9;
  border-radius: 50% !important;
  cursor: pointer;
  display: inline-block;
  height: 24px !important;
  margin: 4px 6px 8px;
  position: relative;
  width: 24px !important;
}
ul.remove-bullets {
  min-height: 20px;
  padding: 0 !important;
}
ul.remove-bullets li {
  padding: 0 !important;
}
ul.remove-bullets li::before {
  content: "" !important;
  margin: 0 !important;
}
.group-section.ng-select .ng-select-container .ng-value-container {
  padding-left: 5px !important;
}
.installer-resource.ng-select .ng-select-container .ng-value-container {
  padding-left: 0px !important;
  padding-top: 10px !important;
}
.installer-resource.ng-select .ng-arrow-wrapper {
  padding-top: 10px !important;
}
.project-task,
.project-task .search-input-container {
  width: 100%;
  padding-right: 30px;
}
.installer-header {
  position: relative;
  top: 50px;
}
.xs-label {
  font-family: gilroy-semi-bold;
  font-size: 16px;
}
.qb-integration.mat-mdc-menu-item:hover:not([disabled]) {
  background-color: unset !important;
  cursor: unset !important;
}
.item-status-text {
  font-family: gilroy-bold;
  font-size: 11px;
  color: white;
}
.mat-card-title2 {
  padding: 8px 16px;
  min-height: 48px;
  max-height: 64px;
}
#dtCloudApp .mat-mdc-card-content.mat-card-content2 {
  padding: 16px;
}
app-selection-manager.client-table.table-container {
  border: unset;
}
.client-table .dt-table .dt-row .dt-cell {
  border-bottom: unset;
}
.vertical-divider {
  box-sizing: border-box;
  height: 24px;
  width: 3px;
  border-top: 0;
  border-right-width: 1px;
  border-right-style: solid;
  border-right-color: var(--silver);
}
app-upload-file.project-task-upload2 .img-upload {
  max-width: 100%;
  min-width: 640px;
  max-height: 65px;
  min-height: 65px;
  height: 65px;
  width: 100%;
}
.total-due .loading-progressor {
  margin: 35px 0 !important;
}
.promo-code-section .mat-form-field-flex,
.promo-code-section .mat-form-field-flex .mat-mdc-form-field-infix,
.promo-code-section .mat-form-field-appearance-standard .mat-form-field-flex {
  padding: 0;
  border: 0;
}
.active-status {
  color: var(--cool-green);
  font-size: 18px;
  margin-right: 8px;
}
.group-container .ng-select.ng-select-disabled .ng-arrow-wrapper .ng-arrow {
  display: none !important;
}
.unit-price-zero {
  margin-bottom: 15px;
  color: var(--white);
  background-color: var(--red);
  font-family: gilroy-semi-bold;
  padding: 4px 8px;
  border-radius: 2px;
  font-size: 12px;
}
.price-sufix-top-hrs:after {
  font-family: gilroy-medium;
  content: "hrs";
  position: absolute;
  right: 8px;
  top: 35px;
  color: #1d2836;
  font-size: 14px;
  opacity: 1;
}
.price-sufix-top-hr:after {
  font-family: gilroy-medium;
  content: "hrs";
  position: absolute;
  right: 8px;
  top: 35px;
  color: #1d2836;
  font-size: 14px;
  opacity: 1;
}
.company-information div.address-hover {
  padding: 15px 0 !important;
}
.price-summary {
  background-color: var(--medium-gray);
  border-radius: 4px;
  height: 60px;
  padding: 0 10px;
  color: var(--white);
}
.price-summary .label {
  font-family: gilroy-bold;
  font-size: 16px;
}
.price-summary .price {
  font-family: gilroy-medium;
  font-size: 13px;
}
.content-width {
  width: 1%;
  white-space: nowrap;
}
.wordwrap {
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  word-wrap: break-word;
}
.coverage-color {
  height: 10px;
  width: 100%;
  border-radius: 3px;
  cursor: pointer;
  border: 1px solid #b3b6b9;
}
.ppe-container.product-status-change .mat-drawer-content {
  padding-bottom: 0px !important;
}
.pac-container {
  font-family: gilroy-medium;
}
.max-height-100 {
  max-height: 100vh !important;
}
.sticky-done-btn {
  text-align: end;
  position: sticky;
  position: -webkit-sticky;
  bottom: 5px;
  z-index: 2;
}
.zoom-visual.active #Search-icon-Copy {
  stroke: #fff !important;
}
.zoom-visual.active span {
  color: #fff !important;
}
.opp-forecated-report .mat-sort-header-container {
  padding-top: 10px;
}
.add-schedule-container .mat-form-field-appearance-standard .mat-form-field-flex {
  padding-bottom: 0px;
  padding-top: 0px;
}
.add-schedule-container .mat-form-field-wrapper {
  padding-bottom: 0px;
  padding-top: 0px;
}
.add-schedule-container .date-section .mat-mdc-form-field-infix {
  width: auto;
}
.add-schedule-container .mat-select-trigger {
  height: 24px;
  line-height: 24px;
}
.add-schedule-container .date-section .mat-mdc-select .mat-select-value-text {
  color: var(--cool-green);
}
.date-section .mat-mdc-form-field-icon-prefix {
  position: relative;
  top: 5px;
  left: 0;
}
.date-section.share-proposal .mat-mdc-form-field-icon-prefix {
  top: 0;
}
.date-section .mat-mdc-form-field-infix {
  padding-bottom: 0 !important;
  min-height: 24px !important;
}
.placeholder-green .mat-select-placeholder {
  color: var(--green-blue) !important;
}
.placeholder-black .mat-select-placeholder {
  color: var(--color-text-primary) !important;
}
.add-schedule-container .custom-toggle .mat-slide-toggle-bar {
  background-image: none;
}
.schedule-add-view {
  position: absolute;
  top: 0px;
  width: 331px;
  left: -431px;
  max-width: 331px;
  transition: left 0.3s;
  background-color: white;
  overflow: hidden;
  overflow-y: auto;
  z-index: 2;
  box-shadow: 0 6px 9px 0 rgba(0, 0, 0, 0.25);
  overflow: hidden;
}
.schedule-add-view .add-schedule-container {
  position: relative;
  overflow: auto;
  max-height: calc(100vh - 127px);
}
.schedule-add-view.visible {
  left: 10px;
}
.mat-drawer.schedule-drawer {
  background-color: var(--white);
  border-radius: 4px;
  box-shadow: 0px 6px 9px rgba(0, 0, 0, 0.25) !important;
  width: 355px;
}
.mat-drawer.checklist-drawer,
.mat-drawer.checklist-history-drawer {
  background-color: #ffffff;
  box-shadow: 2px 0px 24px 0px rgba(14, 31, 56, 0.24) !important;
  width: 480px;
  z-index: 10;
}
.schedule-header {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  height: 48px;
  max-height: 48px;
  padding: 0 16px;
  place-content: center flex-start;
}
.schedule-header label {
  font-size: 16px;
  letter-spacing: unset;
}
.schedule-content {
  align-items: flex-start;
  box-sizing: border-box;
  flex-direction: column;
  padding: 10px 16px;
  place-content: flex-start center;
}
.schedule-label-color {
  border-radius: 50%;
  cursor: pointer;
  display: inline-block;
  height: 24px;
  margin-right: 10px;
  width: 24px;
}
.schedule-label-color.select-icon {
  align-items: center;
  display: flex;
  justify-content: center;
}
.bottom-sheet-toolbar {
  height: 58px;
  padding: 0 16px;
  border-bottom: 1px solid var(--light-gray2);
  font-size: 20px;
  color: var(--navy);
}
.bottom-sheet-content {
  max-height: calc(80vh - 58px);
  overflow: auto;
  padding: 16px;
}
.bottom-sheet-servicall-content {
  max-height: calc(80vh - 126px);
  overflow: auto;
  padding: 16px;
}
.bottom-sheet-projectTask-client {
  height: 60vh;
  overflow: auto;
  padding: 16px;
}
.installer-profile-content {
  height: calc(80vh - 122px);
  overflow: auto;
  padding: 16px;
}
.mobile-top-divider {
  background: var(--medium-gray);
  border-radius: 10px;
  width: 40px;
  height: 4px;
  position: absolute;
  top: 5px;
  right: 0;
  left: 0;
  margin: auto;
}
.mat-bottom-sheet-container.notification-menu {
  margin: 0;
  padding: 0;
  border-radius: 20px 20px 0px 0px;
  width: 100vw;
}
.whiteBackDrop {
  background-color: white !important;
  opacity: 1 !important;
}
.user-remaining {
  color: var(--blue);
  font-family: Gilroy-bold;
  font-size: 10px;
  letter-spacing: 0;
  line-height: 12px;
  text-align: center;
  padding: 6px;
}
.mat-mdc-slide-toggle.taxable-toggle .mat-slide-toggle-ripple {
  height: auto;
}
.mat-mdc-slide-toggle .mat-slide-toggle-ripple {
  display: none !important;
}
.configure-btn {
  margin-left: 10px !important;
}
.remove-border .mat-mdc-card {
  border: none !important;
  box-shadow: none !important;
}
.pack-detail-price-sec .mat-mdc-card {
  margin-bottom: 20px;
}
.discount-tooltip {
  line-height: 24px;
  font-size: 12px;
  white-space: pre-line !important;
  line-break: strict;
  text-align: right;
}
.discount-tooltip .mdc-tooltip__surface {
  max-width: 300px;
  text-align: right !important;
}
.multiline-tooltip {
  line-height: 21px;
  font-size: 12px;
  white-space: pre-line !important;
  line-break: strict;
  text-align: center;
  font-family: Gilroy-semi-bold;
}
.l-0 {
  left: 0 !important;
}
.r-0 {
  right: 0 !important;
}
.r-2 {
  right: 2px !important;
}
@media only screen and (min-width: 600px) {
  .hide-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}
.ignore-item-labor-items .mat-slide-toggle-label::before {
  content: "Use associated labor for all products and allowances in this package" !important;
  white-space: break-spaces;
  line-height: 15px;
  height: 50px;
  margin: 15px 15px 0 0;
  font-size: 13px;
  font-family: "gilroy-medium";
}
.sidenav-logo {
  margin: 18px auto 0 auto;
}
.sidenav-logo .default-logo {
  height: 56px;
  width: 56px;
}
.side-nav-container.appsidenav-collapsed .sidenav-logo {
  height: 28px;
  min-height: 28px;
  width: 28px;
}
.bottom-nav-menu .nav-menu-text {
  display: inline-block;
  padding-left: 12px;
  position: relative;
}
.bottom-nav-menu:hover,
.bottom-nav-menu.active {
  background: var(--light-gray2);
  color: var(--navy);
}
ul.inline-list:not(.ql-mention-list) {
  padding-left: 0;
}
ul.inline-list li {
  display: inline-flex;
}
.inline-block {
  display: inline-block;
}
.dot4-4 {
  height: 4px;
  width: 4px;
  border: 1px solid;
  border-radius: 50%;
  background-color: var(--gray1);
  border-color: var(--gray1);
  margin: 3px 6px;
  display: inline-block;
}
.reload-tooltip {
  margin-top: 25px !important;
}
.mat-calendar-body-cell {
  position: absolute !important;
  height: 100% !important;
}
ngx-mat-datetime-content .mat-calendar-body-cell {
  position: relative !important;
  height: 0 !important;
  line-height: 0 !important;
}
#AddItemToMany .add-to-many {
  position: fixed;
  display: flex;
  flex-direction: column !important;
  top: 145px;
  width: auto;
  min-width: 335px;
  right: 0;
  max-width: 335px;
  height: calc(100vh - 155px);
  background-color: white;
  overflow: hidden;
  overflow-y: auto;
  z-index: 65;
  box-shadow: 0 6px 9px 0 rgba(0, 0, 0, 0.25);
}
.add-items-side-content {
  font-size: 13px;
}
.add-items-side-content .mat-mdc-checkbox label {
  color: var(--navy) !important;
  font-family: gilroy-medium;
  font-size: 13px !important;
}
.r-l-slide {
  position: absolute;
  right: 320px;
  transition: 2s;
}
.brand-supplier-select .supplier-select-container .supplier-select .ng-dropdown-panel {
  left: -50px !important;
}
.product-supplier-select .supplier-select-container .supplier-select .ng-dropdown-panel {
  left: -76px !important;
}
.add-items-side-content .acronym {
  background-color: var(--light-gray2);
  padding: 40px;
}
.input-prefix,
.input-suffix {
  position: absolute;
  bottom: 19px;
  opacity: 0.5;
}
.padding-less .input-prefix,
.padding-less .input-suffix {
  bottom: 9px;
}
.subscription-detail .padding-less .input-prefix,
.subscription-detail .padding-less .input-suffix {
  bottom: 10.5px;
}
.input-prefix {
  left: 7px;
}
.input-suffix {
  right: 7px;
}
.currency-symb-border {
  position: absolute;
  width: 34px;
  height: 34px;
  text-align: center;
  justify-content: center;
  left: 1px;
  background-color: var(--silver);
  padding: 7px 12px !important;
  top: 1px !important;
  opacity: 0.7;
}
.fr-CA .currency-symb-border {
  padding: 9px 10px !important;
}
.fr-CA .padding-less .currency-symb-border {
  padding-top: 8px !important;
}
.currency-symb-box {
  position: absolute;
  opacity: 0.7;
  transform: scale(1);
  left: 13px;
  top: 6px;
}
#sidenav .mat-drawer-inner-container::-webkit-scrollbar-track {
  border-radius: 3px;
  background-color: transparent;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}
#sidenav .mat-drawer-inner-container::-webkit-scrollbar {
  width: 5px;
  background-color: transparent;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}
#sidenav .mat-drawer-inner-container::-webkit-scrollbar-thumb {
  background-color: transparent;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}
#sidenav .mat-drawer-inner-container:hover::-webkit-scrollbar-thumb {
  background-color: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
}
* ::-webkit-scrollbar {
  background-color: transparent;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
  width: 10px;
  height: 11px;
}
.kanban-list-scroll {
  max-height: calc(100vh - 200px);
  overflow-y: scroll !important;
  overflow-x: scroll !important;
  scrollbar-gutter: stable both-edges;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.1);
}
.kanban-list-scroll::-webkit-scrollbar {
  background-color: transparent;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
  width: 10px;
  height: 11px;
}
.kanban-list-scroll::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 4px;
}
.kanban-list-scroll::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.1);
}
.navBarScroll ::-webkit-scrollbar {
  background-color: transparent;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
  width: 0px !important;
  height: 11px;
}
*::-webkit-scrollbar-thumb {
  background-color: transparent;
  opacity: 0.2;
  -webkit-transition: background-color 2s ease-out;
  -moz-transition: background-color 2s ease-out;
  -o-transition: background-color 2s ease-out;
  transition: background-color 2s ease-out;
}
*:hover::-webkit-scrollbar-thumb {
  background-color: transparent;
  box-shadow: inset 0 0 6px 1px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 1px 6px 1px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: inset 1px 1px 6px 1px rgba(0, 0, 0, 0.4);
  border-radius: 5px;
}
.navBarScroll :hover::-webkit-scrollbar-thumb {
  background-color: transparent;
  box-shadow: unset !important;
  -webkit-box-shadow: unset !important;
  -moz-box-shadow: unset !important;
  border-radius: unset !important;
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items {
  overflow-y: scroll !important;
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar {
  width: 8px;
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-track {
  background: #f1f1f1;
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 4px;
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.5);
}
::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.3) #f1f1f1;
}
.silver-border {
  border: 1px solid var(--silver);
}
.mat-slide-toggle-content {
  color: var(--navy);
  font-family: gilroy-medium;
  font-size: 13px;
}
app-text-editor quill-editor iframe {
  pointer-events: none;
}
.font-24 {
  font-size: 24px;
}
.hide-spin-button input::-webkit-outer-spin-button,
.hide-spin-button input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.hide-spin-button input[type=number] {
  -moz-appearance: textfield;
}
.text-security-disc input {
  font-family: text-security-disc !important;
  -webkit-text-security: disc;
}
.icon-strike {
  position: relative;
}
.icon-strike:after {
  content: "";
  border-left: 2px solid #5f6874;
  transform: rotate(226deg);
  position: absolute;
  z-index: 25;
  left: 9px;
  top: -1px;
  height: 21px;
}
.drawer-eyeIcon.icon-strike:after {
  top: -4px;
}
.drawing .item-preview .image-drop-container {
  min-height: 120px !important;
  height: 120px !important;
}
.discount-tooltip-currency-symbol {
  background: var(--green-blue);
  color: white;
  position: absolute;
  left: 8.1px;
  top: 6.3px;
  transform: scale(0.8);
  line-height: 11px;
}
#app-nav-ready-to-be-ordered {
  height: 32px !important;
}
.mat-tab-body-content {
  overflow: unset !important;
}
.label-header-size {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 150px !important;
}
.contract-service-plan .price-box {
  top: 16px !important;
}
.ng-select.toto-list-select {
  width: fit-content;
}
.ng-select.toto-list-select .ng-select-container .ng-value-container {
  padding-left: 0;
}
.color-icon {
  padding: 6px;
  border-radius: 50%;
  width: 5px;
  height: 5px;
}
.color-icon-24 {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.name-form-field .mat-form-field-wrapper {
  padding-bottom: 0 !important;
}
.expand-collapse-container {
  background: var(--white);
  border: 1px solid var(--light-gray2);
  border-radius: 4px;
  cursor: pointer;
  box-sizing: border-box;
  display: flex;
  place-content: center space-between;
  align-items: center;
  height: 32px;
  justify-content: center;
  flex-direction: row;
  background: var(--white);
}
.expand-collapse-container .expand-icon-container,
.expand-collapse-container .collapse-icon-container {
  padding: 8px;
}
.expand-collapse-container .expand-icon-container:hover,
.expand-collapse-container .collapse-icon-container:hover {
  background-color: var(--light-gray2);
}
.expand-collapse-container .mat-divider {
  height: 100%;
}
.optional-item .group-item.color {
  color: var(--gray1) !important;
}
.paginator-1 {
  position: fixed;
  bottom: 0;
  background-color: var(--white);
  width: -webkit-fill-available;
}
.paginator-2 {
  position: fixed;
  bottom: 0;
  background-color: var(--white);
  width: -webkit-fill-available;
  height: 7%;
  z-index: 100;
}
.merge-fields-container {
  background-color: var(--light-gray2);
  border-radius: 2px;
  padding: 8px 4px;
  font-size: 10px;
  font-family: "gilroy-light";
  color: var(--medium-gray);
  max-width: 150px;
  text-align: center;
}
app-service-plan-item-edit app-text-editor .ql-editor p {
  display: inline-block;
}
app-service-plan-item-edit app-text-editor .mention {
  background-color: rgb(111 119 130 / 8%) !important;
  border-radius: 4px !important;
  padding: 4px 2px !important;
  color: var(--blue) !important;
  font-family: "gilroy-bold" !important;
  margin-bottom: 8px !important;
  font-size: 13px !important;
}
.merge-field-chip {
  background-color: rgb(111 119 130 / 8%);
  border-radius: 4px;
  padding: 4px 2px;
  color: var(--blue);
  font-family: "gilroy-bold";
  margin-bottom: 8px;
  font-size: 13px;
  position: relative;
  cursor: move;
}
.merge-field-chip.added-chip {
  cursor: default;
  width: fit-content;
}
.add-merge-field {
  position: absolute;
  font-size: 12px;
  cursor: pointer;
  color: var(--green-blue2);
  padding: 2px;
  top: -8px;
  right: -4px;
}
.items-update-container {
  position: relative;
}
.items-update-container .navy,
.items-update-container .succeed-icon {
  opacity: 1;
}
.items-update-container:hover .navy {
  opacity: 0.6;
}
.items-update-container .succeed-icon {
  position: absolute;
  width: 17px;
  top: -17px;
  right: -8px;
}
.service-plan-more-menu-height {
  height: unset !important;
  line-height: 16px !important;
  margin-left: 8px;
}
.mail-subject [contenteditable=true].ql-editor {
  padding: 8px 15px;
  width: 100%;
  display: inline-flex;
  flex-wrap: wrap;
}
.preview-subject .ql-mention-denotation-char {
  display: none;
}
.client-detail {
  max-height: calc(100vh - 132px) !important;
  width: 100vw;
}
[data-value^="@"] .ql-mention-denotation-char {
  display: none !important;
}
.green-background {
  background-color: var(--cool-green) !important;
}
.people-client-notes quill-editor {
  border: 1px solid var(--silver) !important;
  border-radius: 2px;
}
.people-client-notes .note-create-action-container {
  flex-direction: row-reverse !important;
  margin-top: 16px;
}
.people-client-notes .mat-mdc-button.mat-secondary {
  margin-right: 10px !important;
}
.people-client-notes .text-length-container {
  display: none;
}
.people-client-notes .widget-title-ndb {
  height: 180px;
  display: flex;
  flex-flow: column-reverse;
}
.client-filter-container {
  z-index: 1;
  position: relative;
  padding-top: 10px;
}
.filter-container-activity {
  flex-direction: row;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 12px 8px;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.08) 100%),
    var(--white);
  box-shadow: 0px 2px 4px rgb(1 22 47 / 16%), inset 0px 1px 4px rgb(1 22 47 / 8%);
  padding: 2px 0px 2px 0;
}
.menu-item-header {
  color: var(--medium-gray);
  font-style: italic;
  padding: 8px 16px;
  display: inline-block;
}
.supplier-real-time-pricing {
  height: 40px;
  width: 150px;
  border-radius: 4px;
  text-align: center;
  justify-content: center;
  padding: 8px 16px;
  flex-direction: column;
  display: flex;
  background-color: var(--blue);
  color: var(--white);
}
.supplier-price-updatedon > * {
  color: var(--cool-green);
  font-family: gilroy-semi-bold;
  font-size: 14px;
}
.supplier-product-updatedon > * {
  color: var(--blue);
  font-family: gilroy-semi-bold;
  font-size: 14px;
}
.supplier-price-updatedon > *:nth-child(2),
.supplier-product-updatedon > *:nth-child(2) {
  font-size: 12px;
}
#dtCloudApp .mdc-text-field .mdc-text-field__input {
  caret-color: var(--navy);
}
.mdc-text-field--filled:not(.mdc-text-field--disabled),
.mat-mdc-form-field-focus-overlay,
.mdc-text-field,
.mdc-text-field.mdc-text-field--filled {
  background-color: transparent !important;
  padding: 0;
  overflow: unset;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  padding: 8px;
  border: 1px solid var(--silver2);
  box-shadow: inset 0px 1px 4px rgba(0, 0, 0, 0.0626698);
  border-radius: 2px;
  max-width: 100%;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(#txtArea) {
  height: 36px !important;
}
#dtCloudApp .opp-input-hig-24.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(#txtArea) {
  height: 24px !important;
}
#dtCloudApp .wirepath-details .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  height: 20px;
  border: 0px;
  box-shadow: none;
  border-radius: 0px;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.checklist-input,
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.checklist-input-hover:hover {
  padding: 8px;
  border: 1px solid var(--silver) !important;
  border-radius: 2px;
  height: 33px;
  max-width: 100%;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.todoDateInputwidth {
  max-width: 95% !important;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.todoLabel {
  margin-top: 5px;
}
#dtCloudApp .recipient-input .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  border: unset !important;
  box-shadow: unset !important;
}
#dtCloudApp .recipient-input.recipient-input-no-hover-border .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control,
#dtCloudApp .recipient-input.recipient-input-no-hover-border .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:hover,
#dtCloudApp .recipient-input.recipient-input-no-hover-border .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:focus,
#dtCloudApp .recipient-input.recipient-input-no-hover-border .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:active,
#dtCloudApp .recipient-input.recipient-input-no-hover-border .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.border-color {
  border: unset !important;
  box-shadow: unset !important;
  background-color: transparent !important;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container app-contacts-integration {
  position: unset;
  flex: 1 1 180px;
  display: flex;
  align-items: center;
  align-self: center;
  min-width: 150px;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-form-field,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-form-field,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-text-field-wrapper,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-form-field-flex,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-form-field-infix,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-form-field-infix {
  display: flex;
  align-items: center;
  min-height: 24px !important;
  height: 24px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container form,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-form-field,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-form-field {
  width: 100%;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-form-field-subscript-wrapper,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-form-field-bottom-align::before {
  display: none;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-input-element {
  padding: 0 4px;
  height: 24px;
  margin-top: 0;
  font-family: "gilroy-regular", sans-serif;
  font-size: 14px;
  line-height: 24px;
  color: #6f7782;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-input-element,
#dtCloudApp app-send-proposal-sms .sms-chips-container input[matinput],
#dtCloudApp app-send-proposal-sms .sms-chips-container input[appBorderColor] {
  padding: 0 4px;
  height: 24px !important;
  margin-top: 0;
  font-family: "gilroy-regular", sans-serif;
  font-size: 14px;
  line-height: 24px;
  color: #6f7782;
  background: transparent !important;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-mdc-input-element::placeholder,
#dtCloudApp app-send-proposal-sms .sms-chips-container .mat-input-element::placeholder,
#dtCloudApp app-send-proposal-sms .sms-chips-container input[matinput]::placeholder {
  line-height: 24px;
  color: #6f7782;
  opacity: 1;
}
#dtCloudApp app-send-proposal-sms .sms-chips-container .contacts-dropdown-container {
  width: calc(100% + 2px);
  left: -1px;
  top: 31px !important;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.empty-checklist {
  border: transparent;
  box-shadow: unset;
}
#dtCloudApp .newTodoChecklist .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.empty-checklist {
  font-size: 14px !important;
  color: var(--color-neutral-500) !important;
  font-family: gilroy-regular !important;
}
.recipient-input {
  border: 1px solid var(--silver);
  border-radius: 2px;
  box-shadow: inset 0 1px 4px 0 rgb(0 0 0 / 6%);
  padding: 0 10px 4px;
  color: var(--navy);
  width: 100%;
}
#dtCloudApp .mat-focused .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  border-color: var(--green-blue);
}
#dtCloudApp .mat-focused .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.checklist-input {
  border-color: var(--green-blue) !important;
}
.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  padding: 8px;
  border: 1px solid var(--silver);
  box-shadow: inset 0px 1px 4px rgba(0, 0, 0, 0.0626698);
  border-radius: 2px;
}
.mat-mdc-form-field-has-icon-prefix .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  padding-left: 32px;
}
.mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label {
  left: 0px !important;
  top: 0 !important;
  font-size: 13px;
  line-height: 16px;
  transition: unset !important;
  transform: unset;
  font-family: gilroy-semi-bold;
  color: var(--navy);
}
.user-profile .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label {
  width: 100%;
}
.time-split-input .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label {
  left: 1px !important;
  top: -20px !important;
}
.mdc-text-field--invalid .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix .mat-mdc-floating-label {
  color: var(--red);
}
.mdc-text-field--focused .mdc-floating-label {
  color: var(--navy) !important;
}
.mdc-text-field--filled .mdc-line-ripple::before,
.mat-mdc-form-field:not(.mat-form-field-no-animations) .mdc-line-ripple::after {
  border: unset !important;
}
.mat-form-field-appearance-fill .mat-mdc-select-arrow-wrapper {
  transform: unset !important;
  margin-left: 8px !important;
}
.mat-mdc-form-field-bottom-align::before,
.height-unset-i {
  height: unset !important;
}
.mat-mdc-form-field-hint-wrapper {
  padding: 0 !important;
  top: -5px !important;
}
.mat-mdc-form-field-error-wrapper {
  padding: 0 !important;
  top: -10px !important;
}
.dt-slider-range.mat-mdc-slider .mdc-slider__thumb-knob {
  border-radius: 4px;
  width: 32px;
  height: 28px;
  border-style: solid;
  border-width: 1px;
  border-color: #eaeced;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.08) 100%),
    var(--white);
  box-shadow: unset;
}
.dt-slider-range.mat-mdc-slider .mdc-slider__thumb--focused .mdc-slider__thumb-knob {
  background-color: unset;
  border-color: transparent;
}
.dt-slider-range.mat-mdc-slider .mdc-slider__thumb-knob::after {
  content: "| |";
  color: var(--medium-gray);
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 24px;
}
.mat-mdc-slider.mat-primary {
  --mat-slider-handle-color: var(--blue);
  --mat-slider-focus-handle-color: var(--blue);
  --mat-slider-hover-handle-color: var(--blue);
  --mat-slider-active-track-color: var(--blue);
  --mat-slider-inactive-track-color: var(--medium-gray);
  --mat-slider-with-tick-marks-active-container-color: var(--white);
  --mat-slider-with-tick-marks-inactive-container-color: var(--white);
  --mat-mdc-slider-ripple-color: var(--blue);
  --mat-mdc-slider-hover-ripple-color: transparent;
  --mat-mdc-slider-focus-ripple-color: transparent;
}
.mat-mdc-slide-toggle.mat-accent {
  --mat-slide-toggle-selected-track-color: var(--green-blue);
  --mat-slide-toggle-selected-hover-track-color: var(--green-blue);
}
@keyframes ring {
  0% {
    transform: rotate(0);
  }
  1% {
    transform: rotate(30deg);
  }
  3% {
    transform: rotate(-28deg);
  }
  5% {
    transform: rotate(34deg);
  }
  7% {
    transform: rotate(-32deg);
  }
  9% {
    transform: rotate(30deg);
  }
  11% {
    transform: rotate(-28deg);
  }
  13% {
    transform: rotate(26deg);
  }
  15% {
    transform: rotate(-24deg);
  }
  17% {
    transform: rotate(22deg);
  }
  19% {
    transform: rotate(-20deg);
  }
  21% {
    transform: rotate(18deg);
  }
  23% {
    transform: rotate(-16deg);
  }
  25% {
    transform: rotate(14deg);
  }
  27% {
    transform: rotate(-12deg);
  }
  29% {
    transform: rotate(10deg);
  }
  31% {
    transform: rotate(-8deg);
  }
  33% {
    transform: rotate(6deg);
  }
  35% {
    transform: rotate(-4deg);
  }
  37% {
    transform: rotate(2deg);
  }
  39% {
    transform: rotate(-1deg);
  }
  41% {
    transform: rotate(1deg);
  }
  43% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(0);
  }
}
#dtCloudApp .mdc-menu-surface.mat-mdc-autocomplete-panel {
  padding: 0;
}
.ql-clipboard,
.wysiwig-content > * {
  white-space: pre-wrap;
  word-wrap: break-word;
}
.drawing .takeof-add-items .search-items {
  max-width: 100%;
  margin: auto;
  margin-top: 0px;
  z-index: 2;
  width: 100%;
}
.takeoff-categories .mat-mdc-tab-body-content {
  height: calc(100vh - 100px);
}
#alternateSetRB.disabled-mode {
  opacity: 0.6 !important;
}
#dtCloudApp .mdc-card {
  display: block;
}
.print-outlet.proposal-font .mention,
app-description .mention,
.proposal-container .mention,
app-description-content .mention {
  color: black !important;
  background-color: transparent;
  font-family: gilroy-medium;
}
.mention,
.mention span {
  margin-right: 1px !important;
}
app-service-plan-item-edit .mention span {
  margin: 0px !important;
  text-transform: lowercase !important;
}
app-service-plan-item-edit .mention {
  margin: 0 3px !important;
}
@media (max-width: 750px) {
  .drawing .search-items {
    width: 80% !important;
    margin: auto !important;
    left: 10%;
    max-width: 80%;
  }
}
#dtCloudApp .newTodoChecklist .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix,
#dtCloudApp .editChecklist .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
  padding-top: unset;
  padding-bottom: unset;
}
.serviceContractPayment-container .input-border.price-content {
  padding-left: 15px !important;
  height: 32px !important;
}
.payment-shareByLink .contacts-dropdown-container {
  width: 100% !important;
}
.service-setting-dialog-content .service-setting-tab app-selection-manager {
  overflow-y: auto;
  height: calc(100vh - 420px);
}
.service-call-issues-editor .ql-container {
  height: 50vh !important;
  overflow: auto;
}
.service-call-notes-editor .ql-container {
  height: 25vh !important;
  overflow: auto;
}
.parent-filters {
  cursor: move;
}
.bom-description .m-t-25 {
  margin-top: 0;
}
.project-detail-drawer-content .router-container {
  overflow: hidden;
  height: auto;
  padding: 0;
  padding-top: 24px;
}
.avatar-acronym {
  max-width: 32px !important;
  max-height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  width: 32px;
  height: 32px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 10px;
}
.mat-mdc-card-avatar.owner-avatar-h-w {
  width: 25px;
  height: 25px;
  min-width: 25px;
  border-radius: 50%;
  border: 2px solid var(--light-gray2);
  text-align: center;
  overflow: hidden;
}
.visual-dialog .mat-mdc-dialog-container .mdc-dialog__surface {
  background: rgb(0, 0, 0);
  z-index: 100;
  width: calc(100vw);
  max-width: calc(100wv);
  padding: 89px;
}
.visual-dialog label,
.visual-dialog span,
.visual-dialog h3 {
  color: var(--white);
}
.visual-dialog .mat-mdc-dialog-container {
  opacity: 0.7;
}
.drawing-bottom-panel .mat-bottom-sheet-container {
  width: 100%;
  max-width: 100% !important;
  min-width: calc(100vw - 80px) !important;
  box-shadow: none;
  height: 200px;
  background: #000000;
  opacity: 0.75;
  margin-left: 80px;
}
.drawing.whiteboard .drawing-options.vertical-bar {
  min-width: 50px !important;
  margin-left: auto;
  max-width: 50px !important;
  right: 10px !important;
  left: auto !important;
  top: 65px;
  height: 780px;
}
.menu-add-drawings.mat-mdc-menu-panel.mat-mdc-menu-panel {
  background: transparent !important;
  box-shadow: none !important;
  border: 0px !important;
  overflow: hidden;
  margin-top: 10px;
}
.hide-project-description {
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.location-create {
  border-radius: 24px !important;
  padding: 0px !important;
}
.resource-popOver {
  right: 5vw !important;
  padding: 0px !important;
  position: relative;
}
.client-info-popOver {
  left: 150px !important;
  top: 10px !important;
  position: relative;
  border: 1px solid var(--silver2);
  border-radius: 8px;
}
.transferPopOver {
  width: 80%;
  position: relative;
  left: 103px;
  top: -65px;
}
.project-detail-drawer-content .visual-quotes .router-container {
  display: flex;
  height: calc(100vh - 64px);
  padding: 0 48px;
  padding-top: 48px;
}
.mat-dialog-content.resource-pop {
  max-height: 100vh;
}
.pre-tag {
  background: #004878;
  border-radius: 2px;
  padding: 16px 24px;
  font-family: gilroy-medium;
  color: var(--white);
}
pre {
  font-size: 14px;
  margin: 0;
  line-height: 1px;
}
pre p {
  line-height: 24px;
}
.input-mat-suffix .mat-mdc-form-field-icon-suffix {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 0;
}
.gilroy-semi-bold label {
  font-family: gilroy-semi-bold !important;
}
@media only screen and (max-width: 1200px) {
  .drawing .search-items {
    max-width: 515px;
    left: 50%;
    margin-left: -234px;
    position: fixed;
  }
  .drawing .header label {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: 22px;
    margin-bottom: 10px;
    margin-top: 10px;
  }
}
.tooltip-align-center .mdc-tooltip__surface {
  text-align: center !important;
}
.wizard-btn-primary.hide-automation-setup-wizard::after {
  background-color: transparent;
  pointer-events: none;
}
.payment-schedule-tab .payment-schedule-container,
.min-width-unset {
  min-width: unset !important;
}
.gray-background {
  background-color: var(--light-gray);
}
.associated-item-text > * {
  display: unset;
}
.display-unset-i {
  display: unset !important;
}
.associated-item-text .mention {
  color: #000000 !important;
  text-transform: lowercase;
}
.inline-text-editor app-text-editor .ql-editor > * {
  display: unset;
}
.key-date-phase .ng-dropdown-panel {
  max-height: 280px !important;
}
.task-group-phase .ng-dropdown-panel {
  max-height: 250px !important;
}
.mat-mdc-form-field-has-suffix.mat-mdc-form-field-has-icon-suffix .mat-mdc-form-field-icon-suffix {
  padding: 0;
}
.mat-mdc-form-field-has-suffix.mat-mdc-form-field-has-icon-suffix .mat-mdc-form-field-icon-suffix span {
  position: absolute;
  right: 0;
  bottom: 0;
  top: 7px;
  padding: 0 8px;
}
app-todo-detail .resources-wrapper {
  margin-top: 4px !important;
}
.plan-feature {
  border: 1px solid #eaeced;
  padding: 15px;
  background-color: white;
  margin-bottom: 10px;
  cursor: grab;
}
.plan-feature-list {
  border: 1px solid #eaeced;
  padding: 15px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  cursor: pointer;
}
.plan-feature-description {
  font-size: 12px;
  color: #6f7782;
  margin-top: 5px;
}
.plan-feature-count {
  color: var(--blue);
  background: #007acc29;
  font-size: 12px;
  text-align: center;
  padding: 2px 5px;
}
.projectCompleteSMSBtn {
  width: 175px;
  height: 32px;
  background:
    linear-gradient(
      180deg,
      rgba(1, 22, 47, 0) 0%,
      rgba(1, 22, 47, 0.08) 100%),
    var(--white) !important;
  box-shadow: 0px 2px 4px rgba(1, 22, 47, 0.16) !important;
  border-radius: 2px !important;
}
.billing-container .summary .ng-value-label {
  font-size: 20px !important;
  font-weight: 600 !important;
}
#dtCloudApp .billing-container .summary .ng-select .ng-select-container {
  cursor: pointer;
}
#dtCloudApp .billing-container .over-due-card mat-card {
  background-color: rgba(224, 49, 49, 0.1) !important;
  border: 2px solid transparent;
}
#dtCloudApp .billing-container .due-card mat-card {
  background-color: rgba(251, 128, 48, 0.1) !important;
  border: 2px solid transparent;
}
#dtCloudApp .billing-container .not-requested-card mat-card {
  background-color: rgba(0, 122, 204, 0.1) !important;
  border: 2px solid transparent;
}
#dtCloudApp .billing-container .not-created-card mat-card {
  background-color: rgba(111, 119, 130, 0.1) !important;
  border: 2px solid transparent;
}
#dtCloudApp .billing-container .paid-card mat-card {
  background-color: rgba(13, 187, 125, 0.1) !important;
  border: 2px solid transparent;
}
#dtCloudApp .billing-container .over-due-card button {
  border-color: rgba(224, 49, 49, 1) !important;
  background-color: rgba(224, 49, 49, 1) !important;
}
#dtCloudApp .billing-container .due-card button {
  background-color: rgba(251, 128, 48, 1) !important;
  border-color: rgba(251, 128, 48, 1) !important;
}
#dtCloudApp .billing-container .not-requested-card button {
  background-color: rgba(0, 122, 204, 1) !important;
  border-color: rgba(0, 122, 204, 1) !important;
}
#dtCloudApp .billing-container .not-created-card button {
  background-color: rgba(111, 119, 130, 1) !important;
  border-color: rgba(111, 119, 130, 1) !important;
}
#dtCloudApp .billing-container .over-due-card.selected mat-card {
  border: 2px solid rgba(224, 49, 49, 1);
}
#dtCloudApp .billing-container .due-card.selected mat-card {
  border: 2px solid rgba(251, 128, 48, 1);
}
#dtCloudApp .billing-container .not-requested-card.selected mat-card {
  border: 2px solid rgba(0, 122, 204, 1);
}
#dtCloudApp .billing-container .not-created-card.selected mat-card {
  border: 2px solid rgba(111, 119, 130, 1);
}
#dtCloudApp .billing-container .paid-card.selected mat-card {
  border: 2px solid rgba(13, 187, 125, 1);
}
.mat-mdc-button.primary.over-due-card-custom-shadow:hover {
  box-shadow: 0 4px 5px 0 rgba(224, 49, 49, 1) !important;
}
.mat-mdc-button.primary.over-due-card-custom-shadow:focus {
  box-shadow: unset !important;
}
.mat-mdc-button.primary.over-due-card-custom-shadow:active {
  border: unset !important;
  background-color: unset !important;
}
.mat-mdc-button.primary.due-card-custom-shadow:hover {
  box-shadow: 0 4px 5px 0 rgba(251, 128, 48, 1) !important;
}
.mat-mdc-button.primary.due-card-custom-shadow:focus {
  box-shadow: unset !important;
}
.mat-mdc-button.primary.due-card-custom-shadow:active {
  border: unset !important;
  background-color: unset !important;
}
.mat-mdc-button.primary.not-requested-custom-shadow:hover {
  box-shadow: 0 4px 5px 0 rgba(0, 122, 204, 1) !important;
}
.mat-mdc-button.primary.not-requested-custom-shadow:focus {
  box-shadow: unset !important;
}
.mat-mdc-button.primary.not-requested-custom-shadow:active {
  border: unset !important;
  background-color: unset !important;
}
.mat-mdc-button.primary.not-created-custom-shadow:hover {
  box-shadow: 0 4px 5px 0 rgba(111, 119, 130, 1) !important;
}
.mat-mdc-button.primary.not-created-custom-shadow:focus {
  box-shadow: unset !important;
}
.mat-mdc-button.primary.not-created-custom-shadow:active {
  border: unset !important;
  background-color: unset !important;
}
.mat-mdc-button.primary.paid-custom-shadow:hover {
  box-shadow: 0 4px 5px 0 rgba(13, 187, 125, 1) !important;
}
.mat-mdc-button.primary.paid-custom-shadow:focus {
  box-shadow: unset !important;
}
.mat-mdc-button.primary.paid-custom-shadow:active {
  border: unset !important;
  background-color: unset !important;
}
.report-new .sales-leaderboard {
  margin: 20px 0px;
}
#dtCloudApp .calc-labor-type .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 180px !important;
}
.custom-toggle-container {
  display: flex;
  height: 32px;
  width: 278px;
  border-radius: 24px;
  background: #eaeced;
  margin-right: 28px;
  cursor: pointer;
}
.custom-toggle-container .toggle-div {
  display: flex;
  width: 50%;
  align-items: center;
  justify-content: center;
  height: 100%;
  border-radius: 24px;
  transition: background-color 0.3s ease;
}
.custom-toggle-container .toggle-div.active {
  background: #6f7782;
  color: white;
}
.mat-mdc-dialog-content.payment-term-list {
  max-height: calc(100vh - 116px) !important;
  padding: 16px !important;
}
.align-self-center {
  align-self: center;
}
drag-icon,
.drag-cursor {
  cursor: move !important;
}
.reject-co-textArea {
  width: 100%;
  height: 120px;
  resize: none;
  box-shadow: 0px 1px 4px 0px #01162f14 inset;
  border: 1px solid #eaeced;
  font-family: "gilroy-medium";
  padding: 12px;
}
textarea.reject-co-textArea::placeholder {
  font-style: italic;
  font-family: "gilroy-medium";
  line-height: 18px;
}
.time-entry-textArea {
  color: #6F7782 !important;
}
textarea.time-entry-textArea::placeholder {
  font-size: 14px !important;
  font-family: "gilroy-regular" !important;
}
.service-opp app-breadcrumb-navigation {
  margin: auto;
}
div.preview-text > p {
  display: inline-block;
}
.tooltip-chart {
  width: 250px;
  height: 150px;
  border: solid #eaeced;
  border-width: "1px";
  border-radius: "5px";
  padding: "10px";
}
.tooltip-chart .heading1 {
  font-size: 16px !important;
  font-family: gilroy-semi-bold !important;
  display: block;
  color: var(--blue) !important;
  text-align: center;
}
.tooltip-chart .heading1 {
  font-size: 16px !important;
  font-family: gilroy-bold !important;
  display: block;
  color: var(--blue) !important;
  text-align: center;
}
.tooltip-chart .heading2 {
  font-size: 13px !important;
  font-family: gilroy-bold !important;
  display: block;
  color: var(--black) !important;
  text-align: center;
}
.tooltip-chart .heading3 {
  font-size: 24px !important;
  font-family: gilroy-bold !important;
  display: block;
  color: var(--color-text-primary) !important;
  text-align: center;
}
.tooltip-chart .heading4 {
  font-size: 13px !important;
  font-family: gilroy-medium !important;
  display: block;
  color: #6f7782 !important;
  text-align: center;
}
#dtCloudApp .report .report-new .mat-mdc-card-content {
  margin: 0px 15px !important;
  margin-bottom: 20px !important;
}
.wysiwig-content .statusBtn-green {
  cursor: pointer;
}
#editorParentContent app-quote-service-plan-list .list-container {
  padding: 24px 0 !important;
}
.gallery-action-menu {
  position: absolute;
  display: none;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: content-box;
  top: 5px;
  right: -65px;
  width: 44px;
  height: 100%;
  z-index: 1;
  font-weight: unset !important;
}
.gallery-grid-item:hover > .gallery-action-menu,
.proposal-gallery-hotspot.gallery-grid-item:hover .gallery-action-menu {
  display: block;
}
.gallery-action-menu .btn-edit {
  width: 40px;
  cursor: pointer;
  min-width: unset;
  min-height: 35px;
  height: 40px;
  text-align: center;
  line-height: 0;
  color: white;
  background-image:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.13),
      rgba(255, 255, 255, 0)),
    linear-gradient(#020e1c, #020e1c);
  box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.11);
  border: none;
  margin: 5px 0;
  font-family: gilroy-semi-bold;
  overflow: hidden;
  border-radius: 50%;
  transition: 0.2s;
  padding: 0px 8px;
}
.text-lowerCase {
  text-transform: lowercase !important;
}
#dtCloudApp .labor-menu button span.mat-mdc-menu-item-text {
  gap: unset !important;
}
.nested-menu.column-ref {
  width: 160px;
}
.nested-menu.product-status-column-ref {
  width: 180px;
}
@media (min-height: 550px) and (max-height: 650px) {
  .nested-menu.column-ref {
    height: 300px !important;
  }
}
.nested-menu.column-ref .menu-tick {
  padding-top: 0px;
  padding-bottom: 0px;
}
.short-description-overflow {
  display: flex;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.drawing-options.connection-options {
  min-width: 595px !important;
  max-width: 720px !important;
  margin-left: -335px !important;
}
.description-max-width {
  max-width: 306px;
}
@media (min-width: 599px) and (max-width: 1500px) {
  .short-description-overflow.description-max-width {
    max-width: 217px;
  }
}
.est-popover {
  border-radius: 12px;
  margin-top: 8px;
}
.mat-mdc-checkbox.webhook-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true]) ~ .mdc-checkbox__background {
  border-color: var(--cool-grey-two);
}
.mat-drawer-side {
  border-right: 1px solid var(--light-gray2);
}
.time-entry-header {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  height: 57px;
  max-height: 57px;
  padding: 0 16px;
  place-content: center flex-start;
}
.est-selected-date {
  margin-right: 24px;
  white-space: nowrap;
}
.project-change-order-list {
  height: calc(100vh - 57px);
}
.filter-applied .project-change-order-list {
  height: calc(100vh - 121px);
}
.project-change-order-list .list-overflow-wrapper {
  height: calc(100vh - 144px);
}
.filter-applied .project-change-order-list .list-overflow-wrapper {
  height: calc(100vh - 296px);
}
#emoji-palette ul > li:not(.ql-mention-list-item)::before {
  content: "" !important;
  display: block;
}
#emoji-palette {
  max-width: 385px !important;
}
.ng-star-inserted ul li:not(.ql-direction-rtl) {
  padding: 0 0.8em !important;
}
.gallery-button-hotspot {
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
  min-width: 91px;
  height: 32px;
  color: #000;
  text-align: center;
  font-family: "gilroy-medium2";
  font-size: 14px;
  line-height: 26px;
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 100;
  cursor: pointer;
}
.expand-hotspot-icon {
  display: none;
}
.gallery-grid-container.three_1 .gallery-grid-item:nth-child(3n+1) .expand-hotspot-icon,
.gallery-grid-container.three_2 .gallery-grid-item .expand-hotspot-icon,
.gallery-grid-container.four_2 .gallery-grid-item .expand-hotspot-icon {
  display: block;
}
.gallery-grid-container.three_1 .gallery-grid-item:nth-child(3n+1).expanded,
.gallery-grid-container.three_2 .gallery-grid-item.expanded,
.gallery-grid-container.four_2 .gallery-grid-item.expanded {
  height: 500px;
}
.mat-elevation-z8,
.mat-mdc-elevation-specific.mat-elevation-z8 {
  box-shadow: none;
}
.dd-width {
  width: 140px;
}
#dtCloudApp .group-item input.mat-mdc-form-field-input-control.item-quantity {
  width: 78px !important;
}
.select-label.required::after,
.address-line1 {
  margin-left: 4px;
  margin-right: 0px;
  content: "*";
  color: var(--red);
}
.planning-container mat-drawer-content.mat-drawer-content {
  padding: 0px !important;
}
.schedule-padding {
  margin-top: 6px !important;
  padding: 0px 0px 0px 16px !important;
}
.pie-chart .div-row {
  display: table-cell;
  width: 45%;
}
.tooltip-chart.pie-chart .heading1 {
  font-size: 18px !important;
  font-family: gilroy-semi-bold !important;
  display: block;
  color: var(--blue) !important;
  text-align: left;
}
.tooltip-chart.pie-chart .heading2 {
  color: #6f7782 !important;
  font-size: 12px !important;
  text-align: left;
}
.tooltip-chart.pie-chart .heading3 {
  font-size: 15px !important;
  font-family: gilroy-bold !important;
  display: block;
  color: var(--color-text-primary) !important;
  text-align: left;
}
#dtCloudApp .mdc-checkbox.mdc-checkbox-new {
  padding: 0;
  margin: 0;
}
#dtCloudApp .mdc-checkbox.mdc-checkbox-new .mdc-checkbox__background {
  top: 0;
  left: 0;
}
#dtCloudApp .mdc-checkbox.mdc-checkbox-new .mat-mdc-checkbox-touch-target {
  height: 12px;
  width: 12px;
}
.custom-expand-padding {
  padding: 30px 16px;
}
.compact-view-padding {
  padding: 20px 16px;
}
.compact-view .group-item {
  line-height: 28px;
}
.compact-position {
  top: 2px !important;
}
.custom-item-container-padding {
  padding: 0px 16px 0px 0px;
}
.count {
  border-radius: 2px;
  background: rgba(0, 122, 204, 0.16);
  padding: 3px 6px;
  font-size: 12px;
  font-family: gilroy-semi-bold;
  color: var(--blue);
}
.drawing .header label.label-whiteboard-header {
  max-width: 300px;
  text-wrap: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  height: 39px;
  margin-top: 24px;
  line-height: 12px;
}
#dtCloudApp .quantity-dropdown.ng-dropdown-panel,
#dtCloudApp .quantity-dropdown.ng-select-opened {
  min-width: 81px !important;
}
#dtCloudApp .quantity-dropdown .ng-dropdown-panel-items {
  max-height: 352px !important;
  min-height: 352px !important;
  overflow-y: hidden !important;
}
#dtCloudApp .quantity-dropdown.ng-dropdown-panel .ng-option:first-child {
  color: var(--red) !important;
}
#dtCloudApp .quantity-dropdown.ng-dropdown-panel .ng-option:last-child {
  border-top: 1px solid var(--silver);
}
#dtCloudApp .quantity-dropdown-counts.mdc-list-item {
  padding: 0px 8px;
}
#dtCloudApp .quantity-dropdown {
  border: 1px solid var(--silver);
  padding: 0px !important;
  min-width: 78px !important;
  background: white !important;
}
#dtCloudApp .quantity-dropdown-counts.mat-mdc-menu-item:first-child {
  color: var(--red) !important;
}
#dtCloudApp .quantity-dropdown-counts.mat-mdc-menu-item:last-child {
  border-top: 1px solid var(--silver);
}
.mat-cancel {
  margin-left: 10px !important;
  font-family: "gilroy-medium" !important;
  color: var(--cool-green) !important;
  border-radius: 5px !important;
  border: solid 2px var(--cool-green) !important;
  background-color: var(--white);
  height: 36px !important;
  font-size: 14px;
}
.primary-box-28 {
  border: 1px solid rgba(154, 155, 156, 0.3);
  border-radius: 5px;
  background-color: var(--cool-green);
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06);
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.ql-snow .ql-tooltip.ql-flip {
  z-index: 2;
}
.b-l-0 {
  border-left: 0px !important;
}
.mat-mdc-checkbox.label-font-16 label {
  font-size: 16px;
}
.reload-icon-drawing svg path {
  stroke: #6f7782 !important;
}
#dtCloudApp .schedule-date-input .timer-dropdown {
  height: 24px !important;
  border-radius: 16px !important;
}
.report .tooltip-title {
  display: none;
  border-radius: 4px;
  box-shadow: 0px 0px 4px 0px rgba(1, 22, 47, 0.16);
  width: 295px;
  min-height: 100px;
  position: absolute;
  top: -5px;
  left: 39px;
  background-color: #fff;
  z-index: 10;
}
.report .tooltip-title .tooltip-title-labels {
  color: var(--blue);
  font-family: gilroy-medium;
  font-size: 18px !important;
}
.report .tooltip-title label {
  color: 007ACC;
  font-family: Gilroy-medium;
  font-size: 16px;
}
.report .tooltip-title p {
  font-size: 13px;
  font-family: gilroy-regular;
  color: var(--color-text-primary);
}
.report .title:hover .tooltip-title {
  display: block;
}
.report .title-image {
  max-width: 120px;
  min-width: 81px;
  background-image: url("./media/subtract-reports-DPAFFBBW.svg");
  background-size: 70px;
  background-repeat: no-repeat;
  height: 102px;
}
app-proposal-hotspot-image .hotspot {
  z-index: 1;
}
.hotspot-component {
  height: 300px !important;
}
.expanded .hotspot-component {
  height: 500px !important;
}
.parent-container .hotspot-component {
  height: 100% !important;
}
.overlay .hover-position .file-hovr-btn.open-new-window {
  min-width: 32px !important;
  height: 32px !important;
  margin: 54px 76px !important;
  border: none !important;
}
.squarebox-color {
  height: 16px;
  width: 16px;
  border-radius: 2px;
  display: block;
}
.labor-quantity {
  border: 1px solid var(--silver);
  padding: 5px 4px;
  background: white;
  border-radius: 4px;
  max-width: unset !important;
  min-width: 78px !important;
  text-align: left !important;
  margin-right: 4px;
}
.mdc-list-item--selected .mat-pseudo-checkbox {
  display: none;
}
.ql-snow .ql-tooltip a.ql-preview {
  vertical-align: middle !important;
  margin-bottom: 3px;
}
.stage-list-hover-edit input,
.stage-list-hover-edit .ng-select-container {
  border-color: transparent !important;
}
.stage-list-hover-edit:hover input,
.stage-list-hover-edit:hover .ng-select-container {
  border-color: inherit !important;
}
.stage-list-hover-edit .ng-arrow-wrapper,
.stage-list-hover-edit .price-sufix-top-35,
.stage-list-hover-edit:hover .status-probability {
  display: none;
}
.stage-list-hover-edit:hover .ng-arrow-wrapper,
.stage-list-hover-edit:hover .price-sufix-top-35,
.stage-list-hover-edit .status-probability {
  display: block;
}
app-item-display.cdk-drag-preview {
  flex-direction: column;
  height: auto !important;
  border-radius: 10px;
  border: 1px solid var(--cool-green);
}
app-item-display.cdk-drag-preview .cdk-drop-list {
  display: none;
}
app-item-display .drag-item-count {
  display: none !important;
}
app-item-display.cdk-drag-preview > .drag-item-count {
  position: absolute;
  bottom: -44px;
  height: 50px;
  background: white;
  border: 1px solid var(--cool-green);
  border-radius: 0px 0px 10px 10px;
  border-top: 1px solid var(--cool-grey);
  display: flex !important;
  box-shadow:
    0 5px 5px -3px rgb(0 0 0 / 20%),
    0 8px 10px 1px rgb(0 0 0 / 14%),
    0 3px 14px 2px rgb(0 0 0 / 12%);
  width: inherit;
  font-size: 15px;
}
.custom-field-detail-container mat-select.hideArrowIcon .mat-mdc-select-arrow {
  display: none !important;
}
mat-option.mat-mdc-option.mdc-list-item.with-tick .stage-count {
  display: none;
}
#dtCloudApp button.client-selectable-gap .mat-mdc-menu-item-text {
  gap: unset !important;
}
#dtCloudApp .dt-input-mat-suffix .mat-mdc-form-field-icon-suffix {
  padding: 0;
  height: 36px;
  display: flex;
  align-items: center;
}
.dt-input-mat-suffix .mat-suffix {
  position: absolute;
  right: 8px;
}
.min-width-100vw {
  min-width: 100vw !important;
}
.min-width-192 {
  min-width: 192px !important;
}
@media (min-width: 2230px) {
  .router-main-content .short-description-overflow {
    max-width: 600px !important;
  }
}
.button-check-box {
  width: fit-content;
  min-width: 104px;
  min-height: 32px;
  box-shadow: 0px 0px 4px rgb(1 22 47 / 16%);
  border-radius: 24px;
  align-items: center;
  justify-content: center;
  display: flex;
  margin: 0px 16px;
  padding: 0 16px;
  cursor: pointer;
}
.button-check-box-checked {
  background-color: var(--cool-green);
  color: var(--white);
}
.filter-panel-customize-width {
  min-width: 323px !important;
}
.mat-mdc-radio-button .mdc-radio .mdc-radio__native-control:enabled:not(:checked) + .mdc-radio__background .mdc-radio__outer-circle {
  border-color: var(--silver2) !important;
}
.status-preview.orange,
.status-tag.orange,
.status-preview.Orange,
.status-tag.Orange,
.status-orange,
.status-Orange {
  background-color: var(--orange);
}
.status-preview.blue,
.status-tag.blue,
.status-preview.Blue,
.status-tag.Blue,
.status-blue {
  background-color: var(--blue);
}
.status-preview.green,
.status-tag.green,
.status-preview.Green,
.status-tag.Green,
.status-green {
  background-color: var(--cool-green);
}
.status-preview.red,
.status-tag.red,
.status-preview.Red,
.status-tag.Red,
.status-red {
  background-color: var(--red);
}
.status-preview.yellow,
.status-tag.yellow,
.status-preview.Yellow,
.status-tag.Yellow,
.status-yellow {
  background-color: var(--yellow);
  color: var(--navy);
}
.status-tag.planing-blue {
  background-color: var(--color-planning-blue1);
  color: white;
}
.status-preview.grey,
.status-tag.grey,
.status-preview.Grey,
.status-tag.Grey,
.status-grey {
  background-color: rgb(126, 138, 150);
}
.status-preview.gray,
.status-preview.grey,
.status-tag.gray,
.status-tag.grey,
.status-preview.Gray,
.status-preview.Grey,
.status-tag.Gray,
.status-tag.Grey,
.status-gray {
  background-color: var(--light-gray2);
  color: var(--navy);
}
.status-preview.blue1,
.status-tag.blue1,
.status-preview.Blue1,
.status-tag.Blue1,
.status-blue1,
.status-Blue1 {
  background-color: var(--blue1);
}
.status-preview.blue2,
.status-tag.blue2,
.status-preview.Blue2,
.status-tag.Blue2,
.status-blue2,
.status-Blue2 {
  background-color: var(--blue2);
}
.status-preview.blue3,
.status-tag.blue3,
.status-preview.Blue3,
.status-tag.Blue3,
.status-blue3,
.status-Blue3 {
  background-color: var(--blue3);
}
.status-preview.gray1,
.status-tag.gray1,
.status-preview.Gray1,
.status-tag.Gray1,
.status-gray1,
.status-Gray1 {
  background-color: var(--gray1);
}
.status-preview.gray2,
.status-tag.gray2,
.status-preview.Gray2,
.status-tag.Gray2,
.status-gray2,
.status-Gray2 {
  background-color: var(--gray2);
}
.status-preview.gray3,
.status-tag.gray3,
.status-preview.Gray3,
.status-tag.Gray3,
.status-gray3,
.status-Gray3 {
  background-color: var(--gray3);
}
.status-preview.green1,
.status-tag.green1,
.status-preview.Green1,
.status-tag.Green1,
.status-green1,
.status-Green1 {
  background-color: var(--green1);
}
.status-preview.green2,
.status-tag.green2,
.status-preview.Green2,
.status-tag.Green2,
.status-green2,
.status-Green2 {
  background-color: var(--cool-green);
}
.status-preview.green3,
.status-tag.green3,
.status-preview.Green3,
.status-tag.Green3,
.status-green3,
.status-Green3 {
  background-color: var(--green3);
}
.status-preview.orange1,
.status-tag.orange1,
.status-preview.Orange1,
.status-tag.Orange1,
.status-orange1,
.status-Orange1 {
  background-color: var(--orange1);
}
.status-preview.orange2,
.status-tag.orange2,
.status-preview.Orange2,
.status-tag.Orange2,
.status-orange2,
.status-Orange2 {
  background-color: var(--orange2);
}
.status-preview.orange3,
.status-tag.orange3,
.status-preview.Orange3,
.status-tag.Orange3,
.status-orange3,
.status-Orange3 {
  background-color: var(--orange3);
}
.status-preview.purple1,
.status-tag.purple1,
.status-preview.Purple1,
.status-tag.Purple1,
.status-purple1,
.status-Purple1 {
  background-color: var(--purple1);
}
.status-preview.purple2,
.status-tag.purple2,
.status-preview.Purple2,
.status-tag.Purple2,
.status-purple1,
.status-Purple1 {
  background-color: var(--purple2);
}
.status-preview.purple3,
.status-tag.purple3,
.status-preview.Purple3,
.status-tag.Purple3,
.status-purple3,
.status-Purple3 {
  background-color: var(--purple3);
}
.status-preview.purple4,
.status-tag.purple4,
.status-preview.Purple4,
.status-tag.Purple4,
.status-purple4,
.status-Purple4 {
  background-color: var(--purple4);
}
.status-preview.red1,
.status-tag.red1,
.status-preview.Red1,
.status-tag.Red1,
.status-red1,
.status-Red1 {
  background-color: var(--red1);
}
.status-preview.red2,
.status-tag.red2,
.status-preview.Red2,
.status-tag.Red2,
.status-red2,
.status-Red2 {
  background-color: var(--red);
}
.status-preview.red3,
.status-tag.red3,
.status-preview.Red3,
.status-tag.Red3,
.status-red3,
.status-Red3 {
  background-color: #7225ae;
}
.status-preview.pink,
.status-tag.pink,
.status-preview.Pink,
.status-tag.Pink,
.status-pink,
.status-Pink {
  background-color: var(--pink);
}
.quantity-dropdown .mdc-button__label {
  padding-right: 12px !important;
}
.service-plan-image .img-upload {
  height: 168px;
}
.service-contract-attachments .attachments-overlay {
  height: 180px;
  margin-top: 0px !important;
  margin-left: 0px !important;
  margin-right: 20px !important;
}
.total-tab .mat-mdc-tab-body-content {
  overflow: hidden !important;
}
.service-plan-attachments .attachments-overlay {
  margin-top: 0px !important;
  margin-right: 0px !important;
}
.service-plan-upload-file .url-input {
  bottom: 24px !important;
}
.service-contract-upload-file .url-input {
  bottom: 18px !important;
}
#dtCloudApp .quote-filter-location-menu {
  max-width: 320px;
}
@media (max-width: 599px) {
  .mdc-list-item.mdc-list-item--with-one-line {
    height: 48px !important;
  }
}
.ng-select:not(.ng-select-disabled) * {
  cursor: pointer !important;
}
.item-status-container .grid-menu-container .mdc-button__label {
  top: -5px;
}
#dtCloudApp .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control.template-txtArea {
  height: 80px !important;
}
.table-ellipsis {
  position: relative;
}
.table-ellipsis:before {
  content: " ";
  visibility: hidden;
}
.table-ellipsis .elipse-content {
  position: absolute;
  left: 0;
  right: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#marketSector ng-dropdown-panel.ng-dropdown-panel div.ng-dropdown-panel-items {
  max-height: 190px;
  width: 100%;
}
#quoteTemplate ng-dropdown-panel.ng-dropdown-panel div.ng-dropdown-panel-items {
  max-height: 275px;
}
.service-opp-content #quoteTemplate ng-dropdown-panel.ng-dropdown-panel div.ng-dropdown-panel-items {
  max-height: 200px;
}
.service-opp-content #opportunityLeadOwner ng-dropdown-panel.ng-dropdown-panel div.ng-dropdown-panel-items {
  max-height: 225px;
}
.padding-less.label-position .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix label.mat-mdc-floating-label {
  position: absolute;
  top: -30px !important;
}
#dtCloudApp .report .mat-mdc-card {
  border: 1px solid var(--silver) !important;
}
.report-new .bar {
  fill: #59cedf;
}
.report-new .line {
  fill: none;
  stroke-width: 2px;
}
.report-new .grid line {
  stroke: lightgrey;
  stroke-opacity: 0.7;
  shape-rendering: crispEdges;
}
.report-new .tooltip-bar {
  position: absolute;
  background-color: white;
  border: 1px solid #ccc;
  padding: 5px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
}
.report-new .x-axis .tick line,
.report-new .y-axis .tick line {
  display: none;
}
.report-new .x-axis path,
.report-new .y-axis path,
.report-new .y-axis-right path {
  display: none;
}
.report-new g.grid .tick text,
.report-new .grid path,
.report-new .y-axis-right .tick line {
  display: none;
}
.report-new .arc {
  stroke: #fff;
}
.report .sales-leaderboard app-pie-chart svg {
  height: auto;
  background-color: #fff !important;
}
.report .sales-leaderboard .icon-expand svg {
  background-color: #fff !important;
}
.service-plan-section-content .flex-180 ng-select {
  min-width: 180px;
}
.drawing-options.connection-options.search-options {
  min-width: 830px !important;
  max-width: 830px !important;
  margin-left: -370px !important;
}
.adjustment-tax.flex-150 ng-select {
  min-width: 150px;
}
.report .sales-leaderboard .icon-rank svg {
  background: transparent;
  height: auto;
  margin-top: 0px;
  margin-right: 0px;
}
ngx-mat-datepicker-content .mat-datepicker-actions {
  position: absolute;
  right: 16px;
  bottom: 12px;
  padding: 0px !important;
}
.mat-datepicker-actions > button {
  height: 36px !important;
}
ngx-mat-datepicker-content .ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-meridian .mat-mdc-button {
  height: 36px !important;
}
#dtCloudApp ngx-mat-datepicker-content .mat-mdc-form-field-input-control.mat-mdc-form-field-input-control {
  min-width: 36px !important;
}
#dtCloudApp ng-select.ng-select.custom-select-settings2.income-account .ng-dropdown-panel {
  width: -webkit-fill-available !important;
}
.svg .tick text {
  font-family: "gilroy-medium" !important;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .close-btn {
    margin-left: 0;
    margin-top: 10px;
    border: 0;
    box-shadow: none;
  }
  #dtCloudApp .mdc-dialog__title,
  #dtCloudApp .mat-mdc-dialog-container .dt-dialog-toolbar .mdc-dialog__title {
    margin-left: 16px;
  }
}
app-line-bar-chart g.x-axis .tick:first-of-type {
  display: none !important;
}
.menu-drawing-layout-type {
  box-shadow: none !important;
  border: 0px !important;
  background: transparent !important;
}
#quoteName,
#coName {
  color: var(--color-text-primary) !important;
  font-family: gilroy-semi-bold;
}
app-inter-connection-item-showdetails .drawing-items .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
  height: 55px;
}
.whiteboard-dialog .mat-mdc-dialog-container,
.drawing-panel .mat-mdc-dialog-container,
.file-whiteboard .mat-mdc-dialog-container,
.whiteboard-dialog .mat-mdc-dialog-container .mdc-dialog__surface,
.drawing-panel .mat-mdc-dialog-container .mdc-dialog__surface,
.file-whiteboard .mat-mdc-dialog-container .mdc-dialog__surface {
  border-radius: 0px !important;
}
#whiteboardComment .ql-toolbar.ql-snow .ql-formats {
  margin-right: 3px !important;
}
#whiteboardComment .header {
  box-shadow: none !important;
}
.connection-options .input-search-icon svg path {
  stroke: var(--gray1) !important;
}
.file-whiteboard .drawing.whiteboard .router-filter {
  top: 80px !important;
}
.upload-back-panel .preview-pane-upload .img-upload {
  width: 60px;
  max-width: 69px;
  min-width: 10px;
  height: 64px;
  max-height: 66px !important;
  min-height: 60px !important;
}
.upload-back-panel .preview-pane-upload .img-upload .img-text {
  display: none;
}
.project-item-status-supplier .supplier-select-container .ng-select.supplier-select .ng-dropdown-panel {
  left: unset !important;
  width: 100% !important;
}
.oasys-banner {
  background: url("./media/oasys-dtools-banner-CRQ3RY6Y.png") no-repeat center #ebe9e8;
  height: 160px;
}
.ellipsys-banner {
  background: url("./media/ellipsys-dtools-banner-ALHCCXUL.png") no-repeat center #000000;
  height: 160px;
}
.mat-mdc-tab-group,
.mat-mdc-tab-nav-bar {
  --mat-tab-inactive-ripple-color: none;
  --mat-tab-active-ripple-color: none;
}
.project-job-costing-container table td:not(:first-child),
.project-job-costing-container table th:not(:first-child) {
  border-left: none;
}
.project-job-costing-container table td:not(:last-child),
.project-job-costing-container table th:not(:last-child) {
  border-right: none;
}
.project-job-costing-container table .job-costing-negative-grid-color td {
  box-shadow: unset;
  background-color: unset;
}
.project-job-costing-container table .job-costing-total td {
  box-shadow: unset;
  background: unset;
  border: none;
  font-size: 16px;
}
.project-item-status-list.supplier-popover .supplier-select-container .ng-select.supplier-select .ng-dropdown-panel {
  left: -50px !important;
}
.highlight {
  background-color: yellow;
  font-weight: bold;
}
.icon-recording-start svg path {
  fill: rgb(7, 37, 72) !important;
}
.data-lake .ng-star-inserted ul > li:not(.ql-mention-list-item)::before {
  content: none;
}
.wirepath-length-input.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):active,
.wirepath-length-input.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):focus,
.wirepath-length-input.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled):hover {
  border: none !important;
}
.drawing-list .attachment-name {
  border-top: 0px !important;
}
.currency-symbol {
  font-size: 32px !important;
  font-family: gilroy-ultra-light !important;
  color: var(--blue2) !important;
  position: relative;
  bottom: 20px;
}
.currency-whole {
  font-size: 64px;
  font-family: gilroy-regular !important;
  color: var(--blue2) !important;
}
.currency-decimal {
  font-size: 32px !important;
  font-family: gilroy-ultra-light !important;
  color: var(--blue2) !important;
  position: relative;
  bottom: 20px;
}
table.inventory-table td {
  cursor: pointer !important;
}
.side-nav-quantity .mat-mdc-form-field-infix {
  width: unset;
}
.est-install-date-picker {
  position: absolute;
  right: -108px;
  top: -37px;
  border-radius: 4px;
  border: 1px solid var(--light-gray2);
  box-shadow: 0px 0px 4px rgba(1, 22, 47, 0.16);
}
.task-detail-overview-container .mat-mdc-form-field.due-date-input .mat-mdc-form-field-flex {
  display: none !important;
}
.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay,
.mat-button-toggle-checked.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay {
  opacity: 0 !important;
}
.mat-button-toggle:hover {
  background-color: transparent !important;
}
#dtCloudApp .barcode-scanner .search-items-input {
  border-radius: 24px !important;
  padding-left: 36px !important;
  border-color: var(--cool-green) !important;
}
#dtCloudApp .service-contract-details-tab .mat-mdc-form-field-infix {
  display: flex;
  align-items: center;
}
#stackedAreaChart .yAxis g.tick line,
#stackedAreaChart .yAxis path.domain,
#stackedAreaChart g.date g.tick line,
#stackedAreaChart g.date path {
  stroke: none;
}
.d3-tooltip-container {
  position: absolute;
  z-index: 10;
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0px 0px 12px 0px rgba(24, 39, 57, 0.06);
  display: flex;
}
.d3-tooltip {
  min-height: 124px;
  padding: 16px;
}
.d3-tooltip-divider {
  height: 100%;
  width: 4px;
  background-color: var(--border);
}
.d3-tooltip .card-header {
  color: var(--text-primary);
  font-family: gilroy-semi-bold;
  font-size: 16px;
}
.d3-tooltip .price-info {
  font-size: 24px;
  font-family: gilroy-semi-bold;
  color: var(--blue-primary);
}
.price-info-units {
  font-size: 16px;
  font-family: gilroy-medium;
  color: var(--text-secondary);
}
.job-costing-table td,
.job-costing-table th {
  text-wrap-mode: nowrap;
}
#StackedAreaChart1 svg text {
  font-size: 12px;
}
.project-activity-task-list .activity-list-card {
  border-color: var(--silver2) !important;
}
.project-activity-task-list .activity-list-card .activity-user {
  font-family: gilroy-medium;
}
.project-activity-task-list .activity-list-card .wysiwig-content {
  font-family: gilroy-regular;
}
.catalog-subscription-editor .toolbarIcons {
  z-index: 0;
}
#dtCloudApp .ng-select.salesReport.ng-select-single .ng-select-container {
  border-radius: 4px !important;
}
#dtCloudApp .ng-select.salesReport .ng-dropdown-panel .ng-dropdown-panel-items .ng-option-disabled {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
#dtCloudApp .subscriptions-container .ng-select.ng-select-single .ng-select-container {
  border-radius: 4px !important;
}
.subscriptions-container .quantity-dropdown.mat-mdc-button {
  border-radius: 4px !important;
}
#dtCloudApp .laborTypeTax ng-select.custom-select {
  margin-top: 22px !important;
  position: relative;
  right: 22px;
  top: 2px;
}
.nowrap {
  white-space: nowrap !important;
}
@media (max-width: 1080px) {
  .dt-dialog.major-dialog .close-btn.product-overview-close {
    right: 24px;
    border: 1px solid var(--silver);
    margin: 50px 0 0 0 !important;
    z-index: 1;
  }
}
@media (min-width: 700px) and (max-width: 1400px) {
  .dt-dialog.major-dialog .dialog-more-btn-container.product-overview-more {
    position: absolute;
    right: 100px;
    top: 60px;
  }
}
#dtCloudApp .quote-more-menu .mat-mdc-menu-item-text {
  font-family: gilroy-regular;
  font-size: 14px;
}
#dtCloudApp .quote-more-menu.gilroy-semi-bold2 .mat-mdc-menu-item-text {
  font-family: gilroy-semi-bold2;
  font-size: 14px;
}
#dtCloudApp .quote-more-menu .mat-mdc-menu-submenu-icon {
  display: none;
}
#dtCloudApp .project-more-menu .mat-mdc-menu-item-text {
  font-family: gilroy-regular;
  font-size: 14px;
}
#dtCloudApp .project-more-menu.unlink-estimate .mat-mdc-menu-item-text {
  font-family: gilroy-semi-bold;
  font-size: 14px;
}
#dtCloudApp .project-more-menu .mat-mdc-menu-submenu-icon {
  display: none;
}
#dtCloudApp .client-info-tooltip.mdc-tooltip .mdc-tooltip__surface {
  font-size: 14px !important;
  font-family: gilroy-regular !important;
  min-width: 280px;
  height: 50px;
}
#dtCloudApp .suggest-accessories-tooltip.mdc-tooltip .mdc-tooltip__surface {
  font-size: 14px !important;
  font-family: gilroy-regular !important;
  min-width: 280px;
  height: 50px;
}
#dtCloudApp .archive.mat-mdc-menu-item .mat-mdc-menu-item-text {
  font-family: gilroy-semi-bold;
  font-size: 14px;
}
#dtCloudApp .revert-to-opportunity.mat-mdc-menu-item .mat-mdc-menu-item-text {
  font-family: gilroy-semi-bold;
  font-size: 14px;
}
#dtCloudApp .labor-type-select-xs .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate) ~ .mdc-checkbox__background {
  border-color: var(--silver);
}
.status-tag.subscription-tag {
  background-color: var(--color-planning-blue1);
}
.gilroy-regular {
  font-family: gilroy-regular;
}
.gilroy-regular-i {
  font-family: gilroy-regular !important;
}
.gilroy-semi-bold {
  font-family: gilroy-semi-bold;
}
.gilroy-semi-bold2 {
  font-family: gilroy-semi-bold2;
}
.mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple) {
  color: var(--color-message);
  font-family: gilroy-semi-bold;
}
#dtCloudApp div.mat-mdc-autocomplete-panel {
  border-top-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
  border: 1px solid var(--color-divider-dark);
}
#dtCloudApp .mat-mdc-option {
  min-height: 32px;
}
.mat-button-toggle-label-content .mat-pseudo-checkbox {
  display: none !important;
}
.cdk-overlay-connected-position-bounding-box {
  position: absolute;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  min-width: 1px;
  min-height: 1px;
}
.cdk-overlay-connected-position-bounding-box .collapse-arrow {
  left: 35px !important;
  top: -25px;
  position: absolute;
}
.mat-mdc-menu-panel .mat-mdc-radio-button .mdc-form-field > label {
  font-family: gilroy-regular;
}
.empty-msg {
  font-size: 16px;
  text-align: center;
  font-family: "gilroy-regular";
  opacity: 0.6;
  line-height: 23px;
  padding: 40px 0;
}
.job-costing-container .width-100 .mat-mdc-card-header-text {
  width: 100%;
}
.notifications-icon .mat-badge-content,
.chat-icon .mat-badge-content {
  left: 12px !important;
  margin: 0 !important;
}
.job-costing-container table td.job-cost-custom-td {
  background-color: var(--grid-item-gray);
  padding: 0;
}
#dtCloudApp .circle-tick-outline polyline {
  stroke-width: 3 !important;
}
#dtCloudApp .circle-tick-outline circle {
  stroke-width: 2 !important;
}
.ng-select.ng-select-opened > .ng-select-container .ng-arrow {
  background-image: url(/assets/icons/arrow-drop-down.svg);
  border-width: unset;
  border: unset;
  border-radius: unset;
  transform: rotate(180deg);
  top: 0px;
}
.ng-select .ng-arrow-wrapper .ng-arrow {
  background-image: url(/assets/icons/arrow-drop-down.svg);
  background-repeat: no-repeat;
  width: 12px !important;
  height: 12px !important;
  position: relative;
  display: inline;
  border-width: unset;
  border: unset;
  border-radius: unset;
  top: 2px;
}
.newHeaderUI {
  border: 1px solid var(--silver);
  border-bottom: 1px solid var(--blue);
  font-size: 12px !important;
  text-transform: unset !important;
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  padding: 8px;
  background-color: #EBF4FB !important;
  color: var(--blue) !important;
  font-family: "gilroy-semi-bold";
}
.job-costing-table-container .newTableUI .detail-row .expanded-detail-row {
  border-left: none !important;
}
rollback table.newTableUI .detail-row tr:last-child td:first-child {
  border-bottom-left-radius: 0px !important;
}
table.newTableUI .detail-row tr:last-child td:last-child {
  border-bottom-right-radius: 0px !important;
}
.job-costing-table-container table.newTableUI th,
.job-costing-table-container table.newTableUI td {
  text-wrap-mode: nowrap;
}
#dtCloudApp .mat-mdc-menu-panel.labor-rate-menu {
  min-width: 350px;
}
.contract-information-currency-symbol {
  color: var(--navy) !important;
  font-size: 24px !important;
  font-family: gilroy-ultra-light !important;
  position: relative;
  bottom: 20px;
}
.contract-information-currency-whole {
  font-size: 48px;
  font-family: gilroy-regular !important;
  color: var(--navy) !important;
}
.contract-information-currency-decimal {
  font-size: 24px !important;
  font-family: gilroy-ultra-light !important;
  color: var(--navy) !important;
  position: relative;
  bottom: 20px;
}
.node {
  fill: steelblue;
  stroke: white;
  stroke-width: 2;
}
.group {
  fill: none;
  stroke: #999;
  stroke-dasharray: 5;
}
.edge {
  stroke: #888;
  stroke-width: 2;
}
.ios-list .mdc-label,
.ios-list .mdc-form-field {
  width: 100%;
}
#dtCloudApp ng-select.ng-select.custom-select.select-ios .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 220px;
}
.back-image {
  position: relative;
  height: 75px !important;
  width: 75px !important;
  min-width: 75px !important;
  max-height: 75px !important;
}
.chat-details p {
  padding: 5px;
}
.chat-details h1,
.chat-details h2,
.chat-details h3 {
  margin: 15px 0px;
}
.installer-view .commentNewIcon svg path,
.installer-view .edit-pen-icon svg path {
  stroke: var(--green-blue) !important;
}
.field-user-icon svg path,
.field-user-icon svg ellipse {
  stroke: #fff;
}
.field-user-icon.selected svg path,
.field-user-icon.selected svg ellipse {
  stroke: var(--green-blue) !important;
}
.project-review-allowance .ng-dropdown-panel {
  max-height: 220px;
}
.field-user-icon.selected svg path,
.field-user-icon.selected svg ellipse {
  stroke: var(--green-blue) !important;
}
#breadcrumb.breadcrumb-wizard li.select:before {
  border-bottom-width: 16px;
  max-height: 30px;
}
#breadcrumb.breadcrumb-wizard li.select:after {
  border-bottom-width: 16px;
  max-height: 30px;
}
svg.ic-svg {
  background-color: #fff !important;
}
.book-white-icon svg path {
  stroke: var(--white) !important;
}
.ic-bg-rect {
  stroke: transparent !important;
}
.zindex-3 {
  z-index: 3;
}
.zindex-5 {
  z-index: 5;
}
.zindex-4 {
  z-index: 4;
}
.zindex-6-i {
  z-index: 6 !important;
}
.-m-l-r-24 {
  margin-left: -24px !important;
  margin-right: -24px !important;
}
.overFlow-auto {
  overflow: auto !important;
}
.calendar-date-range-selection .mat-calendar-table-header th {
  text-indent: -12px;
}
.newTableUI-container {
  scrollbar-width: 1px;
}
.newTableUI-container::-webkit-scrollbar:vertical {
  width: 1px;
  background: transparent;
}
.newTableUI-container::-webkit-scrollbar-track {
  margin-top: 30px;
  width: 0px;
  background: transparent;
}
.newTableUI-container::-webkit-scrollbar-thumb {
  margin-top: 30px;
  border-radius: 5px;
  width: 0px !important;
}
.quote-banner-box {
  border-radius: 12px;
  height: 64px;
  width: 1002px;
  border: 1px solid var(--orange);
  background:
    linear-gradient(
      0deg,
      rgba(251, 128, 48, 0.08) 0%,
      rgba(251, 128, 48, 0.08) 100%),
    var(--Primary-color-white, var(--white));
}
.main-text a {
  color: #007ACC !important;
  text-decoration: none;
  font-family: gilroy-regular;
}
.connection-summary-dialog .mat-mdc-dialog-container {
  border-radius: 0px !important;
}
.content-truncate {
  display: inline-block;
  display: -webkit-inline-box;
  max-height: 100%;
  vertical-align: middle;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 1;
  text-overflow: ellipsis;
  letter-spacing: -0.1px;
}
.design-table-ui {
  border-right: 1px solid var(--Primary-color-divider-dark, #BDC4C7);
  background: #FFF;
}
.design-table-ui-border-radius {
  border-radius: 0 0 12px 12px;
  border-bottom: 1px solid var(--Primary-color-divider-dark, #BDC4C7);
}
.border-left-color-ui-quote {
  height: 40px;
  border-radius: 0px;
  width: 4px;
}
.item-display-ui-border-radius {
  border-radius: 0 0 12px 0px;
  border-bottom: 1px solid var(--Primary-color-divider-dark, #BDC4C7);
}
.design-table-last-item {
  border-radius: 0 0 12px 12px;
}
.grid-menu-container span.content-truncate {
  max-width: 200px;
  width: max-content;
  font-size: 14px;
}
span.link-text,
.text-link {
  color: #03ad71;
  cursor: pointer;
}
.text-green {
  color: #03ad71;
}
.text-blue {
  color: #007ACC;
}
.drawing.whiteboard .drawing-options.proposal-interconnect {
  min-width: 430px !important;
  margin-left: -215px !important;
}
.dt-dialog-map-io {
  min-width: 80% !important;
}
.text-capitalize {
  text-transform: capitalize !important;
}
.mat-drawer-backdrop.mat-drawer-shown {
  visibility: visible;
  background-color: var(--mat-sidenav-scrim-color);
}
.time-entry .mat-drawer-backdrop.mat-drawer-shown {
  visibility: visible;
  background-color: unset !important;
}
@media (min-width: 600px) and (max-width: 1024px) {
  .ppe-container .time-entry-drawer,
  .ppe-container .add-time-entry-drawer,
  .ppe-container .new-time-entry-drawer {
    width: calc(100vw - 100px - 32px) !important;
    max-width: calc(100vw - 100px - 32px) !important;
  }
  .side-nav-container.appsidenav-collapsed:not(.appsidenav-hidden) .time-entry-drawer,
  .side-nav-container.appsidenav-collapsed:not(.appsidenav-hidden) .add-time-entry-drawer,
  .side-nav-container.appsidenav-collapsed:not(.appsidenav-hidden) .new-time-entry-drawer {
    width: calc(100vw - 96px) !important;
    max-width: calc(100vw - 96px) !important;
  }
  .side-nav-container:not(.appsidenav-collapsed):not(.appsidenav-hidden) .time-entry-drawer,
  .side-nav-container:not(.appsidenav-collapsed):not(.appsidenav-hidden) .add-time-entry-drawer,
  .side-nav-container:not(.appsidenav-collapsed):not(.appsidenav-hidden) .new-time-entry-drawer {
    width: calc(100vw - 160px) !important;
    max-width: calc(100vw - 160px) !important;
  }
}
body[style*="position: fixed"] {
  position: static !important;
  overflow: auto !important;
  width: auto !important;
  top: auto !important;
}
.mat-mdc-checkbox.checkbox-filter-category .mdc-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
  width: 200px;
}
.schedule-popup {
  margin-top: -70px !important;
}
.io-item-search .input-search {
  min-width: 120px;
  max-width: 120px;
}
#dtCloudApp .discontinued-accessory-tooltip.mdc-tooltip .mdc-tooltip__surface {
  font-family: gilroy-regular !important;
  font-size: 12px !important;
  min-width: 220px;
}
@media (max-width: 375px) {
  .schedule-popup {
    width: 420px;
    overflow-x: auto;
    overflow-y: auto;
    margin-left: 0px;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    white-space: nowrap;
  }
  .schedule-popup:active {
    cursor: grabbing;
  }
}
#dtCloudApp #deleteConnectionContainer ng-select.ng-select.custom-select.select-ios .ng-dropdown-panel .ng-dropdown-panel-items {
  max-height: 97px;
}
.quote-labor-price {
  color: var(--color-text-secondary);
  text-align: right;
  font-family: "gilroy-medium" !important;
  font-size: 14px !important;
}
#dtCloudApp .labor-header .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup {
  color: var(--color-message) !important;
  font-family: gilroy-semi-bold !important;
  font-size: 12px !important;
  text-transform: none !important;
  padding: 0px !important;
  margin: 16px 16px 8px !important;
}
#dtCloudApp .labor-header .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup:not(:first-child) {
  border-top: 1px solid var(--color-divider);
  padding-top: 16px !important;
}
.opp-budget {
  height: 24px !important;
}
.connection-summary-dialog .mat-mdc-dialog-container .mdc-dialog__surface {
  overflow: hidden;
}
.connection-summary-dialog .table-container {
  max-height: calc(100vh - 30px) !important;
  padding-bottom: 35px;
}
.rotate-right {
  transform: rotate(270deg);
}
.rotate-down {
  transform: rotate(360deg);
}
.quote-table-ui-design {
  background-color: #F9FCFF !important;
  margin-left: 0px !important;
  border-left: 1px solid var(--silver) !important;
}
.copy-to-quote-dialog .mat-dialog-container {
  width: 95vw !important;
  max-width: 744px !important;
  padding: 0 !important;
}
.copy-to-quote-dialog .mat-mdc-dialog-container .mdc-dialog__surface {
  overflow: hidden !important;
}
.copy-to-quote-dialog .mat-mdc-dialog-container {
  border-radius: 0px !important;
}
@media (min-width: 600px) and (max-width: 768px) {
  .copy-to-quote-dialog .mat-mdc-dialog-container {
    margin: 16px !important;
  }
}
@media (min-width: 769px) and (max-width: 858px) {
  .copy-to-quote-dialog .close-btn {
    display: none !important;
  }
}
body.resizing {
  cursor: ew-resize !important;
}
.asset-table-paginator .pagination {
  padding: 20px 0 !important;
}
.asset-table-container,
table.newTableUI tbody tr td:last-child {
  border-right: 0px !important;
}
.asset-header,
.left-pills .mdc-button .mdc-button__label {
  justify-content: unset !important;
}
.recommended-label {
  text-align: center;
  font-size: 12px;
  color: var(--blue);
  margin-bottom: 6px;
  margin-left: 5px;
}
.schedule-popup::after {
  border: none !important;
}
.stage-right {
  border-left: 1px solid rgba(255, 255, 255, 1.2);
  justify-content: center;
  align-items: center;
  height: 20px;
  z-index: 5;
}
.table-name {
  font-size: 14px !important;
  font-family: gilroy-semi-bold;
  color: var(--navy);
}
.uppercase-label span.ng-option-label,
.uppercase-label input,
.uppercase-label .ng-value-label,
.uppercase-label .mdc-label {
  text-transform: uppercase;
}
.asset-item-error-field .mdc-text-field {
  border: 1px solid var(--red) !important;
  border-radius: 4px;
}
.editor-container-ql .ql-container {
  font-family: "gilroy-regular" !important;
  font-size: 14px !important;
  letter-spacing: 0px;
  line-height: 20px;
}
.ic-lgnd.ic-show {
  z-index: 100;
}
.right-0 {
  position: fixed !important;
  right: 0 !important;
  top: 57px;
}
#dtCloudApp .duplicate-border.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(.border-color):not(:disabled) {
  border: 1px solid var(--red) !important;
}
#dtCloudApp .duplicate-border.mat-mdc-input-element:focus {
  border: 1px solid var(--red) !important;
}
.popover-above {
  transform: translateY(0%) translateY(0px) !important;
}
.popover-below {
  transform: translateY(-20%) translateY(-15px) !important;
}
@media (min-width: 1280px) and (max-width: 1600px) {
  .popover-above.project-popover {
    transform: translateY(20%) translateY(0px) !important;
  }
}
.width200-i {
  width: 200px !important;
}
.highlight {
  background-color: #0cbb7d !important;
  color: #ffffff !important;
  padding: 2px 4px;
}
.dialog-types-ai .mat-mdc-dialog-content {
  padding: 20px !important;
}
.item-action-ai-sow {
  border-radius: 4px;
  background:
    linear-gradient(
      90deg,
      #0081BF 20%,
      #7AEB59 100%);
  color: #fff;
  height: 40px;
  align-items: center;
  place-content: center;
  display: flex;
  border-radius: 10px;
  margin-top: 20px !important;
  margin: auto;
  min-width: 120px;
  max-width: 224px;
  padding: 11px 21px 11px 22px;
  font-size: 14px;
  width: 150px;
  cursor: pointer;
}
.ai-sow-block {
  border-radius: 12px;
  border: 1px solid #E7ECF4;
  background: #FFF;
  text-align: center;
  padding: 30px;
  border-radius: 12px;
  background:
    linear-gradient(
      90deg,
      rgba(0, 149, 255, 0.05) 0%,
      rgba(122, 235, 89, 0.05) 100%);
  border: 0px !important;
  position: absolute;
  width: 850px;
  left: 50%;
  margin-left: -425px;
  top: 50%;
  margin-top: -90px;
}
.ai-sow-block p {
  font-family: gilroy-medium !important;
  font-size: 14px !important;
  color: #52627A;
  margin-top: 0px;
}
.ai-sow-block .place-content-center {
  place-content: center;
}
.ai-sow-block .span-heading-ai {
  font-family: gilroy-semi-bold !important;
  font-size: 16px !important;
  color: var(--black);
}
.ai-sow-block .btn-sow {
  border-radius: 4px;
  border: 2px solid #1DB77A !important;
  background: #FFFFFF !important;
  color: #1DB77A !important;
  text-align: center;
  font-family: Gilroy-medium !important;
  font-size: 14px;
  line-height: 14px;
  margin: auto;
  width: 145px;
  place-content: center;
  align-items: center;
}
.ai-sow-block .btn-sow.primary:not(:disabled) {
  background: #1DB77A !important;
  color: #FFFFFF !important;
}
.icon-select svg path {
  fill: var(--green-blue) !important;
}
.ai-sow-block .btn-sow.create-draft:disabled {
  color: #bdc4c7 !important;
  background-color: var(--white) !important;
  box-sizing: border-box;
  border: 2px solid #bdc4c7 !important;
  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.06) !important;
}
.sow-ai-content {
  height: calc(100vh - 200px);
  border-radius: 12px;
  border: 1px solid #E7ECF4;
  background: #FFF;
  height: calc(100vh - 200px);
  border-radius: 12px;
  border: 1px solid #E7ECF4;
  background: #FFF;
  position: relative;
}
.footer-ai-content {
  border-top: 1px solid #59CEDF;
  padding: 20px;
}
.footer-ai-content .header-text-ai {
  vertical-align: text-top;
  display: flex;
  align-items: center;
}
.sow-ai-content .ql-editor {
  position: 10px !important;
}
.btn-discard {
  background-color: #fff !important;
  border-color: #00b575 !important;
  color: #00b575 !important;
}
.sow-ai-content .description-editor {
  padding: 0 15px !important;
  margin-top: 0px !important;
  height: calc(100vh - 320px) !important;
}
.project-calendar-svg-fill svg path {
  fill: #0E1F38 !important;
  font-size: 20px !important;
}
.mat-mdc-menu-panel.inventory-download-menu {
  max-width: 312px;
}
.sow-ai-content .ql-mention-denotation-char {
  display: none !important;
}
.sow-ai-content .sow-editor-container {
  overflow: auto;
  height: 100%;
}
.sow-editor-container .toolbarIcons {
  position: sticky !important;
}
.sow-editor-container .toolbarIcons.disabled .ql-formats {
  pointer-events: none;
}
.mat-mdc-menu-panel.inventory-action-menu {
  max-width: 312px;
}
.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip .mdc-evolution-chip__cell--primary,
.mat-mdc-chip.mat-mdc-standard-chip.mdc-evolution-chip .mdc-evolution-chip__action--primary {
  overflow: visible;
}
.mat-drawer:not(.mat-drawer-opened) {
  display: none;
}
.proposal-download-menu-panel {
  max-width: unset !important;
}
#dtCloudApp .contact-input-height-24.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(#txtArea) {
  height: 24px !important;
  font-size: 13px !important;
  font-family: gilroy-regular !important;
  color: var(--navy) !important;
}
#dtCloudApp .contact-input-height-24.emailInput.mat-mdc-form-field-input-control.mat-mdc-form-field-input-control:not(#txtArea) {
  color: var(--cool-green) !important;
  font-family: gilroy-semi-bold !important;
}
.smsOptedIn-container.mat-mdc-select,
.smsOptedIn-container.mat-mdc-select .mat-mdc-select-trigger {
  height: 24px !important;
  line-height: 24px !important;
}
mat-drawer.filter-drawer .mat-drawer-inner-container {
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
#app-navigator.mat-mdc-list-base .mat-mdc-list-item .mdc-list-item__content {
  display: flex !important;
  flex-direction: row-reverse !important;
  align-items: center;
}
.auto-cad .sub-preview-body {
  padding: 20px;
  max-height: calc(100vh - 80px) !important;
  height: calc(100vh - 80px);
  overflow-y: scroll !important;
}
.ng-select.associated-project .ng-dropdown-panel {
  width: 200px !important;
  min-width: 200px !important;
}
.ng-select.associated-project.ng-select-single .ng-select-container .ng-value-container .ng-input {
  top: 0 !important;
}

/* node_modules/quill/dist/quill.core.css */
/*!
 * Quill Editor v1.3.7
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family:
    Helvetica,
    Arial,
    sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: "\2022";
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: "\2611";
}
.ql-editor ul[data-checked=false] > li::before {
  content: "\2610";
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) ". ";
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) ". ";
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) ". ";
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) ". ";
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family:
    Georgia,
    Times New Roman,
    serif;
}
.ql-editor .ql-font-monospace {
  font-family:
    Monaco,
    Courier New,
    monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0, 0, 0, 0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}

/* node_modules/quill/dist/quill.bubble.css */
/*!
 * Quill Editor v1.3.7
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family:
    Helvetica,
    Arial,
    sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: "\2022";
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: "\2611";
}
.ql-editor ul[data-checked=false] > li::before {
  content: "\2610";
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) ". ";
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) ". ";
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) ". ";
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) ". ";
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family:
    Georgia,
    Times New Roman,
    serif;
}
.ql-editor .ql-font-monospace {
  font-family:
    Monaco,
    Courier New,
    monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0, 0, 0, 0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-bubble.ql-toolbar:after,
.ql-bubble .ql-toolbar:after {
  clear: both;
  content: "";
  display: table;
}
.ql-bubble.ql-toolbar button,
.ql-bubble .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-bubble.ql-toolbar button svg,
.ql-bubble .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-bubble.ql-toolbar button:active:hover,
.ql-bubble .ql-toolbar button:active:hover {
  outline: none;
}
.ql-bubble.ql-toolbar input.ql-image[type=file],
.ql-bubble .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-bubble.ql-toolbar button:hover,
.ql-bubble .ql-toolbar button:hover,
.ql-bubble.ql-toolbar button:focus,
.ql-bubble .ql-toolbar button:focus,
.ql-bubble.ql-toolbar button.ql-active,
.ql-bubble .ql-toolbar button.ql-active,
.ql-bubble.ql-toolbar .ql-picker-label:hover,
.ql-bubble .ql-toolbar .ql-picker-label:hover,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active,
.ql-bubble.ql-toolbar .ql-picker-item:hover,
.ql-bubble .ql-toolbar .ql-picker-item:hover,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected {
  color: #fff;
}
.ql-bubble.ql-toolbar button:hover .ql-fill,
.ql-bubble .ql-toolbar button:hover .ql-fill,
.ql-bubble.ql-toolbar button:focus .ql-fill,
.ql-bubble .ql-toolbar button:focus .ql-fill,
.ql-bubble.ql-toolbar button.ql-active .ql-fill,
.ql-bubble .ql-toolbar button.ql-active .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-bubble.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: #fff;
}
.ql-bubble.ql-toolbar button:hover .ql-stroke,
.ql-bubble .ql-toolbar button:hover .ql-stroke,
.ql-bubble.ql-toolbar button:focus .ql-stroke,
.ql-bubble .ql-toolbar button:focus .ql-stroke,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-bubble.ql-toolbar button:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar button:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar button:focus .ql-stroke-miter,
.ql-bubble .ql-toolbar button:focus .ql-stroke-miter,
.ql-bubble.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-bubble .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: #fff;
}
@media (pointer: coarse) {
  .ql-bubble.ql-toolbar button:hover:not(.ql-active),
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) {
    color: #ccc;
  }
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    fill: #ccc;
  }
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    stroke: #ccc;
  }
}
.ql-bubble {
  box-sizing: border-box;
}
.ql-bubble * {
  box-sizing: border-box;
}
.ql-bubble .ql-hidden {
  display: none;
}
.ql-bubble .ql-out-bottom,
.ql-bubble .ql-out-top {
  visibility: hidden;
}
.ql-bubble .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-bubble .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-bubble .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-bubble .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-bubble .ql-formats:after {
  clear: both;
  content: "";
  display: table;
}
.ql-bubble .ql-stroke {
  fill: none;
  stroke: #ccc;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-bubble .ql-stroke-miter {
  fill: none;
  stroke: #ccc;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-bubble .ql-fill,
.ql-bubble .ql-stroke.ql-fill {
  fill: #ccc;
}
.ql-bubble .ql-empty {
  fill: none;
}
.ql-bubble .ql-even {
  fill-rule: evenodd;
}
.ql-bubble .ql-thin,
.ql-bubble .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-bubble .ql-transparent {
  opacity: 0.4;
}
.ql-bubble .ql-direction svg:last-child {
  display: none;
}
.ql-bubble .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-bubble .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-bubble .ql-editor h1 {
  font-size: 2em;
}
.ql-bubble .ql-editor h2 {
  font-size: 1.5em;
}
.ql-bubble .ql-editor h3 {
  font-size: 1.17em;
}
.ql-bubble .ql-editor h4 {
  font-size: 1em;
}
.ql-bubble .ql-editor h5 {
  font-size: 0.83em;
}
.ql-bubble .ql-editor h6 {
  font-size: 0.67em;
}
.ql-bubble .ql-editor a {
  text-decoration: underline;
}
.ql-bubble .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-bubble .ql-editor code,
.ql-bubble .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-bubble .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-bubble .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-bubble .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-bubble .ql-editor img {
  max-width: 100%;
}
.ql-bubble .ql-picker {
  color: #ccc;
  display: inline-block;
  float: left;
  font-size: 14px;
  font-weight: 500;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.ql-bubble .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-bubble .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-bubble .ql-picker-options {
  background-color: #444;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-bubble .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-label {
  color: #777;
  z-index: 2;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #777;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #777;
}
.ql-bubble .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-bubble .ql-color-picker,
.ql-bubble .ql-icon-picker {
  width: 28px;
}
.ql-bubble .ql-color-picker .ql-picker-label,
.ql-bubble .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-bubble .ql-color-picker .ql-picker-label svg,
.ql-bubble .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-bubble .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-bubble .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-bubble .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-bubble .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-bubble .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""])::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""])::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""])::before {
  content: attr(data-label);
}
.ql-bubble .ql-picker.ql-header {
  width: 98px;
}
.ql-bubble .ql-picker.ql-header .ql-picker-label::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item::before {
  content: "Normal";
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: "Heading 1";
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: "Heading 2";
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: "Heading 3";
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: "Heading 4";
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: "Heading 5";
}
.ql-bubble .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: "Heading 6";
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-bubble .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-bubble .ql-picker.ql-font {
  width: 108px;
}
.ql-bubble .ql-picker.ql-font .ql-picker-label::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item::before {
  content: "Sans Serif";
}
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: "Serif";
}
.ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: "Monospace";
}
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family:
    Georgia,
    Times New Roman,
    serif;
}
.ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family:
    Monaco,
    Courier New,
    monospace;
}
.ql-bubble .ql-picker.ql-size {
  width: 98px;
}
.ql-bubble .ql-picker.ql-size .ql-picker-label::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item::before {
  content: "Normal";
}
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: "Small";
}
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: "Large";
}
.ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: "Huge";
}
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-bubble .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-bubble .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-bubble .ql-toolbar .ql-formats {
  margin: 8px 12px 8px 0px;
}
.ql-bubble .ql-toolbar .ql-formats:first-child {
  margin-left: 12px;
}
.ql-bubble .ql-color-picker svg {
  margin: 1px;
}
.ql-bubble .ql-color-picker .ql-picker-item.ql-selected,
.ql-bubble .ql-color-picker .ql-picker-item:hover {
  border-color: #fff;
}
.ql-bubble .ql-tooltip {
  background-color: #444;
  border-radius: 25px;
  color: #fff;
}
.ql-bubble .ql-tooltip-arrow {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  content: " ";
  display: block;
  left: 50%;
  margin-left: -6px;
  position: absolute;
}
.ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow {
  border-bottom: 6px solid #444;
  top: -6px;
}
.ql-bubble .ql-tooltip.ql-flip .ql-tooltip-arrow {
  border-top: 6px solid #444;
  bottom: -6px;
}
.ql-bubble .ql-tooltip.ql-editing .ql-tooltip-editor {
  display: block;
}
.ql-bubble .ql-tooltip.ql-editing .ql-formats {
  visibility: hidden;
}
.ql-bubble .ql-tooltip-editor {
  display: none;
}
.ql-bubble .ql-tooltip-editor input[type=text] {
  background: transparent;
  border: none;
  color: #fff;
  font-size: 13px;
  height: 100%;
  outline: none;
  padding: 10px 20px;
  position: absolute;
  width: 100%;
}
.ql-bubble .ql-tooltip-editor a {
  top: 10px;
  position: absolute;
  right: 20px;
}
.ql-bubble .ql-tooltip-editor a:before {
  color: #ccc;
  content: "\d7";
  font-size: 16px;
  font-weight: bold;
}
.ql-container.ql-bubble:not(.ql-disabled) a {
  position: relative;
  white-space: nowrap;
}
.ql-container.ql-bubble:not(.ql-disabled) a::before {
  background-color: #444;
  border-radius: 15px;
  top: -5px;
  font-size: 12px;
  color: #fff;
  content: attr(href);
  font-weight: normal;
  overflow: hidden;
  padding: 5px 15px;
  text-decoration: none;
  z-index: 1;
}
.ql-container.ql-bubble:not(.ql-disabled) a::after {
  border-top: 6px solid #444;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  top: 0;
  content: " ";
  height: 0;
  width: 0;
}
.ql-container.ql-bubble:not(.ql-disabled) a::before,
.ql-container.ql-bubble:not(.ql-disabled) a::after {
  left: 0;
  margin-left: 50%;
  position: absolute;
  transform: translate(-50%, -100%);
  transition: visibility 0s ease 200ms;
  visibility: hidden;
}
.ql-container.ql-bubble:not(.ql-disabled) a:hover::before,
.ql-container.ql-bubble:not(.ql-disabled) a:hover::after {
  visibility: visible;
}

/* node_modules/quill/dist/quill.snow.css */
/*!
 * Quill Editor v1.3.7
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family:
    Helvetica,
    Arial,
    sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: "\2022";
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: "\2611";
}
.ql-editor ul[data-checked=false] > li::before {
  content: "\2610";
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) ". ";
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) ". ";
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) ". ";
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) ". ";
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) ". ";
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) ". ";
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family:
    Georgia,
    Times New Roman,
    serif;
}
.ql-editor .ql-font-monospace {
  font-family:
    Monaco,
    Courier New,
    monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0, 0, 0, 0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
  clear: both;
  content: "";
  display: table;
}
.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
  outline: none;
}
.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  color: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: #06c;
}
@media (pointer: coarse) {
  .ql-snow.ql-toolbar button:hover:not(.ql-active),
  .ql-snow .ql-toolbar button:hover:not(.ql-active) {
    color: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    fill: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    stroke: #444;
  }
}
.ql-snow {
  box-sizing: border-box;
}
.ql-snow * {
  box-sizing: border-box;
}
.ql-snow .ql-hidden {
  display: none;
}
.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
  visibility: hidden;
}
.ql-snow .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-snow .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-snow .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-snow .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-snow .ql-formats:after {
  clear: both;
  content: "";
  display: table;
}
.ql-snow .ql-stroke {
  fill: none;
  stroke: #444;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-snow .ql-stroke-miter {
  fill: none;
  stroke: #444;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: #444;
}
.ql-snow .ql-empty {
  fill: none;
}
.ql-snow .ql-even {
  fill-rule: evenodd;
}
.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-snow .ql-transparent {
  opacity: 0.4;
}
.ql-snow .ql-direction svg:last-child {
  display: none;
}
.ql-snow .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-snow .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-snow .ql-editor h1 {
  font-size: 2em;
}
.ql-snow .ql-editor h2 {
  font-size: 1.5em;
}
.ql-snow .ql-editor h3 {
  font-size: 1.17em;
}
.ql-snow .ql-editor h4 {
  font-size: 1em;
}
.ql-snow .ql-editor h5 {
  font-size: 0.83em;
}
.ql-snow .ql-editor h6 {
  font-size: 0.67em;
}
.ql-snow .ql-editor a {
  text-decoration: underline;
}
.ql-snow .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-snow .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-snow .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-snow .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-snow .ql-editor img {
  max-width: 100%;
}
.ql-snow .ql-picker {
  color: #444;
  display: inline-block;
  float: left;
  font-size: 14px;
  font-weight: 500;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.ql-snow .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-snow .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-snow .ql-picker-options {
  background-color: #fff;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-snow .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  color: #ccc;
  z-index: 2;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
  width: 28px;
}
.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-snow .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-snow .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-snow .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""])::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""])::before {
  content: attr(data-label);
}
.ql-snow .ql-picker.ql-header {
  width: 98px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
  content: "Normal";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: "Heading 1";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: "Heading 2";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: "Heading 3";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: "Heading 4";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: "Heading 5";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: "Heading 6";
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-snow .ql-picker.ql-font {
  width: 108px;
}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
  content: "Sans Serif";
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: "Serif";
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: "Monospace";
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family:
    Georgia,
    Times New Roman,
    serif;
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family:
    Monaco,
    Courier New,
    monospace;
}
.ql-snow .ql-picker.ql-size {
  width: 98px;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: "Normal";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: "Small";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: "Large";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: "Huge";
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-snow .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-snow .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-toolbar.ql-snow {
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-family:
    "Helvetica Neue",
    "Helvetica",
    "Arial",
    sans-serif;
  padding: 8px;
}
.ql-toolbar.ql-snow .ql-formats {
  margin-right: 15px;
}
.ql-toolbar.ql-snow .ql-picker-label {
  border: 1px solid transparent;
}
.ql-toolbar.ql-snow .ql-picker-options {
  border: 1px solid transparent;
  box-shadow: rgba(0, 0, 0, 0.2) 0 2px 8px;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
  border-color: #000;
}
.ql-toolbar.ql-snow + .ql-container.ql-snow {
  border-top: 0px;
}
.ql-snow .ql-tooltip {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0px 0px 5px #ddd;
  color: #444;
  padding: 5px 12px;
  white-space: nowrap;
}
.ql-snow .ql-tooltip::before {
  content: "Visit URL:";
  line-height: 26px;
  margin-right: 8px;
}
.ql-snow .ql-tooltip input[type=text] {
  display: none;
  border: 1px solid #ccc;
  font-size: 13px;
  height: 26px;
  margin: 0px;
  padding: 3px 5px;
  width: 170px;
}
.ql-snow .ql-tooltip a.ql-preview {
  display: inline-block;
  max-width: 200px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.ql-snow .ql-tooltip a.ql-action::after {
  border-right: 1px solid #ccc;
  content: "Edit";
  margin-left: 16px;
  padding-right: 8px;
}
.ql-snow .ql-tooltip a.ql-remove::before {
  content: "Remove";
  margin-left: 8px;
}
.ql-snow .ql-tooltip a {
  line-height: 26px;
}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
  display: none;
}
.ql-snow .ql-tooltip.ql-editing input[type=text] {
  display: inline-block;
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
  border-right: 0px;
  content: "Save";
  padding-right: 0px;
}
.ql-snow .ql-tooltip[data-mode=link]::before {
  content: "Enter link:";
}
.ql-snow .ql-tooltip[data-mode=formula]::before {
  content: "Enter formula:";
}
.ql-snow .ql-tooltip[data-mode=video]::before {
  content: "Enter video:";
}
.ql-snow a {
  color: #06c;
}
.ql-container.ql-snow {
  border: 1px solid #ccc;
}

/* node_modules/quill-emoji/dist/quill-emoji.css */
#quill-editor {
  position: relative;
}
.mention {
  color: #0366d6;
}
.completions {
  background: #fff;
  border-radius: 2px;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, .25);
  list-style: none;
}
.completions,
.completions > li {
  margin: 0;
  padding: 0;
}
.completions > li > button {
  background: none;
  border: none;
  box-sizing: border-box;
  display: block;
  height: 2em;
  margin: 0;
  padding: .25em .5em;
  text-align: left;
  width: 100%;
}
.completions > li > button:hover {
  background: #ddd;
}
.completions > li > button:focus {
  background: #ddd;
  outline: none;
}
.completions > li > button > .matched {
  color: #000;
  font-weight: 700;
}
.completions > li > button > * {
  vertical-align: middle;
}
.emoji_completions {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 3px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .12);
  list-style: none;
  margin: 0;
  padding: 6px;
}
.emoji_completions li {
  display: inline-block;
  margin: 2px 0;
  padding: 0;
}
.emoji_completions li:not(:last-of-type) {
  margin-right: 3px;
}
.emoji_completions > li > button {
  background: #efefef;
  border: none;
  border-radius: 3px;
  box-sizing: border-box;
  display: block;
  margin: 0;
  padding: 3px 2px 6px;
  text-align: left;
  width: 100%;
}
.emoji_completions > li > button:hover {
  background: #2d9ee0;
  color: #fff;
}
.emoji_completions > li > button:focus {
  background: #2d9ee0;
  color: #fff;
  outline: none;
}
.emoji_completions > li > button.emoji-active {
  background: red;
  background: #2d9ee0;
  color: #fff;
  outline: none;
}
.emoji_completions > li > button > .matched {
  font-weight: 700;
}
.emoji_completions > li > button > *,
.ico {
  vertical-align: middle;
}
.ico {
  font-size: 18px;
  line-height: 0;
  margin-right: 5px;
}
#emoji-palette {
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 3px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .12);
  max-width: 250px;
  position: absolute;
  z-index: 999;
}
.bem {
  cursor: pointer;
  display: inline-block;
  font-size: 24px;
  margin: 2px;
  text-align: center;
  width: 34px;
}
#tab-filters {
  margin: 20px auto 0;
  width: 210px;
}
.emoji-tab {
  cursor: pointer;
  display: inline-table;
  height: 100%;
  min-height: 30px;
  text-align: center;
  width: 30px;
}
#tab-toolbar {
  background-color: #f7f7f7;
  border-bottom: 1px solid rgba(0, 0, 0, .15);
  padding: 4px 4px 0;
}
#tab-toolbar ul {
  margin: 0;
  padding: 0;
}
#tab-toolbar .active {
  border-bottom: 3px solid #2ab27b;
}
#tab-panel {
  background: #fff;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-height: 220px;
  overflow-y: scroll;
  padding: 2px;
}
#quill-editor x-contain,
contain {
  background: #fb8;
  display: block;
}
#quill-editor table {
  border-collapse: collapse;
  width: 100%;
}
#quill-editor table td {
  border: 1px solid #000;
  height: 25px;
  padding: 5px;
}
.ql-picker.ql-table .ql-picker-label:before,
button.ql-table:after {
  content: "TABLE";
}
button.ql-contain:after {
  content: "WRAP";
}
button.ql-table[value=append-row]:after {
  content: "ROWS+";
}
button.ql-table[value=append-col]:after {
  content: "COLS+";
}
.ql-contain,
.ql-table {
  margin-right: -15px;
  width: auto !important;
}
#emoji-close-div {
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
}
.textarea-emoji-control {
  height: 25px;
  right: 4px;
  top: 10px;
  width: 25px;
}
#textarea-emoji {
  border: 1px solid #66afe9;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 3px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .12);
  max-width: 250px;
  position: absolute;
  right: 0;
  z-index: 999;
}
.ql-editor {
  padding-right: 26px;
}
.i-activity {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70"><g transform="translate(7.500000, 7.500000)"><path stroke="%236F6D70" d="M18.02 1.36c5.92 3.02 8.28 10.26 5.26 16.18-2.12 4.17-6.35 6.57-10.73 6.57-1.83 0-3.7-.4-5.45-1.3-5.9-3-8.27-10.22-5.25-16.2C3.97 2.5 8.2.1 12.57.1c1.84 0 3.7.42 5.45 1.3zm4.7 11.44c.1-1.3-.06-2.6-.47-3.87-.13-.38-.27-.75-.43-1.1l-3.42-1.6-1.57-3.4c-.62-.3-1.27-.5-1.92-.68-.7-.18-1.5-.27-2.3-.27-.4 0-.8.02-1.2.06L8.9 4.74l-3.74.43c-.63.68-1.16 1.45-1.6 2.28-.42.84-.72 1.72-.9 2.63l1.84 3.3-.74 3.68c.3.56.66 1.08 1.1 1.58.76.94 1.7 1.7 2.8 2.32l3.7-.74 3.26 1.84c1.13-.23 2.23-.65 3.24-1.26.6-.35 1.2-.77 1.7-1.24l.44-3.74 2.78-2.55.05-.47z" stroke-linecap="round" stroke-linejoin="round"/><polygon points="10.6158689 8.50666885 8.42649168 12.8046921 11.836847 16.2129328 16.1342124 14.0235556 15.3793892 9.26144504"/></g></g></g></svg>');
}
.i-activity,
.i-flags {
  content: "";
  height: 25px;
  margin: auto;
  width: 25px;
}
.i-flags {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70" fill-rule="nonzero"><g transform="translate(9.500000, 8.000000)"><path d="M.5 3.13V23.5c0 .83.68 1.5 1.5 1.5.84 0 1.5-.67 1.5-1.5V3.14c0-.83-.66-1.5-1.5-1.5-.82 0-1.5.67-1.5 1.5z"/><path d="M3.5 11.54c.7-.16 1.44-.22 2.25-.17 1.38.07 2.48.3 5.23 1.04l.55.2c3.02.8 4.77 1 5.96.67v-7.9c-1.7.33-3.8-.07-7.1-1-3.9-1.1-5.7-1.3-6.9-.5v7.7zm7.68-10.1c4.1 1.15 5.7 1.3 6.98.44 1-.66 2.33.05 2.33 1.25v11c0 .5-.3 1-.7 1.26-2.2 1.4-4.6 1.2-9.1 0l-.56-.16c-4.54-1.2-6.15-1.3-7.05-.2-.9 1.06-2.65.42-2.65-.98v-11c0-.4.2-.8.5-1.1C3.4-.24 5.75-.1 11.2 1.4z"/></g></g></g></svg>');
}
.i-food {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70"><path fill-rule="nonzero" d="M9.57 28.2c0 .28.22.5.5.5h19.2c.27 0 .5-.22.5-.5v-4.4H9.57v4.4zm23.2-3.06v3.07c0 1.95-1.57 3.5-3.5 3.5h-19.2c-1.93 0-3.5-1.55-3.5-3.5V25c.46.15.96.24 1.47.24h23.78c.33 0 .64-.04.94-.1z"/><path fill-rule="nonzero" d="M6.57 18.2v-3.45c0-3.56 2.9-6.45 6.45-6.45h13.3c3.55 0 6.44 2.9 6.44 6.45v3.45H6.56zm3-1.83h3.6l.4.86c.23.5.73.83 1.3.83.56 0 1.06-.33 1.3-.83l.4-.86h13.2v-1.62c0-1.9-1.56-3.45-3.45-3.45h-13.3c-1.9 0-3.45 1.55-3.45 3.45v1.62z"/><path fill-rule="nonzero" d="M13.23 16.37l.4.86c.24.5.74.83 1.3.83.57 0 1.07-.33 1.3-.83l.4-.86H31.9c2.44 0 4.43 1.98 4.43 4.43 0 2.45-1.98 4.44-4.44 4.44H8.1c-2.44 0-4.43-2-4.43-4.44 0-2.45 1.98-4.43 4.44-4.43h5.14zm-5.12 3c-.8 0-1.42.64-1.42 1.43 0 .8.64 1.44 1.44 1.44h23.8c.8 0 1.43-.64 1.43-1.44 0-.8-.64-1.43-1.44-1.43H18.4c-.83 1.04-2.1 1.7-3.5 1.7-1.37 0-2.65-.66-3.47-1.7H8.1z"/><circle cx="14.6682646" cy="13.75" r="1"/><circle cx="24.6682646" cy="13.75" r="1"/><circle cx="19.6682646" cy="13.75" r="1"/></g></g></svg>');
}
.i-food,
.i-nature {
  content: "";
  height: 25px;
  margin: auto;
  width: 25px;
}
.i-nature {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70" fill-rule="nonzero"><path d="M15.96 18.26L30.86 32c.5.46 1.3.43 1.77-.08.46-.5.43-1.3-.08-1.76l-14.9-13.74c-.5-.46-1.3-.43-1.76.08-.5.5-.5 1.3 0 1.76z"/><path d="M18.17 21.28c-.7-.06-1.3.45-1.35 1.14-.06.7.45 1.3 1.13 1.35l4.96.43c.9.07 1.5-.66 1.4-1.47l-1-5.6c-.1-.7-.74-1.14-1.42-1.02-.67.2-1.12.8-1 1.5l.7 4-3.32-.3z"/><path d="M28.48 28.95c-.38.17-1 .4-1.85.64-2.92.7-6 .9-8.95-.2-5.98-2.17-9.8-8.5-10.54-19.9l-.1-1.4 1.38-.2c14.45-2.08 23.4 7.4 21.33 19.85l-1.9-.3.63 1.43zM10.24 10.77C11.12 20.14 14.2 25 18.7 26.6c2.27.83 4.76.74 7.14.1.4-.12.76-.23 1.07-.35 1.2-9.6-5.4-16.57-16.6-15.58z"/></g></g></svg>');
}
.i-objects {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70" fill-rule="nonzero"><path d="M11.04 16.7c0-4.85 4.02-8.76 8.96-8.76 4.94 0 8.96 3.9 8.96 8.76 0 2.54-1.12 4.9-3 6.54v1.87c0 1.28-1.02 2.27-2.26 2.27h-7.37c-1.23 0-2.25-1-2.25-2.22V23.3c-1.9-1.65-3.04-4-3.04-6.58zm11.9 5.82c0-.48.24-.93.63-1.22 1.5-1.08 2.4-2.77 2.4-4.6 0-3.17-2.67-5.76-5.97-5.76s-5.96 2.6-5.96 5.76c0 1.84.9 3.54 2.42 4.62.4.28.62.74.62 1.22v1.8h5.87V22.5z"/><path d="M21.76 28.78c-.22.05-.42.1-.62.13-.5.1-.9.2-1.1.2-.24 0-.62-.04-1.08-.12l-.74-.15-.08-.02v-2.93c0-.83-.68-1.5-1.5-1.5-.83 0-1.5.67-1.5 1.5v4.1c0 .68.44 1.27 1.1 1.45l.38.1.94.23c.3.1.6.15.87.2.62.1 1.16.17 1.6.17.47 0 1.03-.1 1.7-.2l.7-.17.95-.22c.18-.03.32-.1.4-.1.64-.2 1.08-.76 1.08-1.43v-4.1c0-.83-.67-1.5-1.5-1.5-.82 0-1.5.67-1.5 1.5v2.9c-.03 0-.07 0-.1.02z"/></g></g></svg>');
}
.i-objects,
.i-people {
  content: "";
  height: 25px;
  margin: auto;
  width: 25px;
}
.i-people {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70"><path fill-rule="nonzero" d="M20 34c-7.73 0-14-6.27-14-14S12.27 6 20 6s14 6.27 14 14-6.27 14-14 14zm0-3c6.08 0 11-4.92 11-11S26.08 9 20 9 9 13.92 9 20s4.92 11 11 11z"/><circle cx="15.3474348" cy="16.7705459" r="2.34743481"/><circle cx="24.4703784" cy="16.7705459" r="2.34743481"/><path d="M20 27.9c2.7 0 4.88-2.18 4.88-4.88 0-2.7-9.76-2.7-9.76 0S17.3 27.9 20 27.9z"/></g></g></svg>');
}
.i-symbols {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70" fill-rule="nonzero"><path d="M15.37 7.95c-4.48 0-8.06 3.9-8.06 8.64 0 3.5 2.2 6.9 5.8 10.3 1.2 1.1 2.5 2.2 3.9 3.1.84.6 1.5 1 1.98 1.3l.27.15.8.5 1.1-.6c.5-.27 1.18-.7 2-1.25 1.34-.9 2.66-1.9 3.9-3 3.57-3.28 5.75-6.8 5.75-10.6 0-4.74-3.6-8.65-8.1-8.65v3.3c2.6 0 4.76 2.4 4.76 5.35 0 2.65-1.72 5.43-4.7 8.13-1.1 1-2.27 1.9-3.5 2.7-.43.3-.83.54-1.17.74-.35-.2-.76-.5-1.2-.83-1.24-.87-2.4-1.83-3.54-2.87-2.95-2.76-4.7-5.5-4.7-7.9 0-2.98 2.2-5.35 4.78-5.35 1.3 0 2.5.6 3.4 1.6L20 14.3l1.25-1.43c.9-1.03 2.1-1.6 3.38-1.6v-3.3c-1.68 0-3.3.56-4.63 1.57-1.34-1-2.95-1.57-4.63-1.57z"/></g></g></svg>');
}
.i-symbols,
.i-travel {
  content: "";
  height: 25px;
  margin: auto;
  width: 25px;
}
.i-travel {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="25px" height="25px" viewBox="0 0 40 40"><g fill="none" fill-rule="evenodd"><g fill="%236F6D70" fill-rule="nonzero"><path d="M25.46 11.2s-2.67 2.58-3.94 3.95l-10.6-2.13c-.12-.02-.25.04-.3.15l-.8 1.6c-.07.13 0 .3.12.37l7.75 3.88L13.4 24c-.5-.16-1.1-.33-1.66-.3-.3 0-.6.06-.85.25-.3.2-.4.5-.4.9s.1.74.3.98l3.2 3.23c.3.23.7.34 1 .34.4 0 .7-.13.9-.37.2-.23.24-.53.25-.84 0-.6-.15-1.2-.3-1.7l4.97-4.3 3.9 7.76c.06.13.23.2.36.12l1.6-.8c.13-.07.2-.2.17-.3l-2.12-10.6c1.4-1.28 3.95-3.95 3.96-3.96.86-.88 1.4-1.93 1.4-2.87 0-.5-.17-1-.5-1.33-.37-.36-.87-.5-1.38-.5-.95 0-2 .52-2.88 1.4zm2.87-4.4c1.28 0 2.54.44 3.5 1.4.93.93 1.38 2.2 1.38 3.47 0 1.8-.8 3.54-2.2 4.94-.4.5-1.7 1.8-2.8 2.9l1.8 9c.3 1.5-.4 2.9-1.7 3.6l-1.62.8c-1.62.8-3.6.1-4.36-1.4L20 27.1l-.7.6v.62c-.03.92-.28 1.8-.92 2.6-.8 1-1.98 1.5-3.22 1.5-1.03 0-2.12-.37-2.96-1.1l-.16-.14-3.22-3.22-.1-.12c-.75-.83-1.12-1.9-1.12-3 0-1.24.5-2.43 1.48-3.22.8-.6 1.68-.9 2.62-.9h.62l.6-.7-4.27-2.1c-1.65-.8-2.33-2.8-1.52-4.4l.8-1.64c.67-1.3 2.14-2.02 3.57-1.73l9 1.8 1.36-1.33 1.5-1.48c1.42-1.4 3.17-2.27 4.97-2.27z"/></g></g></svg>');
}
.button-emoji {
  margin-bottom: -5px;
}
.ql-emojiblot {
  display: inline-block;
  vertical-align: text-top;
}
.ap {
  background-image: url("./media/1e7b63404cd2fb8e6525b2fd4ee4d286-K5USY4HD.png");
  background-repeat: no-repeat;
  background-size: 820px;
  box-sizing: border-box;
  display: inline-flex;
  font-size: 20px;
  height: 20px;
  line-height: 1;
  margin-top: -3px;
  overflow: hidden;
  text-indent: -999px;
  width: 20px;
}
.ap-copyright {
  background-position: 0 0;
}
.ap-registered {
  background-position: 0 -20px;
}
.ap-bangbang {
  background-position: 0 -40px;
}
.ap-interrobang {
  background-position: 0 -60px;
}
.ap-tm {
  background-position: 0 -80px;
}
.ap-information_source {
  background-position: 0 -100px;
}
.ap-left_right_arrow {
  background-position: 0 -120px;
}
.ap-arrow_up_down {
  background-position: 0 -140px;
}
.ap-arrow_upper_left {
  background-position: 0 -160px;
}
.ap-arrow_upper_right {
  background-position: 0 -180px;
}
.ap-arrow_lower_right {
  background-position: 0 -200px;
}
.ap-arrow_lower_left {
  background-position: 0 -220px;
}
.ap-leftwards_arrow_with_hook {
  background-position: 0 -240px;
}
.ap-arrow_right_hook {
  background-position: 0 -260px;
}
.ap-watch {
  background-position: 0 -280px;
}
.ap-hourglass {
  background-position: 0 -300px;
}
.ap-keyboard {
  background-position: 0 -320px;
}
.ap-fast_forward {
  background-position: 0 -360px;
}
.ap-rewind {
  background-position: 0 -380px;
}
.ap-arrow_double_up {
  background-position: 0 -400px;
}
.ap-arrow_double_down {
  background-position: 0 -420px;
}
.ap-black_right_pointing_double_triangle_with_vertical_bar {
  background-position: 0 -440px;
}
.ap-black_left_pointing_double_triangle_with_vertical_bar {
  background-position: 0 -460px;
}
.ap-black_right_pointing_triangle_with_double_vertical_bar {
  background-position: 0 -480px;
}
.ap-alarm_clock {
  background-position: 0 -500px;
}
.ap-stopwatch {
  background-position: 0 -520px;
}
.ap-timer_clock {
  background-position: 0 -540px;
}
.ap-hourglass_flowing_sand {
  background-position: 0 -560px;
}
.ap-double_vertical_bar {
  background-position: 0 -580px;
}
.ap-black_square_for_stop {
  background-position: 0 -600px;
}
.ap-black_circle_for_record {
  background-position: 0 -620px;
}
.ap-m {
  background-position: 0 -640px;
}
.ap-black_small_square {
  background-position: 0 -660px;
}
.ap-white_small_square {
  background-position: 0 -680px;
}
.ap-arrow_forward {
  background-position: 0 -700px;
}
.ap-arrow_backward {
  background-position: 0 -720px;
}
.ap-white_medium_square {
  background-position: 0 -740px;
}
.ap-black_medium_square {
  background-position: 0 -760px;
}
.ap-white_medium_small_square {
  background-position: 0 -780px;
}
.ap-black_medium_small_square {
  background-position: 0 -800px;
}
.ap-sunny {
  background-position: -20px 0;
}
.ap-cloud {
  background-position: -20px -20px;
}
.ap-umbrella {
  background-position: -20px -40px;
}
.ap-snowman {
  background-position: -20px -60px;
}
.ap-comet {
  background-position: -20px -80px;
}
.ap-phone,
.ap-telephone {
  background-position: -20px -100px;
}
.ap-ballot_box_with_check {
  background-position: -20px -120px;
}
.ap-umbrella_with_rain_drops {
  background-position: -20px -140px;
}
.ap-coffee {
  background-position: -20px -160px;
}
.ap-shamrock {
  background-position: -20px -180px;
}
.ap-point_up {
  background-position: -20px -200px;
}
.ap-skull_and_crossbones {
  background-position: -20px -320px;
}
.ap-radioactive_sign {
  background-position: -20px -340px;
}
.ap-biohazard_sign {
  background-position: -20px -360px;
}
.ap-orthodox_cross {
  background-position: -20px -380px;
}
.ap-star_and_crescent {
  background-position: -20px -400px;
}
.ap-peace_symbol {
  background-position: -20px -420px;
}
.ap-yin_yang {
  background-position: -20px -440px;
}
.ap-wheel_of_dharma {
  background-position: -20px -460px;
}
.ap-white_frowning_face {
  background-position: -20px -480px;
}
.ap-relaxed {
  background-position: -20px -500px;
}
.ap-aries {
  background-position: -20px -520px;
}
.ap-taurus {
  background-position: -20px -540px;
}
.ap-gemini {
  background-position: -20px -560px;
}
.ap-cancer {
  background-position: -20px -580px;
}
.ap-leo {
  background-position: -20px -600px;
}
.ap-virgo {
  background-position: -20px -620px;
}
.ap-libra {
  background-position: -20px -640px;
}
.ap-scorpius {
  background-position: -20px -660px;
}
.ap-sagittarius {
  background-position: -20px -680px;
}
.ap-capricorn {
  background-position: -20px -700px;
}
.ap-aquarius {
  background-position: -20px -720px;
}
.ap-pisces {
  background-position: -20px -740px;
}
.ap-spades {
  background-position: -20px -760px;
}
.ap-clubs {
  background-position: -20px -780px;
}
.ap-hearts {
  background-position: -20px -800px;
}
.ap-diamonds {
  background-position: -40px 0;
}
.ap-hotsprings {
  background-position: -40px -20px;
}
.ap-recycle {
  background-position: -40px -40px;
}
.ap-wheelchair {
  background-position: -40px -60px;
}
.ap-hammer_and_pick {
  background-position: -40px -80px;
}
.ap-anchor {
  background-position: -40px -100px;
}
.ap-crossed_swords {
  background-position: -40px -120px;
}
.ap-scales {
  background-position: -40px -140px;
}
.ap-alembic {
  background-position: -40px -160px;
}
.ap-gear {
  background-position: -40px -180px;
}
.ap-atom_symbol {
  background-position: -40px -200px;
}
.ap-fleur_de_lis {
  background-position: -40px -220px;
}
.ap-warning {
  background-position: -40px -240px;
}
.ap-zap {
  background-position: -40px -260px;
}
.ap-white_circle {
  background-position: -40px -280px;
}
.ap-black_circle {
  background-position: -40px -300px;
}
.ap-coffin {
  background-position: -40px -320px;
}
.ap-funeral_urn {
  background-position: -40px -340px;
}
.ap-soccer {
  background-position: -40px -360px;
}
.ap-baseball {
  background-position: -40px -380px;
}
.ap-snowman_without_snow {
  background-position: -40px -400px;
}
.ap-partly_sunny {
  background-position: -40px -420px;
}
.ap-thunder_cloud_and_rain {
  background-position: -40px -440px;
}
.ap-ophiuchus {
  background-position: -40px -460px;
}
.ap-pick {
  background-position: -40px -480px;
}
.ap-helmet_with_white_cross {
  background-position: -40px -500px;
}
.ap-chains {
  background-position: -40px -520px;
}
.ap-no_entry {
  background-position: -40px -540px;
}
.ap-shinto_shrine {
  background-position: -40px -560px;
}
.ap-church {
  background-position: -40px -580px;
}
.ap-mountain {
  background-position: -40px -600px;
}
.ap-beach_umbrella,
.ap-umbrella_on_ground {
  background-position: -40px -620px;
}
.ap-fountain {
  background-position: -40px -640px;
}
.ap-golf {
  background-position: -40px -660px;
}
.ap-ferry {
  background-position: -40px -680px;
}
.ap-boat {
  background-position: -40px -700px;
}
.ap-skier {
  background-position: -40px -720px;
}
.ap-ice_skate {
  background-position: -40px -740px;
}
.ap-person_with_ball {
  background-position: -40px -760px;
}
.ap-tent {
  background-position: -60px -60px;
}
.ap-fuelpump {
  background-position: -60px -80px;
}
.ap-scissors {
  background-position: -60px -100px;
}
.ap-white_check_mark {
  background-position: -60px -120px;
}
.ap-airplane {
  background-position: -60px -140px;
}
.ap-email {
  background-position: -60px -160px;
}
.ap-fist {
  background-position: -60px -180px;
}
.ap-hand {
  background-position: -60px -300px;
}
.ap-v {
  background-position: -60px -420px;
}
.ap-writing_hand {
  background-position: -60px -540px;
}
.ap-pencil2 {
  background-position: -60px -660px;
}
.ap-black_nib {
  background-position: -60px -680px;
}
.ap-heavy_check_mark {
  background-position: -60px -700px;
}
.ap-heavy_multiplication_x {
  background-position: -60px -720px;
}
.ap-latin_cross {
  background-position: -60px -740px;
}
.ap-star_of_david {
  background-position: -60px -760px;
}
.ap-sparkles {
  background-position: -60px -780px;
}
.ap-eight_spoked_asterisk {
  background-position: -60px -800px;
}
.ap-eight_pointed_black_star {
  background-position: -80px 0;
}
.ap-snowflake {
  background-position: -80px -20px;
}
.ap-sparkle {
  background-position: -80px -40px;
}
.ap-x {
  background-position: -80px -60px;
}
.ap-negative_squared_cross_mark {
  background-position: -80px -80px;
}
.ap-question {
  background-position: -80px -100px;
}
.ap-grey_question {
  background-position: -80px -120px;
}
.ap-grey_exclamation {
  background-position: -80px -140px;
}
.ap-exclamation {
  background-position: -80px -160px;
}
.ap-heavy_heart_exclamation_mark_ornament {
  background-position: -80px -180px;
}
.ap-heart {
  background-position: -80px -200px;
}
.ap-heavy_plus_sign {
  background-position: -80px -220px;
}
.ap-heavy_minus_sign {
  background-position: -80px -240px;
}
.ap-heavy_division_sign {
  background-position: -80px -260px;
}
.ap-arrow_right {
  background-position: -80px -280px;
}
.ap-curly_loop {
  background-position: -80px -300px;
}
.ap-loop {
  background-position: -80px -320px;
}
.ap-arrow_heading_up {
  background-position: -80px -340px;
}
.ap-arrow_heading_down {
  background-position: -80px -360px;
}
.ap-arrow_left {
  background-position: -80px -380px;
}
.ap-arrow_up {
  background-position: -80px -400px;
}
.ap-arrow_down {
  background-position: -80px -420px;
}
.ap-black_large_square {
  background-position: -80px -440px;
}
.ap-white_large_square {
  background-position: -80px -460px;
}
.ap-star {
  background-position: -80px -480px;
}
.ap-o {
  background-position: -80px -500px;
}
.ap-wavy_dash {
  background-position: -80px -520px;
}
.ap-part_alternation_mark {
  background-position: -80px -540px;
}
.ap-congratulations {
  background-position: -80px -560px;
}
.ap-secret {
  background-position: -80px -580px;
}
.ap-mahjong {
  background-position: -80px -600px;
}
.ap-black_joker {
  background-position: -80px -620px;
}
.ap-a {
  background-position: -80px -640px;
}
.ap-b {
  background-position: -80px -660px;
}
.ap-o2 {
  background-position: -80px -680px;
}
.ap-parking {
  background-position: -80px -700px;
}
.ap-ab {
  background-position: -80px -720px;
}
.ap-cl {
  background-position: -80px -740px;
}
.ap-cool {
  background-position: -80px -760px;
}
.ap-free {
  background-position: -80px -780px;
}
.ap-id {
  background-position: -80px -800px;
}
.ap-new {
  background-position: -100px 0;
}
.ap-ng {
  background-position: -100px -20px;
}
.ap-ok {
  background-position: -100px -40px;
}
.ap-sos {
  background-position: -100px -60px;
}
.ap-up {
  background-position: -100px -80px;
}
.ap-vs {
  background-position: -100px -100px;
}
.ap-koko {
  background-position: -100px -120px;
}
.ap-sa {
  background-position: -100px -140px;
}
.ap-u7121 {
  background-position: -100px -160px;
}
.ap-u6307 {
  background-position: -100px -180px;
}
.ap-u7981 {
  background-position: -100px -200px;
}
.ap-u7a7a {
  background-position: -100px -220px;
}
.ap-u5408 {
  background-position: -100px -240px;
}
.ap-u6e80 {
  background-position: -100px -260px;
}
.ap-u6709 {
  background-position: -100px -280px;
}
.ap-u6708 {
  background-position: -100px -300px;
}
.ap-u7533 {
  background-position: -100px -320px;
}
.ap-u5272 {
  background-position: -100px -340px;
}
.ap-u55b6 {
  background-position: -100px -360px;
}
.ap-ideograph_advantage {
  background-position: -100px -380px;
}
.ap-accept {
  background-position: -100px -400px;
}
.ap-cyclone {
  background-position: -100px -420px;
}
.ap-foggy {
  background-position: -100px -440px;
}
.ap-closed_umbrella {
  background-position: -100px -460px;
}
.ap-night_with_stars {
  background-position: -100px -480px;
}
.ap-sunrise_over_mountains {
  background-position: -100px -500px;
}
.ap-sunrise {
  background-position: -100px -520px;
}
.ap-city_sunset {
  background-position: -100px -540px;
}
.ap-city_sunrise {
  background-position: -100px -560px;
}
.ap-rainbow {
  background-position: -100px -580px;
}
.ap-bridge_at_night {
  background-position: -100px -600px;
}
.ap-ocean {
  background-position: -100px -620px;
}
.ap-volcano {
  background-position: -100px -640px;
}
.ap-milky_way {
  background-position: -100px -660px;
}
.ap-earth_africa {
  background-position: -100px -680px;
}
.ap-earth_americas {
  background-position: -100px -700px;
}
.ap-earth_asia {
  background-position: -100px -720px;
}
.ap-globe_with_meridians {
  background-position: -100px -740px;
}
.ap-new_moon {
  background-position: -100px -760px;
}
.ap-waxing_crescent_moon {
  background-position: -100px -780px;
}
.ap-first_quarter_moon {
  background-position: -100px -800px;
}
.ap-moon {
  background-position: -120px 0;
}
.ap-full_moon {
  background-position: -120px -20px;
}
.ap-waning_gibbous_moon {
  background-position: -120px -40px;
}
.ap-last_quarter_moon {
  background-position: -120px -60px;
}
.ap-waning_crescent_moon {
  background-position: -120px -80px;
}
.ap-crescent_moon {
  background-position: -120px -100px;
}
.ap-new_moon_with_face {
  background-position: -120px -120px;
}
.ap-first_quarter_moon_with_face {
  background-position: -120px -140px;
}
.ap-last_quarter_moon_with_face {
  background-position: -120px -160px;
}
.ap-full_moon_with_face {
  background-position: -120px -180px;
}
.ap-sun_with_face {
  background-position: -120px -200px;
}
.ap-star2 {
  background-position: -120px -220px;
}
.ap-stars {
  background-position: -120px -240px;
}
.ap-thermometer {
  background-position: -120px -260px;
}
.ap-mostly_sunny {
  background-position: -120px -280px;
}
.ap-barely_sunny {
  background-position: -120px -300px;
}
.ap-partly_sunny_rain {
  background-position: -120px -320px;
}
.ap-rain_cloud {
  background-position: -120px -340px;
}
.ap-snow_cloud {
  background-position: -120px -360px;
}
.ap-lightning {
  background-position: -120px -380px;
}
.ap-tornado {
  background-position: -120px -400px;
}
.ap-fog {
  background-position: -120px -420px;
}
.ap-wind_blowing_face {
  background-position: -120px -440px;
}
.ap-hotdog {
  background-position: -120px -460px;
}
.ap-taco {
  background-position: -120px -480px;
}
.ap-burrito {
  background-position: -120px -500px;
}
.ap-chestnut {
  background-position: -120px -520px;
}
.ap-seedling {
  background-position: -120px -540px;
}
.ap-evergreen_tree {
  background-position: -120px -560px;
}
.ap-deciduous_tree {
  background-position: -120px -580px;
}
.ap-palm_tree {
  background-position: -120px -600px;
}
.ap-cactus {
  background-position: -120px -620px;
}
.ap-hot_pepper {
  background-position: -120px -640px;
}
.ap-tulip {
  background-position: -120px -660px;
}
.ap-cherry_blossom {
  background-position: -120px -680px;
}
.ap-rose {
  background-position: -120px -700px;
}
.ap-hibiscus {
  background-position: -120px -720px;
}
.ap-sunflower {
  background-position: -120px -740px;
}
.ap-blossom {
  background-position: -120px -760px;
}
.ap-corn {
  background-position: -120px -780px;
}
.ap-ear_of_rice {
  background-position: -120px -800px;
}
.ap-herb {
  background-position: -140px 0;
}
.ap-four_leaf_clover {
  background-position: -140px -20px;
}
.ap-maple_leaf {
  background-position: -140px -40px;
}
.ap-fallen_leaf {
  background-position: -140px -60px;
}
.ap-leaves {
  background-position: -140px -80px;
}
.ap-mushroom {
  background-position: -140px -100px;
}
.ap-tomato {
  background-position: -140px -120px;
}
.ap-eggplant {
  background-position: -140px -140px;
}
.ap-grapes {
  background-position: -140px -160px;
}
.ap-melon {
  background-position: -140px -180px;
}
.ap-watermelon {
  background-position: -140px -200px;
}
.ap-tangerine {
  background-position: -140px -220px;
}
.ap-lemon {
  background-position: -140px -240px;
}
.ap-banana {
  background-position: -140px -260px;
}
.ap-pineapple {
  background-position: -140px -280px;
}
.ap-apple {
  background-position: -140px -300px;
}
.ap-green_apple {
  background-position: -140px -320px;
}
.ap-pear {
  background-position: -140px -340px;
}
.ap-peach {
  background-position: -140px -360px;
}
.ap-cherries {
  background-position: -140px -380px;
}
.ap-strawberry {
  background-position: -140px -400px;
}
.ap-hamburger {
  background-position: -140px -420px;
}
.ap-pizza {
  background-position: -140px -440px;
}
.ap-meat_on_bone {
  background-position: -140px -460px;
}
.ap-poultry_leg {
  background-position: -140px -480px;
}
.ap-rice_cracker {
  background-position: -140px -500px;
}
.ap-rice_ball {
  background-position: -140px -520px;
}
.ap-rice {
  background-position: -140px -540px;
}
.ap-curry {
  background-position: -140px -560px;
}
.ap-ramen {
  background-position: -140px -580px;
}
.ap-spaghetti {
  background-position: -140px -600px;
}
.ap-bread {
  background-position: -140px -620px;
}
.ap-fries {
  background-position: -140px -640px;
}
.ap-sweet_potato {
  background-position: -140px -660px;
}
.ap-dango {
  background-position: -140px -680px;
}
.ap-oden {
  background-position: -140px -700px;
}
.ap-sushi {
  background-position: -140px -720px;
}
.ap-fried_shrimp {
  background-position: -140px -740px;
}
.ap-fish_cake {
  background-position: -140px -760px;
}
.ap-icecream {
  background-position: -140px -780px;
}
.ap-shaved_ice {
  background-position: -140px -800px;
}
.ap-ice_cream {
  background-position: -160px 0;
}
.ap-doughnut {
  background-position: -160px -20px;
}
.ap-cookie {
  background-position: -160px -40px;
}
.ap-chocolate_bar {
  background-position: -160px -60px;
}
.ap-candy {
  background-position: -160px -80px;
}
.ap-lollipop {
  background-position: -160px -100px;
}
.ap-custard {
  background-position: -160px -120px;
}
.ap-honey_pot {
  background-position: -160px -140px;
}
.ap-cake {
  background-position: -160px -160px;
}
.ap-bento {
  background-position: -160px -180px;
}
.ap-stew {
  background-position: -160px -200px;
}
.ap-egg {
  background-position: -160px -220px;
}
.ap-fork_and_knife {
  background-position: -160px -240px;
}
.ap-tea {
  background-position: -160px -260px;
}
.ap-sake {
  background-position: -160px -280px;
}
.ap-wine_glass {
  background-position: -160px -300px;
}
.ap-cocktail {
  background-position: -160px -320px;
}
.ap-tropical_drink {
  background-position: -160px -340px;
}
.ap-beer {
  background-position: -160px -360px;
}
.ap-beers {
  background-position: -160px -380px;
}
.ap-baby_bottle {
  background-position: -160px -400px;
}
.ap-knife_fork_plate {
  background-position: -160px -420px;
}
.ap-champagne {
  background-position: -160px -440px;
}
.ap-popcorn {
  background-position: -160px -460px;
}
.ap-ribbon {
  background-position: -160px -480px;
}
.ap-gift {
  background-position: -160px -500px;
}
.ap-birthday {
  background-position: -160px -520px;
}
.ap-jack_o_lantern {
  background-position: -160px -540px;
}
.ap-christmas_tree {
  background-position: -160px -560px;
}
.ap-santa {
  background-position: -160px -580px;
}
.ap-fireworks {
  background-position: -160px -700px;
}
.ap-sparkler {
  background-position: -160px -720px;
}
.ap-balloon {
  background-position: -160px -740px;
}
.ap-tada {
  background-position: -160px -760px;
}
.ap-confetti_ball {
  background-position: -160px -780px;
}
.ap-tanabata_tree {
  background-position: -160px -800px;
}
.ap-crossed_flags {
  background-position: -180px 0;
}
.ap-bamboo {
  background-position: -180px -20px;
}
.ap-dolls {
  background-position: -180px -40px;
}
.ap-flags {
  background-position: -180px -60px;
}
.ap-wind_chime {
  background-position: -180px -80px;
}
.ap-rice_scene {
  background-position: -180px -100px;
}
.ap-school_satchel {
  background-position: -180px -120px;
}
.ap-mortar_board {
  background-position: -180px -140px;
}
.ap-medal {
  background-position: -180px -160px;
}
.ap-reminder_ribbon {
  background-position: -180px -180px;
}
.ap-studio_microphone {
  background-position: -180px -200px;
}
.ap-level_slider {
  background-position: -180px -220px;
}
.ap-control_knobs {
  background-position: -180px -240px;
}
.ap-film_frames {
  background-position: -180px -260px;
}
.ap-admission_tickets {
  background-position: -180px -280px;
}
.ap-carousel_horse {
  background-position: -180px -300px;
}
.ap-ferris_wheel {
  background-position: -180px -320px;
}
.ap-roller_coaster {
  background-position: -180px -340px;
}
.ap-fishing_pole_and_fish {
  background-position: -180px -360px;
}
.ap-microphone {
  background-position: -180px -380px;
}
.ap-movie_camera {
  background-position: -180px -400px;
}
.ap-cinema {
  background-position: -180px -420px;
}
.ap-headphones {
  background-position: -180px -440px;
}
.ap-art {
  background-position: -180px -460px;
}
.ap-tophat {
  background-position: -180px -480px;
}
.ap-circus_tent {
  background-position: -180px -500px;
}
.ap-ticket {
  background-position: -180px -520px;
}
.ap-clapper {
  background-position: -180px -540px;
}
.ap-performing_arts {
  background-position: -180px -560px;
}
.ap-video_game {
  background-position: -180px -580px;
}
.ap-dart {
  background-position: -180px -600px;
}
.ap-slot_machine {
  background-position: -180px -620px;
}
.ap-8ball {
  background-position: -180px -640px;
}
.ap-game_die {
  background-position: -180px -660px;
}
.ap-bowling {
  background-position: -180px -680px;
}
.ap-flower_playing_cards {
  background-position: -180px -700px;
}
.ap-musical_note {
  background-position: -180px -720px;
}
.ap-notes {
  background-position: -180px -740px;
}
.ap-saxophone {
  background-position: -180px -760px;
}
.ap-guitar {
  background-position: -180px -780px;
}
.ap-musical_keyboard {
  background-position: -180px -800px;
}
.ap-trumpet {
  background-position: -200px 0;
}
.ap-violin {
  background-position: -200px -20px;
}
.ap-musical_score {
  background-position: -200px -40px;
}
.ap-running_shirt_with_sash {
  background-position: -200px -60px;
}
.ap-tennis {
  background-position: -200px -80px;
}
.ap-ski {
  background-position: -200px -100px;
}
.ap-basketball {
  background-position: -200px -120px;
}
.ap-checkered_flag {
  background-position: -200px -140px;
}
.ap-snowboarder {
  background-position: -200px -160px;
}
.ap-runner {
  background-position: -200px -180px;
}
.ap-surfer {
  background-position: -200px -300px;
}
.ap-sports_medal {
  background-position: -200px -420px;
}
.ap-trophy {
  background-position: -200px -440px;
}
.ap-horse_racing {
  background-position: -200px -460px;
}
.ap-football {
  background-position: -200px -480px;
}
.ap-rugby_football {
  background-position: -200px -500px;
}
.ap-swimmer {
  background-position: -200px -520px;
}
.ap-weight_lifter {
  background-position: -200px -640px;
}
.ap-golfer {
  background-position: -200px -760px;
}
.ap-racing_motorcycle {
  background-position: -200px -780px;
}
.ap-racing_car {
  background-position: -200px -800px;
}
.ap-cricket_bat_and_ball {
  background-position: -220px 0;
}
.ap-volleyball {
  background-position: -220px -20px;
}
.ap-field_hockey_stick_and_ball {
  background-position: -220px -40px;
}
.ap-ice_hockey_stick_and_puck {
  background-position: -220px -60px;
}
.ap-table_tennis_paddle_and_ball {
  background-position: -220px -80px;
}
.ap-snow_capped_mountain {
  background-position: -220px -100px;
}
.ap-camping {
  background-position: -220px -120px;
}
.ap-beach_with_umbrella {
  background-position: -220px -140px;
}
.ap-building_construction {
  background-position: -220px -160px;
}
.ap-house_buildings {
  background-position: -220px -180px;
}
.ap-cityscape {
  background-position: -220px -200px;
}
.ap-derelict_house_building {
  background-position: -220px -220px;
}
.ap-classical_building {
  background-position: -220px -240px;
}
.ap-desert {
  background-position: -220px -260px;
}
.ap-desert_island {
  background-position: -220px -280px;
}
.ap-national_park {
  background-position: -220px -300px;
}
.ap-stadium {
  background-position: -220px -320px;
}
.ap-house {
  background-position: -220px -340px;
}
.ap-house_with_garden {
  background-position: -220px -360px;
}
.ap-office {
  background-position: -220px -380px;
}
.ap-post_office {
  background-position: -220px -400px;
}
.ap-european_post_office {
  background-position: -220px -420px;
}
.ap-hospital {
  background-position: -220px -440px;
}
.ap-bank {
  background-position: -220px -460px;
}
.ap-atm {
  background-position: -220px -480px;
}
.ap-hotel {
  background-position: -220px -500px;
}
.ap-love_hotel {
  background-position: -220px -520px;
}
.ap-convenience_store {
  background-position: -220px -540px;
}
.ap-school {
  background-position: -220px -560px;
}
.ap-department_store {
  background-position: -220px -580px;
}
.ap-factory {
  background-position: -220px -600px;
}
.ap-izakaya_lantern {
  background-position: -220px -620px;
}
.ap-japanese_castle {
  background-position: -220px -640px;
}
.ap-european_castle {
  background-position: -220px -660px;
}
.ap-waving_white_flag {
  background-position: -220px -680px;
}
.ap-waving_black_flag {
  background-position: -220px -700px;
}
.ap-rosette {
  background-position: -220px -720px;
}
.ap-label {
  background-position: -220px -740px;
}
.ap-badminton_racquet_and_shuttlecock {
  background-position: -220px -760px;
}
.ap-bow_and_arrow {
  background-position: -220px -780px;
}
.ap-amphora {
  background-position: -220px -800px;
}
.ap-skin-tone-2 {
  background-position: -240px 0;
}
.ap-skin-tone-3 {
  background-position: -240px -20px;
}
.ap-skin-tone-4 {
  background-position: -240px -40px;
}
.ap-skin-tone-5 {
  background-position: -240px -60px;
}
.ap-skin-tone-6 {
  background-position: -240px -80px;
}
.ap-rat {
  background-position: -240px -100px;
}
.ap-mouse2 {
  background-position: -240px -120px;
}
.ap-ox {
  background-position: -240px -140px;
}
.ap-water_buffalo {
  background-position: -240px -160px;
}
.ap-cow2 {
  background-position: -240px -180px;
}
.ap-tiger2 {
  background-position: -240px -200px;
}
.ap-leopard {
  background-position: -240px -220px;
}
.ap-rabbit2 {
  background-position: -240px -240px;
}
.ap-cat2 {
  background-position: -240px -260px;
}
.ap-dragon {
  background-position: -240px -280px;
}
.ap-crocodile {
  background-position: -240px -300px;
}
.ap-whale2 {
  background-position: -240px -320px;
}
.ap-snail {
  background-position: -240px -340px;
}
.ap-snake {
  background-position: -240px -360px;
}
.ap-racehorse {
  background-position: -240px -380px;
}
.ap-ram {
  background-position: -240px -400px;
}
.ap-goat {
  background-position: -240px -420px;
}
.ap-sheep {
  background-position: -240px -440px;
}
.ap-monkey {
  background-position: -240px -460px;
}
.ap-rooster {
  background-position: -240px -480px;
}
.ap-chicken {
  background-position: -240px -500px;
}
.ap-dog2 {
  background-position: -240px -520px;
}
.ap-pig2 {
  background-position: -240px -540px;
}
.ap-boar {
  background-position: -240px -560px;
}
.ap-elephant {
  background-position: -240px -580px;
}
.ap-octopus {
  background-position: -240px -600px;
}
.ap-shell {
  background-position: -240px -620px;
}
.ap-bug {
  background-position: -240px -640px;
}
.ap-ant {
  background-position: -240px -660px;
}
.ap-bee {
  background-position: -240px -680px;
}
.ap-beetle {
  background-position: -240px -700px;
}
.ap-fish {
  background-position: -240px -720px;
}
.ap-tropical_fish {
  background-position: -240px -740px;
}
.ap-blowfish {
  background-position: -240px -760px;
}
.ap-turtle {
  background-position: -240px -780px;
}
.ap-hatching_chick {
  background-position: -240px -800px;
}
.ap-baby_chick {
  background-position: -260px 0;
}
.ap-hatched_chick {
  background-position: -260px -20px;
}
.ap-bird {
  background-position: -260px -40px;
}
.ap-penguin {
  background-position: -260px -60px;
}
.ap-koala {
  background-position: -260px -80px;
}
.ap-poodle {
  background-position: -260px -100px;
}
.ap-dromedary_camel {
  background-position: -260px -120px;
}
.ap-camel {
  background-position: -260px -140px;
}
.ap-dolphin {
  background-position: -260px -160px;
}
.ap-mouse {
  background-position: -260px -180px;
}
.ap-cow {
  background-position: -260px -200px;
}
.ap-tiger {
  background-position: -260px -220px;
}
.ap-rabbit {
  background-position: -260px -240px;
}
.ap-cat {
  background-position: -260px -260px;
}
.ap-dragon_face {
  background-position: -260px -280px;
}
.ap-whale {
  background-position: -260px -300px;
}
.ap-horse {
  background-position: -260px -320px;
}
.ap-monkey_face {
  background-position: -260px -340px;
}
.ap-dog {
  background-position: -260px -360px;
}
.ap-pig {
  background-position: -260px -380px;
}
.ap-frog {
  background-position: -260px -400px;
}
.ap-hamster {
  background-position: -260px -420px;
}
.ap-wolf {
  background-position: -260px -440px;
}
.ap-bear {
  background-position: -260px -460px;
}
.ap-panda_face {
  background-position: -260px -480px;
}
.ap-pig_nose {
  background-position: -260px -500px;
}
.ap-feet {
  background-position: -260px -520px;
}
.ap-chipmunk {
  background-position: -260px -540px;
}
.ap-eyes {
  background-position: -260px -560px;
}
.ap-eye {
  background-position: -260px -580px;
}
.ap-ear {
  background-position: -260px -600px;
}
.ap-nose {
  background-position: -260px -720px;
}
.ap-lips {
  background-position: -280px -20px;
}
.ap-tongue {
  background-position: -280px -40px;
}
.ap-point_up_2 {
  background-position: -280px -60px;
}
.ap-point_down {
  background-position: -280px -180px;
}
.ap-point_left {
  background-position: -280px -300px;
}
.ap-point_right {
  background-position: -280px -420px;
}
.ap-facepunch {
  background-position: -280px -540px;
}
.ap-wave {
  background-position: -280px -660px;
}
.ap-ok_hand {
  background-position: -280px -780px;
}
.ap-thumbsup {
  background-position: -300px -80px;
}
.ap--1,
.ap-thumbsdown {
  background-position: -300px -200px;
}
.ap-clap {
  background-position: -300px -320px;
}
.ap-open_hands {
  background-position: -300px -440px;
}
.ap-crown {
  background-position: -300px -560px;
}
.ap-womans_hat {
  background-position: -300px -580px;
}
.ap-eyeglasses {
  background-position: -300px -600px;
}
.ap-necktie {
  background-position: -300px -620px;
}
.ap-shirt {
  background-position: -300px -640px;
}
.ap-jeans {
  background-position: -300px -660px;
}
.ap-dress {
  background-position: -300px -680px;
}
.ap-kimono {
  background-position: -300px -700px;
}
.ap-bikini {
  background-position: -300px -720px;
}
.ap-womans_clothes {
  background-position: -300px -740px;
}
.ap-purse {
  background-position: -300px -760px;
}
.ap-handbag {
  background-position: -300px -780px;
}
.ap-pouch {
  background-position: -300px -800px;
}
.ap-mans_shoe {
  background-position: -320px 0;
}
.ap-athletic_shoe {
  background-position: -320px -20px;
}
.ap-high_heel {
  background-position: -320px -40px;
}
.ap-sandal {
  background-position: -320px -60px;
}
.ap-boot {
  background-position: -320px -80px;
}
.ap-footprints {
  background-position: -320px -100px;
}
.ap-bust_in_silhouette {
  background-position: -320px -120px;
}
.ap-busts_in_silhouette {
  background-position: -320px -140px;
}
.ap-boy {
  background-position: -320px -160px;
}
.ap-girl {
  background-position: -320px -280px;
}
.ap-man {
  background-position: -320px -400px;
}
.ap-woman {
  background-position: -320px -520px;
}
.ap-family {
  background-position: -320px -640px;
}
.ap-couple {
  background-position: -320px -660px;
}
.ap-two_men_holding_hands {
  background-position: -320px -680px;
}
.ap-two_women_holding_hands {
  background-position: -320px -700px;
}
.ap-cop {
  background-position: -320px -720px;
}
.ap-dancers {
  background-position: -340px -20px;
}
.ap-bride_with_veil {
  background-position: -340px -40px;
}
.ap-person_with_blond_hair {
  background-position: -340px -160px;
}
.ap-man_with_gua_pi_mao {
  background-position: -340px -280px;
}
.ap-man_with_turban {
  background-position: -340px -400px;
}
.ap-older_man {
  background-position: -340px -520px;
}
.ap-older_woman {
  background-position: -340px -640px;
}
.ap-baby {
  background-position: -340px -760px;
}
.ap-construction_worker {
  background-position: -360px -60px;
}
.ap-princess {
  background-position: -360px -180px;
}
.ap-japanese_ogre {
  background-position: -360px -300px;
}
.ap-japanese_goblin {
  background-position: -360px -320px;
}
.ap-ghost {
  background-position: -360px -340px;
}
.ap-angel {
  background-position: -360px -360px;
}
.ap-alien {
  background-position: -360px -480px;
}
.ap-space_invader {
  background-position: -360px -500px;
}
.ap-imp {
  background-position: -360px -520px;
}
.ap-skull {
  background-position: -360px -540px;
}
.ap-information_desk_person {
  background-position: -360px -560px;
}
.ap-guardsman {
  background-position: -360px -680px;
}
.ap-dancer {
  background-position: -360px -800px;
}
.ap-lipstick {
  background-position: -380px -100px;
}
.ap-nail_care {
  background-position: -380px -120px;
}
.ap-massage {
  background-position: -380px -240px;
}
.ap-haircut {
  background-position: -380px -360px;
}
.ap-barber {
  background-position: -380px -480px;
}
.ap-syringe {
  background-position: -380px -500px;
}
.ap-pill {
  background-position: -380px -520px;
}
.ap-kiss {
  background-position: -380px -540px;
}
.ap-love_letter {
  background-position: -380px -560px;
}
.ap-ring {
  background-position: -380px -580px;
}
.ap-gem {
  background-position: -380px -600px;
}
.ap-couplekiss {
  background-position: -380px -620px;
}
.ap-bouquet {
  background-position: -380px -640px;
}
.ap-couple_with_heart {
  background-position: -380px -660px;
}
.ap-wedding {
  background-position: -380px -680px;
}
.ap-heartbeat {
  background-position: -380px -700px;
}
.ap-broken_heart {
  background-position: -380px -720px;
}
.ap-two_hearts {
  background-position: -380px -740px;
}
.ap-sparkling_heart {
  background-position: -380px -760px;
}
.ap-heartpulse {
  background-position: -380px -780px;
}
.ap-cupid {
  background-position: -380px -800px;
}
.ap-blue_heart {
  background-position: -400px 0;
}
.ap-green_heart {
  background-position: -400px -20px;
}
.ap-yellow_heart {
  background-position: -400px -40px;
}
.ap-purple_heart {
  background-position: -400px -60px;
}
.ap-gift_heart {
  background-position: -400px -80px;
}
.ap-revolving_hearts {
  background-position: -400px -100px;
}
.ap-heart_decoration {
  background-position: -400px -120px;
}
.ap-diamond_shape_with_a_dot_inside {
  background-position: -400px -140px;
}
.ap-bulb {
  background-position: -400px -160px;
}
.ap-anger {
  background-position: -400px -180px;
}
.ap-bomb {
  background-position: -400px -200px;
}
.ap-zzz {
  background-position: -400px -220px;
}
.ap-boom {
  background-position: -400px -240px;
}
.ap-sweat_drops {
  background-position: -400px -260px;
}
.ap-droplet {
  background-position: -400px -280px;
}
.ap-dash {
  background-position: -400px -300px;
}
.ap-hankey {
  background-position: -400px -320px;
}
.ap-muscle {
  background-position: -400px -340px;
}
.ap-dizzy {
  background-position: -400px -460px;
}
.ap-speech_balloon {
  background-position: -400px -480px;
}
.ap-thought_balloon {
  background-position: -400px -500px;
}
.ap-white_flower {
  background-position: -400px -520px;
}
.ap-100 {
  background-position: -400px -540px;
}
.ap-moneybag {
  background-position: -400px -560px;
}
.ap-currency_exchange {
  background-position: -400px -580px;
}
.ap-heavy_dollar_sign {
  background-position: -400px -600px;
}
.ap-credit_card {
  background-position: -400px -620px;
}
.ap-yen {
  background-position: -400px -640px;
}
.ap-dollar {
  background-position: -400px -660px;
}
.ap-euro {
  background-position: -400px -680px;
}
.ap-pound {
  background-position: -400px -700px;
}
.ap-money_with_wings {
  background-position: -400px -720px;
}
.ap-chart {
  background-position: -400px -740px;
}
.ap-seat {
  background-position: -400px -760px;
}
.ap-computer {
  background-position: -400px -780px;
}
.ap-briefcase {
  background-position: -400px -800px;
}
.ap-minidisc {
  background-position: -420px 0;
}
.ap-floppy_disk {
  background-position: -420px -20px;
}
.ap-cd {
  background-position: -420px -40px;
}
.ap-dvd {
  background-position: -420px -60px;
}
.ap-file_folder {
  background-position: -420px -80px;
}
.ap-open_file_folder {
  background-position: -420px -100px;
}
.ap-page_with_curl {
  background-position: -420px -120px;
}
.ap-page_facing_up {
  background-position: -420px -140px;
}
.ap-date {
  background-position: -420px -160px;
}
.ap-calendar {
  background-position: -420px -180px;
}
.ap-card_index {
  background-position: -420px -200px;
}
.ap-chart_with_upwards_trend {
  background-position: -420px -220px;
}
.ap-chart_with_downwards_trend {
  background-position: -420px -240px;
}
.ap-bar_chart {
  background-position: -420px -260px;
}
.ap-clipboard {
  background-position: -420px -280px;
}
.ap-pushpin {
  background-position: -420px -300px;
}
.ap-round_pushpin {
  background-position: -420px -320px;
}
.ap-paperclip {
  background-position: -420px -340px;
}
.ap-straight_ruler {
  background-position: -420px -360px;
}
.ap-triangular_ruler {
  background-position: -420px -380px;
}
.ap-bookmark_tabs {
  background-position: -420px -400px;
}
.ap-ledger {
  background-position: -420px -420px;
}
.ap-notebook {
  background-position: -420px -440px;
}
.ap-notebook_with_decorative_cover {
  background-position: -420px -460px;
}
.ap-closed_book {
  background-position: -420px -480px;
}
.ap-book {
  background-position: -420px -500px;
}
.ap-green_book {
  background-position: -420px -520px;
}
.ap-blue_book {
  background-position: -420px -540px;
}
.ap-orange_book {
  background-position: -420px -560px;
}
.ap-books {
  background-position: -420px -580px;
}
.ap-name_badge {
  background-position: -420px -600px;
}
.ap-scroll {
  background-position: -420px -620px;
}
.ap-memo {
  background-position: -420px -640px;
}
.ap-telephone_receiver {
  background-position: -420px -660px;
}
.ap-pager {
  background-position: -420px -680px;
}
.ap-fax {
  background-position: -420px -700px;
}
.ap-satellite_antenna {
  background-position: -420px -720px;
}
.ap-loudspeaker {
  background-position: -420px -740px;
}
.ap-mega {
  background-position: -420px -760px;
}
.ap-outbox_tray {
  background-position: -420px -780px;
}
.ap-inbox_tray {
  background-position: -420px -800px;
}
.ap-package {
  background-position: -440px 0;
}
.ap-e-mail {
  background-position: -440px -20px;
}
.ap-incoming_envelope {
  background-position: -440px -40px;
}
.ap-envelope_with_arrow {
  background-position: -440px -60px;
}
.ap-mailbox_closed {
  background-position: -440px -80px;
}
.ap-mailbox {
  background-position: -440px -100px;
}
.ap-mailbox_with_mail {
  background-position: -440px -120px;
}
.ap-mailbox_with_no_mail {
  background-position: -440px -140px;
}
.ap-postbox {
  background-position: -440px -160px;
}
.ap-postal_horn {
  background-position: -440px -180px;
}
.ap-newspaper {
  background-position: -440px -200px;
}
.ap-iphone {
  background-position: -440px -220px;
}
.ap-calling {
  background-position: -440px -240px;
}
.ap-vibration_mode {
  background-position: -440px -260px;
}
.ap-mobile_phone_off {
  background-position: -440px -280px;
}
.ap-no_mobile_phones {
  background-position: -440px -300px;
}
.ap-signal_strength {
  background-position: -440px -320px;
}
.ap-camera {
  background-position: -440px -340px;
}
.ap-camera_with_flash {
  background-position: -440px -360px;
}
.ap-video_camera {
  background-position: -440px -380px;
}
.ap-tv {
  background-position: -440px -400px;
}
.ap-radio {
  background-position: -440px -420px;
}
.ap-vhs {
  background-position: -440px -440px;
}
.ap-film_projector {
  background-position: -440px -460px;
}
.ap-prayer_beads {
  background-position: -440px -480px;
}
.ap-twisted_rightwards_arrows {
  background-position: -440px -500px;
}
.ap-repeat {
  background-position: -440px -520px;
}
.ap-repeat_one {
  background-position: -440px -540px;
}
.ap-arrows_clockwise {
  background-position: -440px -560px;
}
.ap-arrows_counterclockwise {
  background-position: -440px -580px;
}
.ap-low_brightness {
  background-position: -440px -600px;
}
.ap-high_brightness {
  background-position: -440px -620px;
}
.ap-mute {
  background-position: -440px -640px;
}
.ap-speaker {
  background-position: -440px -660px;
}
.ap-sound {
  background-position: -440px -680px;
}
.ap-loud_sound {
  background-position: -440px -700px;
}
.ap-battery {
  background-position: -440px -720px;
}
.ap-electric_plug {
  background-position: -440px -740px;
}
.ap-mag {
  background-position: -440px -760px;
}
.ap-mag_right {
  background-position: -440px -780px;
}
.ap-lock_with_ink_pen {
  background-position: -440px -800px;
}
.ap-closed_lock_with_key {
  background-position: -460px 0;
}
.ap-key {
  background-position: -460px -20px;
}
.ap-lock {
  background-position: -460px -40px;
}
.ap-unlock {
  background-position: -460px -60px;
}
.ap-bell {
  background-position: -460px -80px;
}
.ap-no_bell {
  background-position: -460px -100px;
}
.ap-bookmark {
  background-position: -460px -120px;
}
.ap-link {
  background-position: -460px -140px;
}
.ap-radio_button {
  background-position: -460px -160px;
}
.ap-back {
  background-position: -460px -180px;
}
.ap-end {
  background-position: -460px -200px;
}
.ap-on {
  background-position: -460px -220px;
}
.ap-soon {
  background-position: -460px -240px;
}
.ap-top {
  background-position: -460px -260px;
}
.ap-underage {
  background-position: -460px -280px;
}
.ap-keycap_ten {
  background-position: -460px -300px;
}
.ap-capital_abcd {
  background-position: -460px -320px;
}
.ap-abcd {
  background-position: -460px -340px;
}
.ap-1234 {
  background-position: -460px -360px;
}
.ap-symbols {
  background-position: -460px -380px;
}
.ap-abc {
  background-position: -460px -400px;
}
.ap-fire {
  background-position: -460px -420px;
}
.ap-flashlight {
  background-position: -460px -440px;
}
.ap-wrench {
  background-position: -460px -460px;
}
.ap-hammer {
  background-position: -460px -480px;
}
.ap-nut_and_bolt {
  background-position: -460px -500px;
}
.ap-hocho {
  background-position: -460px -520px;
}
.ap-gun {
  background-position: -460px -540px;
}
.ap-microscope {
  background-position: -460px -560px;
}
.ap-telescope {
  background-position: -460px -580px;
}
.ap-crystal_ball {
  background-position: -460px -600px;
}
.ap-six_pointed_star {
  background-position: -460px -620px;
}
.ap-beginner {
  background-position: -460px -640px;
}
.ap-trident {
  background-position: -460px -660px;
}
.ap-black_square_button {
  background-position: -460px -680px;
}
.ap-white_square_button {
  background-position: -460px -700px;
}
.ap-red_circle {
  background-position: -460px -720px;
}
.ap-large_blue_circle {
  background-position: -460px -740px;
}
.ap-large_orange_diamond {
  background-position: -460px -760px;
}
.ap-large_blue_diamond {
  background-position: -460px -780px;
}
.ap-small_orange_diamond {
  background-position: -460px -800px;
}
.ap-small_blue_diamond {
  background-position: -480px 0;
}
.ap-small_red_triangle {
  background-position: -480px -20px;
}
.ap-small_red_triangle_down {
  background-position: -480px -40px;
}
.ap-arrow_up_small {
  background-position: -480px -60px;
}
.ap-arrow_down_small {
  background-position: -480px -80px;
}
.ap-om_symbol {
  background-position: -480px -100px;
}
.ap-dove_of_peace {
  background-position: -480px -120px;
}
.ap-kaaba {
  background-position: -480px -140px;
}
.ap-mosque {
  background-position: -480px -160px;
}
.ap-synagogue {
  background-position: -480px -180px;
}
.ap-menorah_with_nine_branches {
  background-position: -480px -200px;
}
.ap-clock1 {
  background-position: -480px -220px;
}
.ap-clock2 {
  background-position: -480px -240px;
}
.ap-clock3 {
  background-position: -480px -260px;
}
.ap-clock4 {
  background-position: -480px -280px;
}
.ap-clock5 {
  background-position: -480px -300px;
}
.ap-clock6 {
  background-position: -480px -320px;
}
.ap-clock7 {
  background-position: -480px -340px;
}
.ap-clock8 {
  background-position: -480px -360px;
}
.ap-clock9 {
  background-position: -480px -380px;
}
.ap-clock10 {
  background-position: -480px -400px;
}
.ap-clock11 {
  background-position: -480px -420px;
}
.ap-clock12 {
  background-position: -480px -440px;
}
.ap-clock130 {
  background-position: -480px -460px;
}
.ap-clock230 {
  background-position: -480px -480px;
}
.ap-clock330 {
  background-position: -480px -500px;
}
.ap-clock430 {
  background-position: -480px -520px;
}
.ap-clock530 {
  background-position: -480px -540px;
}
.ap-clock630 {
  background-position: -480px -560px;
}
.ap-clock730 {
  background-position: -480px -580px;
}
.ap-clock830 {
  background-position: -480px -600px;
}
.ap-clock930 {
  background-position: -480px -620px;
}
.ap-clock1030 {
  background-position: -480px -640px;
}
.ap-clock1130 {
  background-position: -480px -660px;
}
.ap-clock1230 {
  background-position: -480px -680px;
}
.ap-candle {
  background-position: -480px -700px;
}
.ap-mantelpiece_clock {
  background-position: -480px -720px;
}
.ap-hole {
  background-position: -480px -740px;
}
.ap-man_in_business_suit_levitating {
  background-position: -480px -760px;
}
.ap-sleuth_or_spy {
  background-position: -480px -780px;
}
.ap-dark_sunglasses {
  background-position: -500px -80px;
}
.ap-spider {
  background-position: -500px -100px;
}
.ap-spider_web {
  background-position: -500px -120px;
}
.ap-joystick {
  background-position: -500px -140px;
}
.ap-linked_paperclips {
  background-position: -500px -160px;
}
.ap-lower_left_ballpoint_pen {
  background-position: -500px -180px;
}
.ap-lower_left_fountain_pen {
  background-position: -500px -200px;
}
.ap-lower_left_paintbrush {
  background-position: -500px -220px;
}
.ap-lower_left_crayon {
  background-position: -500px -240px;
}
.ap-raised_hand_with_fingers_splayed {
  background-position: -500px -260px;
}
.ap-middle_finger {
  background-position: -500px -380px;
}
.ap-spock-hand {
  background-position: -500px -500px;
}
.ap-desktop_computer {
  background-position: -500px -620px;
}
.ap-printer {
  background-position: -500px -640px;
}
.ap-three_button_mouse {
  background-position: -500px -660px;
}
.ap-trackball {
  background-position: -500px -680px;
}
.ap-frame_with_picture {
  background-position: -500px -700px;
}
.ap-card_index_dividers {
  background-position: -500px -720px;
}
.ap-card_file_box {
  background-position: -500px -740px;
}
.ap-file_cabinet {
  background-position: -500px -760px;
}
.ap-wastebasket {
  background-position: -500px -780px;
}
.ap-spiral_note_pad {
  background-position: -500px -800px;
}
.ap-spiral_calendar_pad {
  background-position: -520px 0;
}
.ap-compression {
  background-position: -520px -20px;
}
.ap-old_key {
  background-position: -520px -40px;
}
.ap-rolled_up_newspaper {
  background-position: -520px -60px;
}
.ap-dagger_knife {
  background-position: -520px -80px;
}
.ap-speaking_head_in_silhouette {
  background-position: -520px -100px;
}
.ap-left_speech_bubble {
  background-position: -520px -120px;
}
.ap-right_anger_bubble {
  background-position: -520px -140px;
}
.ap-ballot_box_with_ballot {
  background-position: -520px -160px;
}
.ap-world_map {
  background-position: -520px -180px;
}
.ap-mount_fuji {
  background-position: -520px -200px;
}
.ap-tokyo_tower {
  background-position: -520px -220px;
}
.ap-statue_of_liberty {
  background-position: -520px -240px;
}
.ap-japan {
  background-position: -520px -260px;
}
.ap-moyai {
  background-position: -520px -280px;
}
.ap-grinning {
  background-position: -520px -300px;
}
.ap-grin {
  background-position: -520px -320px;
}
.ap-joy {
  background-position: -520px -340px;
}
.ap-smiley {
  background-position: -520px -360px;
}
.ap-smile {
  background-position: -520px -380px;
}
.ap-sweat_smile {
  background-position: -520px -400px;
}
.ap-laughing {
  background-position: -520px -420px;
}
.ap-innocent {
  background-position: -520px -440px;
}
.ap-smiling_imp {
  background-position: -520px -460px;
}
.ap-wink {
  background-position: -520px -480px;
}
.ap-blush {
  background-position: -520px -500px;
}
.ap-yum {
  background-position: -520px -520px;
}
.ap-relieved {
  background-position: -520px -540px;
}
.ap-heart_eyes {
  background-position: -520px -560px;
}
.ap-sunglasses {
  background-position: -520px -580px;
}
.ap-smirk {
  background-position: -520px -600px;
}
.ap-neutral_face {
  background-position: -520px -620px;
}
.ap-expressionless {
  background-position: -520px -640px;
}
.ap-unamused {
  background-position: -520px -660px;
}
.ap-sweat {
  background-position: -520px -680px;
}
.ap-pensive {
  background-position: -520px -700px;
}
.ap-confused {
  background-position: -520px -720px;
}
.ap-confounded {
  background-position: -520px -740px;
}
.ap-kissing {
  background-position: -520px -760px;
}
.ap-kissing_heart {
  background-position: -520px -780px;
}
.ap-kissing_smiling_eyes {
  background-position: -520px -800px;
}
.ap-kissing_closed_eyes {
  background-position: -540px 0;
}
.ap-stuck_out_tongue {
  background-position: -540px -20px;
}
.ap-stuck_out_tongue_winking_eye {
  background-position: -540px -40px;
}
.ap-stuck_out_tongue_closed_eyes {
  background-position: -540px -60px;
}
.ap-disappointed {
  background-position: -540px -80px;
}
.ap-worried {
  background-position: -540px -100px;
}
.ap-angry {
  background-position: -540px -120px;
}
.ap-rage {
  background-position: -540px -140px;
}
.ap-cry {
  background-position: -540px -160px;
}
.ap-persevere {
  background-position: -540px -180px;
}
.ap-triumph {
  background-position: -540px -200px;
}
.ap-disappointed_relieved {
  background-position: -540px -220px;
}
.ap-frowning {
  background-position: -540px -240px;
}
.ap-anguished {
  background-position: -540px -260px;
}
.ap-fearful {
  background-position: -540px -280px;
}
.ap-weary {
  background-position: -540px -300px;
}
.ap-sleepy {
  background-position: -540px -320px;
}
.ap-tired_face {
  background-position: -540px -340px;
}
.ap-grimacing {
  background-position: -540px -360px;
}
.ap-sob {
  background-position: -540px -380px;
}
.ap-open_mouth {
  background-position: -540px -400px;
}
.ap-hushed {
  background-position: -540px -420px;
}
.ap-cold_sweat {
  background-position: -540px -440px;
}
.ap-scream {
  background-position: -540px -460px;
}
.ap-astonished {
  background-position: -540px -480px;
}
.ap-flushed {
  background-position: -540px -500px;
}
.ap-sleeping {
  background-position: -540px -520px;
}
.ap-dizzy_face {
  background-position: -540px -540px;
}
.ap-no_mouth {
  background-position: -540px -560px;
}
.ap-mask {
  background-position: -540px -580px;
}
.ap-smile_cat {
  background-position: -540px -600px;
}
.ap-joy_cat {
  background-position: -540px -620px;
}
.ap-smiley_cat {
  background-position: -540px -640px;
}
.ap-heart_eyes_cat {
  background-position: -540px -660px;
}
.ap-smirk_cat {
  background-position: -540px -680px;
}
.ap-kissing_cat {
  background-position: -540px -700px;
}
.ap-pouting_cat {
  background-position: -540px -720px;
}
.ap-crying_cat_face {
  background-position: -540px -740px;
}
.ap-scream_cat {
  background-position: -540px -760px;
}
.ap-slightly_frowning_face {
  background-position: -540px -780px;
}
.ap-slightly_smiling_face {
  background-position: -540px -800px;
}
.ap-upside_down_face {
  background-position: -560px 0;
}
.ap-face_with_rolling_eyes {
  background-position: -560px -20px;
}
.ap-no_good {
  background-position: -560px -40px;
}
.ap-ok_woman {
  background-position: -560px -160px;
}
.ap-bow {
  background-position: -560px -280px;
}
.ap-see_no_evil {
  background-position: -560px -400px;
}
.ap-hear_no_evil {
  background-position: -560px -420px;
}
.ap-speak_no_evil {
  background-position: -560px -440px;
}
.ap-raising_hand {
  background-position: -560px -460px;
}
.ap-raised_hands {
  background-position: -560px -580px;
}
.ap-person_frowning {
  background-position: -560px -700px;
}
.ap-person_with_pouting_face {
  background-position: -580px 0;
}
.ap-pray {
  background-position: -580px -120px;
}
.ap-rocket {
  background-position: -580px -240px;
}
.ap-helicopter {
  background-position: -580px -260px;
}
.ap-steam_locomotive {
  background-position: -580px -280px;
}
.ap-railway_car {
  background-position: -580px -300px;
}
.ap-bullettrain_side {
  background-position: -580px -320px;
}
.ap-bullettrain_front {
  background-position: -580px -340px;
}
.ap-train2 {
  background-position: -580px -360px;
}
.ap-metro {
  background-position: -580px -380px;
}
.ap-light_rail {
  background-position: -580px -400px;
}
.ap-station {
  background-position: -580px -420px;
}
.ap-tram {
  background-position: -580px -440px;
}
.ap-train {
  background-position: -580px -460px;
}
.ap-bus {
  background-position: -580px -480px;
}
.ap-oncoming_bus {
  background-position: -580px -500px;
}
.ap-trolleybus {
  background-position: -580px -520px;
}
.ap-busstop {
  background-position: -580px -540px;
}
.ap-minibus {
  background-position: -580px -560px;
}
.ap-ambulance {
  background-position: -580px -580px;
}
.ap-fire_engine {
  background-position: -580px -600px;
}
.ap-police_car {
  background-position: -580px -620px;
}
.ap-oncoming_police_car {
  background-position: -580px -640px;
}
.ap-taxi {
  background-position: -580px -660px;
}
.ap-oncoming_taxi {
  background-position: -580px -680px;
}
.ap-car {
  background-position: -580px -700px;
}
.ap-oncoming_automobile {
  background-position: -580px -720px;
}
.ap-blue_car {
  background-position: -580px -740px;
}
.ap-truck {
  background-position: -580px -760px;
}
.ap-articulated_lorry {
  background-position: -580px -780px;
}
.ap-tractor {
  background-position: -580px -800px;
}
.ap-monorail {
  background-position: -600px 0;
}
.ap-mountain_railway {
  background-position: -600px -20px;
}
.ap-suspension_railway {
  background-position: -600px -40px;
}
.ap-mountain_cableway {
  background-position: -600px -60px;
}
.ap-aerial_tramway {
  background-position: -600px -80px;
}
.ap-ship {
  background-position: -600px -100px;
}
.ap-rowboat {
  background-position: -600px -120px;
}
.ap-speedboat {
  background-position: -600px -240px;
}
.ap-traffic_light {
  background-position: -600px -260px;
}
.ap-vertical_traffic_light {
  background-position: -600px -280px;
}
.ap-construction {
  background-position: -600px -300px;
}
.ap-rotating_light {
  background-position: -600px -320px;
}
.ap-triangular_flag_on_post {
  background-position: -600px -340px;
}
.ap-door {
  background-position: -600px -360px;
}
.ap-no_entry_sign {
  background-position: -600px -380px;
}
.ap-smoking {
  background-position: -600px -400px;
}
.ap-no_smoking {
  background-position: -600px -420px;
}
.ap-put_litter_in_its_place {
  background-position: -600px -440px;
}
.ap-do_not_litter {
  background-position: -600px -460px;
}
.ap-potable_water {
  background-position: -600px -480px;
}
.ap-non-potable_water {
  background-position: -600px -500px;
}
.ap-bike {
  background-position: -600px -520px;
}
.ap-no_bicycles {
  background-position: -600px -540px;
}
.ap-bicyclist {
  background-position: -600px -560px;
}
.ap-mountain_bicyclist {
  background-position: -600px -680px;
}
.ap-walking {
  background-position: -600px -800px;
}
.ap-no_pedestrians {
  background-position: -620px -100px;
}
.ap-children_crossing {
  background-position: -620px -120px;
}
.ap-mens {
  background-position: -620px -140px;
}
.ap-womens {
  background-position: -620px -160px;
}
.ap-restroom {
  background-position: -620px -180px;
}
.ap-baby_symbol {
  background-position: -620px -200px;
}
.ap-toilet {
  background-position: -620px -220px;
}
.ap-wc {
  background-position: -620px -240px;
}
.ap-shower {
  background-position: -620px -260px;
}
.ap-bath {
  background-position: -620px -280px;
}
.ap-bathtub {
  background-position: -620px -400px;
}
.ap-passport_control {
  background-position: -620px -420px;
}
.ap-customs {
  background-position: -620px -440px;
}
.ap-baggage_claim {
  background-position: -620px -460px;
}
.ap-left_luggage {
  background-position: -620px -480px;
}
.ap-couch_and_lamp {
  background-position: -620px -500px;
}
.ap-sleeping_accommodation {
  background-position: -620px -520px;
}
.ap-shopping_bags {
  background-position: -620px -540px;
}
.ap-bellhop_bell {
  background-position: -620px -560px;
}
.ap-bed {
  background-position: -620px -580px;
}
.ap-place_of_worship {
  background-position: -620px -600px;
}
.ap-hammer_and_wrench {
  background-position: -620px -620px;
}
.ap-shield {
  background-position: -620px -640px;
}
.ap-oil_drum {
  background-position: -620px -660px;
}
.ap-motorway {
  background-position: -620px -680px;
}
.ap-railway_track {
  background-position: -620px -700px;
}
.ap-motor_boat {
  background-position: -620px -720px;
}
.ap-small_airplane {
  background-position: -620px -740px;
}
.ap-airplane_departure {
  background-position: -620px -760px;
}
.ap-airplane_arriving {
  background-position: -620px -780px;
}
.ap-satellite {
  background-position: -620px -800px;
}
.ap-passenger_ship {
  background-position: -640px 0;
}
.ap-zipper_mouth_face {
  background-position: -640px -20px;
}
.ap-money_mouth_face {
  background-position: -640px -40px;
}
.ap-face_with_thermometer {
  background-position: -640px -60px;
}
.ap-nerd_face {
  background-position: -640px -80px;
}
.ap-thinking_face {
  background-position: -640px -100px;
}
.ap-face_with_head_bandage {
  background-position: -640px -120px;
}
.ap-robot_face {
  background-position: -640px -140px;
}
.ap-hugging_face {
  background-position: -640px -160px;
}
.ap-the_horns {
  background-position: -640px -180px;
}
.ap-crab {
  background-position: -640px -300px;
}
.ap-lion_face {
  background-position: -640px -320px;
}
.ap-scorpion {
  background-position: -640px -340px;
}
.ap-turkey {
  background-position: -640px -360px;
}
.ap-unicorn_face {
  background-position: -640px -380px;
}
.ap-cheese_wedge {
  background-position: -640px -400px;
}
.ap-hash {
  background-position: -640px -420px;
}
.ap-keycap_star {
  background-position: -640px -440px;
}
.ap-zero {
  background-position: -640px -460px;
}
.ap-one {
  background-position: -640px -480px;
}
.ap-two {
  background-position: -640px -500px;
}
.ap-three {
  background-position: -640px -520px;
}
.ap-four {
  background-position: -640px -540px;
}
.ap-five {
  background-position: -640px -560px;
}
.ap-six {
  background-position: -640px -580px;
}
.ap-seven {
  background-position: -640px -600px;
}
.ap-eight {
  background-position: -640px -620px;
}
.ap-nine {
  background-position: -640px -640px;
}
.ap-flag-ac {
  background-position: -640px -660px;
}
.ap-flag-ad {
  background-position: -640px -680px;
}
.ap-flag-ae {
  background-position: -640px -700px;
}
.ap-flag-af {
  background-position: -640px -720px;
}
.ap-flag-ag {
  background-position: -640px -740px;
}
.ap-flag-ai {
  background-position: -640px -760px;
}
.ap-flag-al {
  background-position: -640px -780px;
}
.ap-flag-am {
  background-position: -640px -800px;
}
.ap-flag-ao {
  background-position: -660px 0;
}
.ap-flag-aq {
  background-position: -660px -20px;
}
.ap-flag-ar {
  background-position: -660px -40px;
}
.ap-flag-as {
  background-position: -660px -60px;
}
.ap-flag-at {
  background-position: -660px -80px;
}
.ap-flag-au {
  background-position: -660px -100px;
}
.ap-flag-aw {
  background-position: -660px -120px;
}
.ap-flag-ax {
  background-position: -660px -140px;
}
.ap-flag-az {
  background-position: -660px -160px;
}
.ap-flag-ba {
  background-position: -660px -180px;
}
.ap-flag-bb {
  background-position: -660px -200px;
}
.ap-flag-bd {
  background-position: -660px -220px;
}
.ap-flag-be {
  background-position: -660px -240px;
}
.ap-flag-bf {
  background-position: -660px -260px;
}
.ap-flag-bg {
  background-position: -660px -280px;
}
.ap-flag-bh {
  background-position: -660px -300px;
}
.ap-flag-bi {
  background-position: -660px -320px;
}
.ap-flag-bj {
  background-position: -660px -340px;
}
.ap-flag-bl {
  background-position: -660px -360px;
}
.ap-flag-bm {
  background-position: -660px -380px;
}
.ap-flag-bn {
  background-position: -660px -400px;
}
.ap-flag-bo {
  background-position: -660px -420px;
}
.ap-flag-bq {
  background-position: -660px -440px;
}
.ap-flag-br {
  background-position: -660px -460px;
}
.ap-flag-bs {
  background-position: -660px -480px;
}
.ap-flag-bt {
  background-position: -660px -500px;
}
.ap-flag-bv {
  background-position: -660px -520px;
}
.ap-flag-bw {
  background-position: -660px -540px;
}
.ap-flag-by {
  background-position: -660px -560px;
}
.ap-flag-bz {
  background-position: -660px -580px;
}
.ap-flag-ca {
  background-position: -660px -600px;
}
.ap-flag-cc {
  background-position: -660px -620px;
}
.ap-flag-cd {
  background-position: -660px -640px;
}
.ap-flag-cf {
  background-position: -660px -660px;
}
.ap-flag-cg {
  background-position: -660px -680px;
}
.ap-flag-ch {
  background-position: -660px -700px;
}
.ap-flag-ci {
  background-position: -660px -720px;
}
.ap-flag-ck {
  background-position: -660px -740px;
}
.ap-flag-cl {
  background-position: -660px -760px;
}
.ap-flag-cm {
  background-position: -660px -780px;
}
.ap-flag-cn {
  background-position: -660px -800px;
}
.ap-flag-co {
  background-position: -680px 0;
}
.ap-flag-cp {
  background-position: -680px -20px;
}
.ap-flag-cr {
  background-position: -680px -40px;
}
.ap-flag-cu {
  background-position: -680px -60px;
}
.ap-flag-cv {
  background-position: -680px -80px;
}
.ap-flag-cw {
  background-position: -680px -100px;
}
.ap-flag-cx {
  background-position: -680px -120px;
}
.ap-flag-cy {
  background-position: -680px -140px;
}
.ap-flag-cz {
  background-position: -680px -160px;
}
.ap-flag-de {
  background-position: -680px -180px;
}
.ap-flag-dg {
  background-position: -680px -200px;
}
.ap-flag-dj {
  background-position: -680px -220px;
}
.ap-flag-dk {
  background-position: -680px -240px;
}
.ap-flag-dm {
  background-position: -680px -260px;
}
.ap-flag-do {
  background-position: -680px -280px;
}
.ap-flag-dz {
  background-position: -680px -300px;
}
.ap-flag-ea {
  background-position: -680px -320px;
}
.ap-flag-ec {
  background-position: -680px -340px;
}
.ap-flag-ee {
  background-position: -680px -360px;
}
.ap-flag-eg {
  background-position: -680px -380px;
}
.ap-flag-eh {
  background-position: -680px -400px;
}
.ap-flag-er {
  background-position: -680px -420px;
}
.ap-flag-es {
  background-position: -680px -440px;
}
.ap-flag-et {
  background-position: -680px -460px;
}
.ap-flag-eu {
  background-position: -680px -480px;
}
.ap-flag-fi {
  background-position: -680px -500px;
}
.ap-flag-fj {
  background-position: -680px -520px;
}
.ap-flag-fk {
  background-position: -680px -540px;
}
.ap-flag-fm {
  background-position: -680px -560px;
}
.ap-flag-fo {
  background-position: -680px -580px;
}
.ap-flag-fr {
  background-position: -680px -600px;
}
.ap-flag-ga {
  background-position: -680px -620px;
}
.ap-flag-gb {
  background-position: -680px -640px;
}
.ap-flag-gd {
  background-position: -680px -660px;
}
.ap-flag-ge {
  background-position: -680px -680px;
}
.ap-flag-gf {
  background-position: -680px -700px;
}
.ap-flag-gg {
  background-position: -680px -720px;
}
.ap-flag-gh {
  background-position: -680px -740px;
}
.ap-flag-gi {
  background-position: -680px -760px;
}
.ap-flag-gl {
  background-position: -680px -780px;
}
.ap-flag-gm {
  background-position: -680px -800px;
}
.ap-flag-gn {
  background-position: -700px 0;
}
.ap-flag-gp {
  background-position: -700px -20px;
}
.ap-flag-gq {
  background-position: -700px -40px;
}
.ap-flag-gr {
  background-position: -700px -60px;
}
.ap-flag-gs {
  background-position: -700px -80px;
}
.ap-flag-gt {
  background-position: -700px -100px;
}
.ap-flag-gu {
  background-position: -700px -120px;
}
.ap-flag-gw {
  background-position: -700px -140px;
}
.ap-flag-gy {
  background-position: -700px -160px;
}
.ap-flag-hk {
  background-position: -700px -180px;
}
.ap-flag-hm {
  background-position: -700px -200px;
}
.ap-flag-hn {
  background-position: -700px -220px;
}
.ap-flag-hr {
  background-position: -700px -240px;
}
.ap-flag-ht {
  background-position: -700px -260px;
}
.ap-flag-hu {
  background-position: -700px -280px;
}
.ap-flag-ic {
  background-position: -700px -300px;
}
.ap-flag-id {
  background-position: -700px -320px;
}
.ap-flag-ie {
  background-position: -700px -340px;
}
.ap-flag-il {
  background-position: -700px -360px;
}
.ap-flag-im {
  background-position: -700px -380px;
}
.ap-flag-in {
  background-position: -700px -400px;
}
.ap-flag-io {
  background-position: -700px -420px;
}
.ap-flag-iq {
  background-position: -700px -440px;
}
.ap-flag-ir {
  background-position: -700px -460px;
}
.ap-flag-is {
  background-position: -700px -480px;
}
.ap-flag-it {
  background-position: -700px -500px;
}
.ap-flag-je {
  background-position: -700px -520px;
}
.ap-flag-jm {
  background-position: -700px -540px;
}
.ap-flag-jo {
  background-position: -700px -560px;
}
.ap-flag-jp {
  background-position: -700px -580px;
}
.ap-flag-ke {
  background-position: -700px -600px;
}
.ap-flag-kg {
  background-position: -700px -620px;
}
.ap-flag-kh {
  background-position: -700px -640px;
}
.ap-flag-ki {
  background-position: -700px -660px;
}
.ap-flag-km {
  background-position: -700px -680px;
}
.ap-flag-kn {
  background-position: -700px -700px;
}
.ap-flag-kp {
  background-position: -700px -720px;
}
.ap-flag-kr {
  background-position: -700px -740px;
}
.ap-flag-kw {
  background-position: -700px -760px;
}
.ap-flag-ky {
  background-position: -700px -780px;
}
.ap-flag-kz {
  background-position: -700px -800px;
}
.ap-flag-la {
  background-position: -720px 0;
}
.ap-flag-lb {
  background-position: -720px -20px;
}
.ap-flag-lc {
  background-position: -720px -40px;
}
.ap-flag-li {
  background-position: -720px -60px;
}
.ap-flag-lk {
  background-position: -720px -80px;
}
.ap-flag-lr {
  background-position: -720px -100px;
}
.ap-flag-ls {
  background-position: -720px -120px;
}
.ap-flag-lt {
  background-position: -720px -140px;
}
.ap-flag-lu {
  background-position: -720px -160px;
}
.ap-flag-lv {
  background-position: -720px -180px;
}
.ap-flag-ly {
  background-position: -720px -200px;
}
.ap-flag-ma {
  background-position: -720px -220px;
}
.ap-flag-mc {
  background-position: -720px -240px;
}
.ap-flag-md {
  background-position: -720px -260px;
}
.ap-flag-me {
  background-position: -720px -280px;
}
.ap-flag-mf {
  background-position: -720px -300px;
}
.ap-flag-mg {
  background-position: -720px -320px;
}
.ap-flag-mh {
  background-position: -720px -340px;
}
.ap-flag-mk {
  background-position: -720px -360px;
}
.ap-flag-ml {
  background-position: -720px -380px;
}
.ap-flag-mm {
  background-position: -720px -400px;
}
.ap-flag-mn {
  background-position: -720px -420px;
}
.ap-flag-mo {
  background-position: -720px -440px;
}
.ap-flag-mp {
  background-position: -720px -460px;
}
.ap-flag-mq {
  background-position: -720px -480px;
}
.ap-flag-mr {
  background-position: -720px -500px;
}
.ap-flag-ms {
  background-position: -720px -520px;
}
.ap-flag-mt {
  background-position: -720px -540px;
}
.ap-flag-mu {
  background-position: -720px -560px;
}
.ap-flag-mv {
  background-position: -720px -580px;
}
.ap-flag-mw {
  background-position: -720px -600px;
}
.ap-flag-mx {
  background-position: -720px -620px;
}
.ap-flag-my {
  background-position: -720px -640px;
}
.ap-flag-mz {
  background-position: -720px -660px;
}
.ap-flag-na {
  background-position: -720px -680px;
}
.ap-flag-nc {
  background-position: -720px -700px;
}
.ap-flag-ne {
  background-position: -720px -720px;
}
.ap-flag-nf {
  background-position: -720px -740px;
}
.ap-flag-ng {
  background-position: -720px -760px;
}
.ap-flag-ni {
  background-position: -720px -780px;
}
.ap-flag-nl {
  background-position: -720px -800px;
}
.ap-flag-no {
  background-position: -740px 0;
}
.ap-flag-np {
  background-position: -740px -20px;
}
.ap-flag-nr {
  background-position: -740px -40px;
}
.ap-flag-nu {
  background-position: -740px -60px;
}
.ap-flag-nz {
  background-position: -740px -80px;
}
.ap-flag-om {
  background-position: -740px -100px;
}
.ap-flag-pa {
  background-position: -740px -120px;
}
.ap-flag-pe {
  background-position: -740px -140px;
}
.ap-flag-pf {
  background-position: -740px -160px;
}
.ap-flag-pg {
  background-position: -740px -180px;
}
.ap-flag-ph {
  background-position: -740px -200px;
}
.ap-flag-pk {
  background-position: -740px -220px;
}
.ap-flag-pl {
  background-position: -740px -240px;
}
.ap-flag-pm {
  background-position: -740px -260px;
}
.ap-flag-pn {
  background-position: -740px -280px;
}
.ap-flag-pr {
  background-position: -740px -300px;
}
.ap-flag-ps {
  background-position: -740px -320px;
}
.ap-flag-pt {
  background-position: -740px -340px;
}
.ap-flag-pw {
  background-position: -740px -360px;
}
.ap-flag-py {
  background-position: -740px -380px;
}
.ap-flag-qa {
  background-position: -740px -400px;
}
.ap-flag-re {
  background-position: -740px -420px;
}
.ap-flag-ro {
  background-position: -740px -440px;
}
.ap-flag-rs {
  background-position: -740px -460px;
}
.ap-flag-ru {
  background-position: -740px -480px;
}
.ap-flag-rw {
  background-position: -740px -500px;
}
.ap-flag-sa {
  background-position: -740px -520px;
}
.ap-flag-sb {
  background-position: -740px -540px;
}
.ap-flag-sc {
  background-position: -740px -560px;
}
.ap-flag-sd {
  background-position: -740px -580px;
}
.ap-flag-se {
  background-position: -740px -600px;
}
.ap-flag-sg {
  background-position: -740px -620px;
}
.ap-flag-sh {
  background-position: -740px -640px;
}
.ap-flag-si {
  background-position: -740px -660px;
}
.ap-flag-sj {
  background-position: -740px -680px;
}
.ap-flag-sk {
  background-position: -740px -700px;
}
.ap-flag-sl {
  background-position: -740px -720px;
}
.ap-flag-sm {
  background-position: -740px -740px;
}
.ap-flag-sn {
  background-position: -740px -760px;
}
.ap-flag-so {
  background-position: -740px -780px;
}
.ap-flag-sr {
  background-position: -740px -800px;
}
.ap-flag-ss {
  background-position: -760px 0;
}
.ap-flag-st {
  background-position: -760px -20px;
}
.ap-flag-sv {
  background-position: -760px -40px;
}
.ap-flag-sx {
  background-position: -760px -60px;
}
.ap-flag-sy {
  background-position: -760px -80px;
}
.ap-flag-sz {
  background-position: -760px -100px;
}
.ap-flag-ta {
  background-position: -760px -120px;
}
.ap-flag-tc {
  background-position: -760px -140px;
}
.ap-flag-td {
  background-position: -760px -160px;
}
.ap-flag-tf {
  background-position: -760px -180px;
}
.ap-flag-tg {
  background-position: -760px -200px;
}
.ap-flag-th {
  background-position: -760px -220px;
}
.ap-flag-tj {
  background-position: -760px -240px;
}
.ap-flag-tk {
  background-position: -760px -260px;
}
.ap-flag-tl {
  background-position: -760px -280px;
}
.ap-flag-tm {
  background-position: -760px -300px;
}
.ap-flag-tn {
  background-position: -760px -320px;
}
.ap-flag-to {
  background-position: -760px -340px;
}
.ap-flag-tr {
  background-position: -760px -360px;
}
.ap-flag-tt {
  background-position: -760px -380px;
}
.ap-flag-tv {
  background-position: -760px -400px;
}
.ap-flag-tw {
  background-position: -760px -420px;
}
.ap-flag-tz {
  background-position: -760px -440px;
}
.ap-flag-ua {
  background-position: -760px -460px;
}
.ap-flag-ug {
  background-position: -760px -480px;
}
.ap-flag-um {
  background-position: -760px -500px;
}
.ap-flag-us {
  background-position: -760px -520px;
}
.ap-flag-uy {
  background-position: -760px -540px;
}
.ap-flag-uz {
  background-position: -760px -560px;
}
.ap-flag-va {
  background-position: -760px -580px;
}
.ap-flag-vc {
  background-position: -760px -600px;
}
.ap-flag-ve {
  background-position: -760px -620px;
}
.ap-flag-vg {
  background-position: -760px -640px;
}
.ap-flag-vi {
  background-position: -760px -660px;
}
.ap-flag-vn {
  background-position: -760px -680px;
}
.ap-flag-vu {
  background-position: -760px -700px;
}
.ap-flag-wf {
  background-position: -760px -720px;
}
.ap-flag-ws {
  background-position: -760px -740px;
}
.ap-flag-xk {
  background-position: -760px -760px;
}
.ap-flag-ye {
  background-position: -760px -780px;
}
.ap-flag-yt {
  background-position: -760px -800px;
}
.ap-flag-za {
  background-position: -780px 0;
}
.ap-flag-zm {
  background-position: -780px -20px;
}
.ap-flag-zw {
  background-position: -780px -40px;
}
.ap-man-man-boy {
  background-position: -780px -60px;
}
.ap-man-man-boy-boy {
  background-position: -780px -80px;
}
.ap-man-man-girl {
  background-position: -780px -100px;
}
.ap-man-man-girl-boy {
  background-position: -780px -120px;
}
.ap-man-man-girl-girl {
  background-position: -780px -140px;
}
.ap-man-woman-boy-boy {
  background-position: -780px -160px;
}
.ap-man-woman-girl {
  background-position: -780px -180px;
}
.ap-man-woman-girl-boy {
  background-position: -780px -200px;
}
.ap-man-woman-girl-girl {
  background-position: -780px -220px;
}
.ap-man-heart-man {
  background-position: -780px -240px;
}
.ap-man-kiss-man {
  background-position: -780px -260px;
}
.ap-woman-woman-boy {
  background-position: -780px -280px;
}
.ap-woman-woman-boy-boy {
  background-position: -780px -300px;
}
.ap-woman-woman-girl {
  background-position: -780px -320px;
}
.ap-woman-woman-girl-boy {
  background-position: -780px -340px;
}
.ap-woman-woman-girl-girl {
  background-position: -780px -360px;
}
.ap-woman-heart-woman {
  background-position: -780px -380px;
}
.ap-woman-kiss-woman {
  background-position: -780px -400px;
}

/* node_modules/quill-mention/dist/quill.mention.min.css */
.ql-mention-list-container {
  width: 270px;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
  background-color: #fff;
  box-shadow: 0 2px 12px 0 rgba(30, 30, 30, .08);
  z-index: 9001;
  overflow: auto;
}
.ql-mention-loading {
  line-height: 44px;
  padding: 0 20px;
  vertical-align: middle;
  font-size: 16px;
}
.ql-mention-list {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.ql-mention-list-item {
  cursor: pointer;
  line-height: 44px;
  font-size: 16px;
  padding: 0 20px;
  vertical-align: middle;
}
.ql-mention-list-item.disabled {
  cursor: auto;
}
.ql-mention-list-item.selected {
  background-color: #d3e1eb;
  text-decoration: none;
}
.mention {
  height: 24px;
  width: 65px;
  border-radius: 6px;
  background-color: #d3e1eb;
  padding: 3px 0;
  margin-right: 2px;
  -webkit-user-select: all;
  user-select: all;
}
.mention > span {
  margin: 0 3px;
}

/* src/assets/drawings/hotspots-styles.css */
body {
  --hotspot-col-out: #00000044;
  --hotspot-col-out-sel: #00000044;
  --hotspot-col-out-light: #FFFFFF44;
  --hotspot-col-out-sel-light: #FFFFFF44;
  --hotspot-col-outline: #00000044;
  --hotspot-col-outline-sel: #00000088;
  --hotspot-col-outline-light: #FFFFFF44;
  --hotspot-col-outline-sel-light: #FFFFFF88;
  --hotspot-col-in: #FFFFFFee;
  --hotspot-col-in-sel: #FFFFFF;
  --hotspot-rgb-pulse:
    25,
    152,
    217;
  --hotspot-diameter: 30px;
  --hotspot-radius: 15px;
  --hotspot-dot-diameter: 12px;
  --hotspot-dot-radius: 6px;
  --hotspot-dot-offset: 8.5px;
}
.hotspot-component {
  height: 100%;
  overflow: hidden;
  position: relative;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
}
img.hotspot-image {
  height: 100%;
  pointer-events: none;
  object-fit: contain;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
}
.hotspot {
  background: var(--hotspot-col-out);
  border: 1px solid var(--hotspot-col-outline);
  box-sizing: border-box;
  border-radius: 50px;
  grid-template-rows: 1fr;
  grid-template-columns: 1fr;
  height: var(--hotspot-diameter);
  position: absolute;
  transition: transform 0.2s ease-in-out;
  width: var(--hotspot-diameter);
}
.hotspot:hover {
  transform: scale(1.25);
}
.hotspot.light {
  background: var(--hotspot-col-out-light);
  border-color: var(--hotspot-col-outline-light);
}
.hotspot.selected {
  background: rgba(var(--hotspot-rgb-pulse), 0.5);
  border-color: var(--hotspot-col-outline-sel);
  box-shadow: 0 0 0 20px rgba(var(--hotspot-rgb-pulse), 0);
  animation: pulse-animation 1s infinite;
}
.hotspot.selected.light {
  border-color: var(--hotspot-col-outline-sel-light);
}
.hotspot.selected:hover {
  animation: swell-animation 0.2s, ease-in-out;
}
.hotspot:active {
  border-color: rgb(var(--hotspot-rgb-pulse));
}
.hotspot-dot {
  background: var(--hotspot-col-in);
  border-radius: 50%;
  height: var(--hotspot-dot-diameter);
  opacity: 0.8;
  transform: translate(var(--hotspot-dot-offset), var(--hotspot-dot-offset));
  width: var(--hotspot-dot-diameter);
}
.hotspot.selected .hotspot-dot {
  background: var(--hotspot-col-in-sel);
  border-color: #00000088;
}
@keyframes pulse-animation {
  0% {
    box-shadow: 0 0 0 0 rgba(var(--hotspot-rgb-pulse), 0.3);
  }
  70% {
    box-shadow: 0 0 0 20px rgba(var(--hotspot-rgb-pulse), 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(var(--hotspot-rgb-pulse), 0);
  }
}
@keyframes swell-animation {
  0% {
    transform: scale(1.0);
  }
  100% {
    transform: scale(1.25);
  }
}
.hotspot-info {
  background: #FFFFFFaa;
  bottom: 0;
  color: black;
  height: 120px;
  left: 0;
  position: absolute;
  width: 100%;
  transition: height 0.5s ease-in-out;
}
.hotspot-info.hide {
  height: 0px;
  transition: height 0.5s ease-in-out;
}
.hotspot-info-content {
  font-size: 0.9rem;
  height: 100%;
  margin: 10px;
  -webkit-user-select: none;
  user-select: none;
}
.hotspot-info-close {
  background: transparent;
  border-radius: 2px;
  cursor: default;
  padding: 1px 6px;
  position: absolute;
  right: 2px;
  top: 2px;
}
.hotspot-info-close:hover {
  background: red;
}

/* angular:styles/global:styles */