:root {
  --color-border-common: #DADEE0;
  --color-border-2: #1CA1C1;
  --color-background-common: #FFFFFF;
  --color-background-2: #EBEDF0;
  --color-background-accent: #657584;
  --color-item: #F4F5F9;
  --color-item-selected: #1992af;
  --color-item-focus: #e7e9f2;
  --color-item-active: #daddeb;
  --color-item-active-selected: #17839d;
  --color-view-text: #475466;
  --color-title-text: #94A1B3;
  --color-section-text: #444;
}

.webix_view {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--color-view-text);
  letter-spacing: 0.2px;
  -webkit-font-smoothing: antialiased;
  cursor: default;
  overflow: hidden;
  border: 0px solid var(--color-border-common);
  background-color: var(--color-background-common);
  white-space: normal;
  -webkit-appearance: none;
  box-sizing: content-box;

  > .webix_disabled {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--color-background-2);
    opacity: 0.6;
    z-index: 92;
    cursor: not-allowed;
  }

  &.no-gray-disabled {
    .webix_disabled {
      opacity: 0;
      cursor: default;
    }
  }

  div {
    outline: none;
  }

  span {
    outline: none;
  }

  a.webix_list_item {
    outline: none;
  }

  div.webix_inp_static:focus {
    outline: none;
  }

  > .webix_cal_header {
    height: 18px;

    div {
      float: left;
      text-align: center;
      height: 17px;
      font-size: 12px;
      color: var(--color-view-text);
      border-bottom: var(--color-border-common) 1px solid;
      line-height: 18px;
      border-bottom-color: transparent;
    }
  }

  input::-ms-clear {
    display: none;
  }

  button {
    -webkit-appearance: none;
    border-width: 0px;

    &::-moz-focus-inner {
      padding: 0;
      border: 0;
    }
  }

  .webix_dt_editor {
    input {
      border-color: var(--color-border-2);
      border-radius: 2px;
    }

    select {
      border-color: var(--color-border-2);
      border-radius: 2px;
    }
  }

  .webix_pager_item {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0px;
    outline: none;
    background: var(--color-item);
    color: var(--color-border-2);
    border-radius: 2px;
    border-width: 0px;

    &:hover {
      background-color: var(--color-item-focus);
    }

    &:focus {
      background-color: var(--color-item-focus);
    }

    &:active {
      background-color: var(--color-item-active);
    }

    .webix_icon {
      font-size: 15px;
    }
  }

  .webix_pager_item_selected {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-background-common);
    letter-spacing: 0px;
    outline: none;
    background: var(--color-border-2);
    border-radius: 2px;
    border-width: 0px;

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  input[type=button] {
    -webkit-appearance: none;
    border-width: 0px;
  }

  table {
    border-collapse: initial;
  }
}

.webix_view.webix_form {
  background-color: var(--color-background-common);
}

body {
  -webkit-tap-highlight-color: transparent !important;

  &:not(:-moz-handler-blocked) .webix_el_select select {
    padding: 0.2em;
  }
}

.webix_abslayout {
  position: relative;

  > .webix_view {
    position: absolute !important;
    z-index: 0;
  }
}

.webix_layout_space {
  background-color: var(--color-background-2);

  > .webix_section > .webix_template {
    padding: 0px 8px;
    background-color: var(--color-background-2);
  }

  > .webix_toolbar {
    border-radius: 2px;
  }

  > .webix_view {
    border-radius: 2px;
  }

  .webix_layout_accordion .webix_accordionitem {
    border-radius: 2px;
  }
}

.webix_layout_wide {
  background-color: var(--color-background-2);

  > .webix_section > .webix_template {
    padding: 0px 8px;
    background-color: var(--color-background-2);
  }

  > .webix_view {
    border-radius: 2px;
  }

  .webix_layout_accordion .webix_accordionitem {
    border-radius: 2px;
  }
}

.webix_layout_line {
  background: transparent;

  > .webix_section > .webix_template {
    padding: 0px 8px;
    background-color: var(--color-background-common);
  }
}

.webix_multiview {
  background: transparent;
}

.webix_layout_clean {
  background: transparent;

  > .webix_section > .webix_template {
    padding: 0px 8px;
    background-color: var(--color-background-common);
  }
}

.webix_layout_accordion {
  background: transparent;
}

.webix_overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 90;
  text-align: center;
  padding-top: 10px;
  box-sizing: border-box;
}

.webix_disabled_view {
  overflow: hidden !important;
  position: relative;

  .panel_icon {
    z-index: 91;
  }

  .webix_disabled_top_label {
    color: var(--color-title-text);
  }
}

body.webix_full_screen {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body.webix_noselect {
  overscroll-behavior: none;
}

.webix_noselect {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  div {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
}

.webix_selectable {
  -moz-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

.webix_template {
  height: 100%;
  padding: 4px 12px;
  box-sizing: border-box;

  .webix_richtext_editor:focus {
    outline: none;
  }
}

.webix_clean {
  background: transparent;

  .webix_template {
    padding: 0px;
  }
}

.webix_section {
  box-sizing: border-box;
  background-color: transparent;
  position: relative;
  color: var(--color-section-text);
  font-size: 10px;
  text-transform: uppercase;
  line-height: 36px;

  &:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--color-border-common);
    position: absolute;
    top: 50%;
  }

  > .webix_template {
    padding: 0px 8px;
    margin-left: 30px;
    background-color: var(--color-background-common);
    display: inline;
    position: relative;
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-view-text);
    letter-spacing: 0.2px;
  }
}

.webix_header {
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-view-text);
  letter-spacing: 0px;
  line-height: 34px;

  .webix_el_label .webix_el_box {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-view-text);
    letter-spacing: 0px;
  }

  > div {
    line-height: 36px;
    padding-left: 12px;
    padding-top: 0;
    padding-bottom: 0;
  }
}

.webix_header.webix_dark {
  background: var(--color-background-accent);
  border-color: var(--color-background-accent);
  color: var(--color-background-common);

  .webix_el_button {
    color: var(--color-background-common);
  }

  .webix_el_label .webix_el_box {
    color: var(--color-background-common);
  }

  .webix_inp_label {
    color: var(--color-background-common);
  }

  .webix_inp_top_label {
    color: var(--color-background-common);
  }

  .webix_slider_title {
    color: var(--color-background-common);
  }

  .webix_secondary {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      background-color: rgba(0, 0, 0, 0.2);
      color: var(--color-background-common);
      border-color: transparent;

      &:hover {
        color: var(--color-background-common);
        background-color: rgba(0, 0, 0, 0.4);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.4);
        color: var(--color-background-common);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.5);
        color: var(--color-background-common);
      }
    }
  }

  .webix_transparent {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      color: var(--color-background-common);

      &:hover {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.4);
      }
    }
  }

  .webix_inp_counter_next {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_inp_counter_prev {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_0 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_1 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_N {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_menu-x .webix_list_item {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_view > .webix_template {
    color: var(--color-background-common);
    background-color: var(--color-background-accent);
  }

  .webix_inp_static {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    input[type=text] {
      background-color: transparent;
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=text] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=combo] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=datepicker] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  textarea {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  select {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    option {
      background-color: var(--color-background-accent);
      color: var(--color-background-common);
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  .webix_text_highlight {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_el_texthighlight {
    input {
      caret-color: rgba(255, 255, 255, 0.7);
    }

    textarea {
      caret-color: rgba(255, 255, 255, 0.7);
    }
  }

  .webix_multicombo_value {
    color: var(--color-background-accent);
  }

  .webix_multicombo_tag {
    color: var(--color-background-accent);
  }

  .webix_el_counter {
    button {
      background-color: rgba(0, 0, 0, 0.3);
    }

    input[type=text]:focus {
      border-color: transparent;
    }
  }

  .webix_placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  ::placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_input_icon {
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_selected.webix_segment_0 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_1 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_N {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_img_btn_top {
    border-width: 0;

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon {
      color: var(--color-background-common);
    }
  }

  .webix_el_icon {
    color: var(--color-background-common);
  }

  .webix_img_btn {
    color: var(--color-background-common);
    border-width: 0;
  }

  .webix_icon_btn {
    color: var(--color-background-common);
  }

  .webix_icon_button {
    color: var(--color-background-common);

    &:hover {
      &:before {
        background-color: rgba(0, 0, 0, 0.2);
      }

      .webix_icon {
        opacity: 1;
      }
    }

    &:focus .webix_icon {
      opacity: 1;
    }

    .webix_icon {
      color: var(--color-background-common);
      opacity: 0.7;
    }
  }

  .webix_control {
    border-color: var(--color-border-2);
  }

  .webix_custom_checkbox {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_custom_radio {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_label_right {
    color: var(--color-background-common);
  }

  .webix_view.webix_control .webix_disabled_box {
    .webix_button {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    label {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_input_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    button {
      color: rgba(255, 255, 255, 0.4);
    }

    input {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    select {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    textarea {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_static {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;

      input {
        background-color: transparent;
      }
    }

    .webix_inp_counter_prev {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_counter_next {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_segment_0 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_N {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_item_tab {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_1.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_N.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }
  }

  .webix_disabled_view.webix_control {
    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_view.webix_menu-x .webix_list_item.menu {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_toolbar .webix_disabled_view.webix_control {
    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_top_label {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_invalid {
    .webix_el_box {
      input {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      .webix_inp_static {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;

        input {
          background-color: transparent;
        }
      }

      select {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      textarea {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }
    }

    .webix_multicombo_value {
      color: #FF5C4C;
    }

    .webix_multicombo_tag {
      color: #FF5C4C;
    }
  }

  input.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  select.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  textarea.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }
}

.webix_spacer {
  background: transparent;
}

.webix_view_animate {
  position: relative;
  width: 100%;
  height: 100%;
}

x\:ui {
  display: none;
}

.webix_view.webix_flexlayout {
  display: flex !important;
  flex-wrap: wrap;
  flex-direction: row;
  overflow: hidden;
  box-sizing: border-box;
}

.webix_flexlayout > div {
  display: block !important;
}

.webix_view_align {
  background: transparent;
}

.webix_view.webix_window {
  outline: none;
}

textarea {
  outline: none;
}

input {
  outline: none;
}

select {
  outline: none;
}

button {
  outline: none;
}

.webix_resize_area {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

.webix_resize_handle_x {
  box-sizing: border-box;
  cursor: ew-resize;
  width: 1px;
  height: 100%;
  position: absolute;
  z-index: 2;
  top: 0px;

  .webix_handle_content {
    width: 100%;
    height: 100%;
    background: rgba(100, 100, 100, 0.1);
    border: 1px dotted #ebebeb;
    border-width: 0px 1px;
  }
}

.webix_resize_handle_y {
  cursor: ns-resize;
  height: 1px;
  width: 100%;
  position: absolute;
  z-index: 2;
  left: 0px;

  .webix_handle_content {
    width: 100%;
    height: 100%;
    background: rgba(100, 100, 100, 0.1);
    border: 1px dotted #ebebeb;
    border-width: 1px 0px;
  }
}

.webix_resize_origin_x {
  cursor: ew-resize;
  width: 3px;
  height: 100%;
  position: absolute;
  z-index: 2;
  top: 0px;
}

.webix_resize_origin_y {
  cursor: ns-resize;
  height: 3px;
  width: 100%;
  position: absolute;
  z-index: 2;
  left: 0px;
}

.webix_resizer {
  position: relative;
}

.webix_resizer.webix_disabled_view {
  cursor: default;
}

.webix_resizer_vy {
  cursor: ns-resize;
  margin-top: 0px !important;
  border: 0px !important;
  padding: 0px !important;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAADAQMAAABCowZuAAAABlBMVEUAAACkvtSA7tmIAAAAAXRSTlMAQObYZgAAAA9JREFUCB1jXMUABoxAGgAJaAFXPIkJqAAAAABJRU5ErkJggg==") no-repeat center center;
}

.webix_resizer_vx {
  cursor: ew-resize;
  margin-left: 0px !important;
  border: 0px !important;
  padding: 0px !important;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAXAQMAAAD0oWdxAAAABlBMVEUAAACkvtSA7tmIAAAAAXRSTlMAQObYZgAAAA5JREFUeF5jWMDAQDwGAKyuB4FpGQdzAAAAAElFTkSuQmCC") no-repeat center center;
}

.webix_resizer_y {
  cursor: ns-resize;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAADAQMAAABCowZuAAAABlBMVEUAAACkvtSA7tmIAAAAAXRSTlMAQObYZgAAAA9JREFUCB1jXMUABoxAGgAJaAFXPIkJqAAAAABJRU5ErkJggg==") no-repeat center center;
  background-color: var(--color-background-common);
}

.webix_resizer_x {
  cursor: ew-resize;
  background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAXAQMAAAD0oWdxAAAABlBMVEUAAACkvtSA7tmIAAAAAXRSTlMAQObYZgAAAA5JREFUeF5jWMDAQDwGAKyuB4FpGQdzAAAAAElFTkSuQmCC") no-repeat center center;
  background-color: var(--color-background-common);
}

.webix_accordionitem_body {
  position: relative;

  > div {
    border-width: 0px!important;
  }
}

.webix_accordionitem_header {
  border-bottom: 1px solid var(--color-border-common);
  position: relative;
  z-index: 2;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-view-text);
  letter-spacing: 0px;
  line-height: 34px;
  cursor: pointer;
  overflow: hidden;

  .webix_el_label .webix_el_box {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-view-text);
    letter-spacing: 0px;
  }
}

.webix_accordionitem_header.webix_dark {
  color: var(--color-background-common);
  background: var(--color-background-accent);
  border-color: var(--color-background-accent);

  .webix_el_button {
    color: var(--color-background-common);
  }

  .webix_el_label .webix_el_box {
    color: var(--color-background-common);
  }

  .webix_inp_label {
    color: var(--color-background-common);
  }

  .webix_inp_top_label {
    color: var(--color-background-common);
  }

  .webix_slider_title {
    color: var(--color-background-common);
  }

  .webix_secondary {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      background-color: rgba(0, 0, 0, 0.2);
      color: var(--color-background-common);
      border-color: transparent;

      &:hover {
        color: var(--color-background-common);
        background-color: rgba(0, 0, 0, 0.4);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.4);
        color: var(--color-background-common);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.5);
        color: var(--color-background-common);
      }
    }
  }

  .webix_transparent {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      color: var(--color-background-common);

      &:hover {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.4);
      }
    }
  }

  .webix_inp_counter_next {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_inp_counter_prev {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_0 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_1 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_N {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_menu-x .webix_list_item {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_view > .webix_template {
    color: var(--color-background-common);
    background-color: var(--color-background-accent);
  }

  .webix_inp_static {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    input[type=text] {
      background-color: transparent;
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=text] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=combo] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=datepicker] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  textarea {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  select {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    option {
      background-color: var(--color-background-accent);
      color: var(--color-background-common);
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  .webix_text_highlight {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_el_texthighlight {
    input {
      caret-color: rgba(255, 255, 255, 0.7);
    }

    textarea {
      caret-color: rgba(255, 255, 255, 0.7);
    }
  }

  .webix_multicombo_value {
    color: var(--color-background-accent);
  }

  .webix_multicombo_tag {
    color: var(--color-background-accent);
  }

  .webix_el_counter {
    button {
      background-color: rgba(0, 0, 0, 0.3);
    }

    input[type=text]:focus {
      border-color: transparent;
    }
  }

  .webix_placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  ::placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_input_icon {
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_selected.webix_segment_0 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_1 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_N {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_img_btn_top {
    border-width: 0;

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon {
      color: var(--color-background-common);
    }
  }

  .webix_el_icon {
    color: var(--color-background-common);
  }

  .webix_img_btn {
    color: var(--color-background-common);
    border-width: 0;
  }

  .webix_icon_btn {
    color: var(--color-background-common);
  }

  .webix_icon_button {
    color: var(--color-background-common);

    &:hover {
      &:before {
        background-color: rgba(0, 0, 0, 0.2);
      }

      .webix_icon {
        opacity: 1;
      }
    }

    &:focus .webix_icon {
      opacity: 1;
    }

    .webix_icon {
      color: var(--color-background-common);
      opacity: 0.7;
    }
  }

  .webix_control {
    border-color: var(--color-border-2);
  }

  .webix_custom_checkbox {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_custom_radio {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_label_right {
    color: var(--color-background-common);
  }

  .webix_view.webix_control .webix_disabled_box {
    .webix_button {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    label {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_input_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    button {
      color: rgba(255, 255, 255, 0.4);
    }

    input {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    select {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    textarea {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_static {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;

      input {
        background-color: transparent;
      }
    }

    .webix_inp_counter_prev {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_counter_next {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_segment_0 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_N {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_item_tab {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_1.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_N.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }
  }

  .webix_disabled_view.webix_control {
    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_view.webix_menu-x .webix_list_item.menu {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_toolbar .webix_disabled_view.webix_control {
    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_top_label {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_invalid {
    .webix_el_box {
      input {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      .webix_inp_static {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;

        input {
          background-color: transparent;
        }
      }

      select {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      textarea {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }
    }

    .webix_multicombo_value {
      color: #FF5C4C;
    }

    .webix_multicombo_tag {
      color: #FF5C4C;
    }
  }

  input.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  select.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  textarea.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }
}

.webix_accordionitem_label {
  height: 100%;
  padding-left: 12px;

  .webix_icon {
    margin-right: 8px;
  }
}

.webix_accordionitem_button {
  float: right;
  position: relative;
  height: 11px;
  width: 11px;
  margin: 10.5px 9px;
}

.webix_carousel {
  position: relative;

  > .webix_scroll_x {
    background-color: rgba(0, 0, 0, 0);
  }

  > .webix_scroll_y {
    background-color: rgba(0, 0, 0, 0);
  }
}

.webix_nav_panel {
  bottom: 16px;
  height: 14px;
  line-height: 14px;
  overflow: hidden;
  position: absolute;
  text-align: center;
  padding: 2px 0;

  .webix_nav_item {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.4);
    opacity: 1;

    &:hover {
      border-color: rgba(255, 255, 255, 0.6);
    }
  }

  .webix_nav_active {
    background-color: var(--color-background-common);
  }
}

.webix_nav_item {
  display: inline-block;
  height: 10px;
  margin: 0 2px;
  width: 10px;
  cursor: pointer;
  border-radius: 50%;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  box-sizing: content-box;
}

.webix_nav_inactive {
  border: 2px solid rgba(0, 0, 0, 0.15);
  opacity: 0.6;
  background: #fff;
}

.webix_nav_active {
  border: 2px solid rgba(0, 0, 0, 0.1);
  background: #fff;

  &:hover {
    box-shadow: 0 0 2px #fff;
  }

  &:focus {
    box-shadow: 0 0 2px #fff;
  }
}

.webix_nav_button_prev {
  cursor: pointer;
  display: block;
  height: 32px;
  line-height: 32px;
  position: absolute;
  width: 32px;

  .webix_nav_button_inner {
    height: 100%;
    width: 100%;
    opacity: 1;
    background-image: none;
    text-align: center;
    font-family: "Webix Material Icons";
    font-size: 24px;
    color: var(--color-background-common);
    border-radius: 50%;

    &:hover {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.2);
      transition: 0.15s;
    }

    &:focus {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.2);
      transition: 0.15s;
    }

    &:before {
      content: "\F002";
    }
  }
}

.webix_nav_button_next {
  cursor: pointer;
  display: block;
  height: 32px;
  line-height: 32px;
  position: absolute;
  width: 32px;

  .webix_nav_button_inner {
    height: 100%;
    width: 100%;
    opacity: 1;
    background-image: none;
    text-align: center;
    font-family: "Webix Material Icons";
    font-size: 24px;
    color: var(--color-background-common);
    border-radius: 50%;

    &:hover {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.2);
      transition: 0.15s;
    }

    &:focus {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.2);
      transition: 0.15s;
    }

    &:before {
      content: "\F003";
    }
  }
}

.webix_nav_panel_corner {
  right: 80px;
}

.webix_nav_button_corner.webix_nav_button_prev {
  bottom: 9px;
  right: 44px;

  .webix_nav_button_inner {
    &:hover {
      opacity: 1;
    }

    &:focus {
      opacity: 1;
    }
  }
}

.webix_nav_button_corner.webix_nav_button_next {
  bottom: 9px;
  right: 8px;

  .webix_nav_button_inner {
    &:hover {
      opacity: 1;
    }

    &:focus {
      opacity: 1;
    }
  }
}

.webix_nav_panel_side {
  margin: 0 auto;
  left: 0;
  width: 100%;
}

.webix_nav_button_side {
  height: 86px;
  line-height: 86px;
  width: 56px;
  top: 50%;
  margin-top: -43px;
}

.webix_nav_button_side.webix_nav_button_next {
  left: auto;
  right: 0;

  .webix_nav_button_inner {
    opacity: 1;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAiCAYAAACwaJKDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTc4MTkxODY2MzBGMTFFMzk1MUQ4RTNCRjNCMUVFRUMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTc4MTkxODU2MzBGMTFFMzk1MUQ4RTNCRjNCMUVFRUMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA4NjlGM0NFNjE4OTExRTNBRjMwOTNFODNBRTJCRENBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjA4NjlGM0NGNjE4OTExRTNBRjMwOTNFODNBRTJCRENBIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+D/KEcQAAAOhJREFUeNqs1jsOwjAMBuCKhR2uxsLGxg1a+hD0wVGYGJC4DgssnAFVQjLukKWk/WM7lv4OqfQ1UdLWCRGtOTdOz3lwtpzEkuFyp/9KreiX/JVa0DdNV6ZF9zRfmQYdcgbwQYNGhccDXQzYN4jgXIOa4bkntgAuNKgaDtlNMRx69hoAlxpUBEvfawRXGnRIjeBFIq8e3F9KZ5mDWXbS5QeBEjQYDEULALbSwy8GEYrARvpBUYNTaGkBfagZHKMIrKU/vioW6NANAE+aZuIVE3RoHxN06NUDHq2t5Ipz4Xw4T87O2vT+BBgAeQQKvezNqP0AAAAASUVORK5CYII=");
    text-align: center;
    font-family: "Webix Material Icons";
    font-size: 48px;
    color: var(--color-background-common);
    background: rgba(0, 0, 0, 0.2);
    border-radius: 2px;

    &:hover {
      opacity: 1;
      background: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      opacity: 1;
      background: rgba(0, 0, 0, 0.4);
    }
  }
}

.webix_nav_button_side.webix_nav_button_prev {
  left: 0;
  right: auto;

  .webix_nav_button_inner {
    opacity: 1;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAiCAYAAACwaJKDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjIzRTVCQkY2MzBGMTFFM0FDNTBDNzdDRkQ0NTI0NzciIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjIzRTVCQkU2MzBGMTFFM0FDNTBDNzdDRkQ0NTI0NzciIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA4NjlGM0NFNjE4OTExRTNBRjMwOTNFODNBRTJCRENBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjA4NjlGM0NGNjE4OTExRTNBRjMwOTNFODNBRTJCRENBIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+wRT1eAAAAM9JREFUeNqs1jsKwlAQBdDBxlL3ZmVlmRXYaaVbCYg7kti4BQu1e85AhBDfZz73wm1ewsmfDKWUKNgNd+C+uVfuOgoe0n8uaFDyQoOSOxqU7NDgUfaDgxZUDWpRE6hBzWALdYE11A2W0BCYQ8PgHIWAUxQG/lAoKF0Q0ZLq+ZA1o35qnO3eevlweL4AgXOL5yhc2hCCa0d0w63744I1T9MMa989E2z5/NSw9Retgj3DRAveeseeGnyLDGgl+BkdJXNwH0WlHfcxDr09d/UVYADVjwptZ8mPvQAAAABJRU5ErkJggg==");
    text-align: center;
    font-family: "Webix Material Icons";
    font-size: 48px;
    color: var(--color-background-common);
    background: rgba(0, 0, 0, 0.2);
    border-radius: 2px;

    &:hover {
      opacity: 1;
      background: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      opacity: 1;
      background: rgba(0, 0, 0, 0.4);
    }
  }
}

.webix_dark {
  .webix_nav_inactive {
    background-color: transparent;
  }

  .webix_nav_active {
    background-color: #000000;

    &:hover {
      box-shadow: 0 0 2px #000;
    }

    &:focus {
      box-shadow: 0 0 2px #000;
    }
  }

  .webix_nav_button_prev .webix_nav_button_inner {
    background-image: none;
    color: #313131;

    &:hover {
      background-color: rgba(255, 255, 255, 0.2);
    }

    &:focus {
      background-color: rgba(255, 255, 255, 0.2);
    }
  }

  .webix_nav_button_next .webix_nav_button_inner {
    background-image: none;
    color: #313131;

    &:hover {
      background-color: rgba(255, 255, 255, 0.2);
    }

    &:focus {
      background-color: rgba(255, 255, 255, 0.2);
    }
  }

  .webix_nav_button_side.webix_nav_button_prev .webix_nav_button_inner {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAiCAYAAACwaJKDAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gcdCSI77dsQJgAAARxJREFUSMet1jFqAkEUxvH/rkIqLVN5ES2CjScQG6tUESx3SWOMLKgggt7BC6SxsnIr9w4ewAsEEis3RTBE3N3ZmfemHB4/HsPMm89L0xTJilbrLrAAGsAWeKkKwTEw/bfVAy6ea6cZ4HV9+8ogwMm6UwMI8Owrg5MoDDa+MjgF8LXBUqgtaERdwELUFcxFJWAmKgXvUA3wBtUC/1BNEKBCra4KXjt9MNScbadYJd7t9nGSVIGnnJpOnCRf7VbzYNMpURi8A7OCumW0Wr9aodrw7T39hedS+P5FhcFYCme/fSGcP6UEcPE8dYTNk98BLvdHWcLlf1ML2CVMzIC3gpK+U5YywEdJQMuDP50CmuGMt55C6B0AI+AR+ACGPw26r6m12WOpAAAAAElFTkSuQmCC");
    background: rgba(255, 255, 255, 0.2);

    &:hover {
      opacity: 1;
      background: rgba(255, 255, 255, 0.4);
    }

    &:focus {
      opacity: 1;
      background: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_nav_button_side.webix_nav_button_next .webix_nav_button_inner {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAiCAYAAACwaJKDAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gcdCSE1IU5u4gAAAW1JREFUSMet1rtOwzAUgOG/5jbBwsQD8BAwIAa2TggegjmRgELbuFeo1GRlQEJMMDN264CUiYdgg0dolzIkFUEk9nHSbLGtT76cc+xaMA53gUegDnwCgfa9Vyp8CngCToFNYB940WF0WRWt57SPqsAK+C7oG+kwuiqLdg3992Xgtelk8jGN4w3gqGDMyTSOZ8eHB+8uM0X7XhMYGMbd6TC6dkIzcH8VsMr+aN9rCeCGEyqEhzZY5TWmcM8C3zihKdy2wIMiWJmWURZWtk1P4a4FvnVCUziwwP0srKQBLYSbALXFYuGU1zqMNBAYhrRUiSI0s/RvKcdZNoChcQt8Tz5TKSg/fQdQFqdJcJvAXha0Z1QCDixgW577drCbBxZXKRkYyOtpkm6lwf+VPwH7VcC/d5Qd7EjA39s0KQQ2UIvvfbZ3zoEHU2Rp3+u4vlDGqwSX6N4qwSX6ltMelAUB1oELYA6cAV/poTxXeZ/+AOFqn1e/Gh7yAAAAAElFTkSuQmCC");
    background: rgba(255, 255, 255, 0.2);

    &:hover {
      opacity: 1;
      background: rgba(255, 255, 255, 0.4);
    }

    &:focus {
      opacity: 1;
      background: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_nav_item {
    border-color: rgba(0, 0, 0, 0.4);

    &:hover {
      border-color: rgba(0, 0, 0, 0.6);
    }
  }
}

.webix_list_item {
  box-sizing: border-box;
  padding: 2px 12px;
  line-height: 23px;
  cursor: pointer;
  border-bottom: 1px solid #EDEFF0;
  text-align: left;
  border-color: #EDEFF0;

  .webix_badge {
    position: static;
    float: right;
    margin: 4px -5px 0 12px;
  }

  .webix_icon {
    font-size: 20px;
  }
}

.webix_list_icon {
  vertical-align: middle;
  margin-right: 4px;
}

.webix_list_item.webix_invalid {
  background-color: #ffdedb;
  color: #FF5C4C;
}

.webix_list_item.webix_selected {
  color: var(--color-view-text);
  background: var(--color-item);
  box-shadow: inset 2px 0 var(--color-border-2);

  &:focus {
    background: #edeff5;
  }
}

.webix_list {
  .webix_list_item.webix_selected {
    border-bottom: 1px solid #EDEFF0;
    padding: 2px 12px;
  }

  .webix_drop_area {
    border-bottom: 1px solid #EDEFF0;
  }

  .webix_unit_header {
    font-weight: 500;
    text-shadow: none;
    border-bottom: 1px solid var(--color-border-common);
    box-sizing: border-box;
    background: var(--color-item);
    font-family: Roboto, sans-serif;
    font-size: 12px;
    color: #313131;
    letter-spacing: 0;

    &:not(:first-child) {
      border-top: 1px solid var(--color-border-common);
      margin-top: -1px;
    }
  }
}

.webix_group {
  position: relative;
}

.webix_group_back {
  position: relative;
  background: var(--color-item);
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  padding-left: 33px;

  .webix_arrow_icon {
    left: 8px;

    &:before {
      content: '\F002';
    }
  }
}

.webix_group_back.webix_selected {
  position: relative;
  background: var(--color-item);
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
}

.webix_arrow_icon {
  position: absolute;
  top: 50%;
  bottom: 50%;
  margin-top: -11px;
  right: 8px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  color: var(--color-view-text);
  font-size: 18px;
  font-family: "Webix Material Icons";

  &:before {
    content: '\F003';
  }
}

.dhx_pagelist {
  position: relative;
}

.webix_list_count {
  float: right;
  width: 25px;
  font-size: 14px;
  text-align: center;
  margin-right: 45px;
  box-shadow: 0 1px 0 #000000;
  text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.6);
}

.webix_unit_header {
  padding: 0 12px;
  line-height: 27px;
  text-align: left;
  background-color: var(--color-item);
}

.webix_list-x {
  .webix_list_item {
    display: inline-block;
    vertical-align: top;
    border-right: 1px solid #EDEFF0;
    border-bottom: none;
    border-color: #EDEFF0;
  }

  .webix_list_item.webix_selected {
    border-left: none;
    border-right: 1px solid #EDEFF0;
    padding-left: 12px;
    box-shadow: none;
  }

  .webix_scroll_cont {
    display: inline-block;
  }

  .webix_drop_area {
    display: inline-block;
    border-right: 1px solid #EDEFF0;
  }
}

.webix_view.webix_list-x {
  white-space: nowrap;
}

.webix_list_item.webix_disabled {
  color: var(--color-title-text);
  background-color: var(--color-background-common);
  cursor: not-allowed;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  &:focus {
    background-color: var(--color-background-common);
  }

  .webix_badge {
    background-color: #eab993;
  }

  .webix_submenu_icon {
    visibility: hidden;
  }
}

.webix_view.webix_pager {
  padding: 3px 0;
  box-sizing: border-box;
  background-color: transparent;
}

.webix_pager_item {
  padding: 0 6px;
  text-align: center;
  height: 100%;
  width: auto;
  min-width: 32px;
  margin: 0 2px;
  cursor: pointer;
  box-sizing: border-box;
  border-radius: 2px;
  background: var(--color-item);
  color: var(--color-border-2);

  .webix_icon {
    line-height: 0;
    font-size: 17px;
  }

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_pager_item_selected {
  padding: 0 6px;
  text-align: center;
  height: 100%;
  width: auto;
  min-width: 32px;
  margin: 0 2px;
  cursor: default;
  box-sizing: border-box;
  border-radius: 2px;

  .webix_icon {
    line-height: 0;
    font-size: 17px;
  }

  &:hover {
    background-color: var(--color-item-selected);
  }

  &:focus {
    background-color: var(--color-item-selected);
  }

  &:active {
    background-color: var(--color-item-active-selected);
  }
}

.webix_animation {
  .webix_ss_header {
    position: relative;
    z-index: 1;
  }

  .webix_ss_vscroll_header {
    z-index: 1;
  }

  .webix_ss_footer {
    position: absolute;
    bottom: 0px;
    z-index: 1;
  }

  .webix_vscroll_x {
    position: absolute;
    bottom: 0px;
    z-index: 1;
  }
}

.webix_allow_selection {
  -moz-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

.webix_dataview_item {
  box-sizing: border-box;
  padding: 2px 12px;
  line-height: 23px;
  cursor: pointer;
  border-bottom: 1px solid #EDEFF0;
  text-align: left;
  border-color: #EDEFF0;
  border-right: 1px solid #EDEFF0;
  border-right-color: #EDEFF0;

  .webix_icon {
    font-size: 20px;
  }
}

.webix_dataview_item.webix_selected {
  box-shadow: none;
  color: var(--color-view-text);
  background: var(--color-item);
  border-bottom: 1px solid #EDEFF0;
  border-right: 1px solid #EDEFF0;

  &:focus {
    background: #edeff5;
  }
}

.webix_dataview_item.webix_disabled {
  color: var(--color-title-text);
}

.webix_dataview_item.webix_selected.webix_disabled {
  box-shadow: inset 2px 0 var(--color-title-text);
}

.webix_dataview_item.webix_invalid {
  background-color: #ffdedb;
  color: #FF5C4C;
}

.webix_dataview_item.tiles {
  border: 1px solid #EDEFF0;
  box-sizing: border-box;
}

.webix_drag_zone {
  position: absolute;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  background-color: var(--color-background-common);
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--color-view-text);
  letter-spacing: 0.2px;
  pointer-events: none;

  > .webix_dataview_item.tiles {
    margin: 0 !important;
  }

  .webix_tree_item {
    padding: 0 8px;

    .webix_tree_open {
      display: none;
    }

    .webix_tree_close {
      display: none;
    }

    .webix_tree_none {
      display: none;
    }
  }

  .webix_ss_hscroll {
    display: none !important;
  }

  .webix_ss_vscroll {
    display: none !important;
  }

  > .webix_badge {
    top: -14px;
    right: -14px;
  }
}

.webix_dataview {
  .webix_scroll_cont {
    box-sizing: border-box;
  }

  .webix_drop_area {
    float: left;
    background-color: transparent;
  }

  .webix_drop_area_inner {
    border-right: 1px solid #EDEFF0;
    border-bottom: 1px solid #EDEFF0;
  }
}

.webix_chart {
  position: relative;
  font-family: Roboto, sans-serif;
  font-size: 13px;
  color: var(--color-view-text);
  overflow: hidden;
  z-index: 1;

  canvas {
    position: absolute;
  }

  .webix_canvas_text {
    border-radius: 4px;
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-view-text);
    letter-spacing: 0.2px;
  }

  .webix_canvas_text.webix_inner_text_dark {
    color: var(--color-view-text);
    text-shadow: 0 0 4px var(--color-background-common);
    padding: 0 2px;
  }

  .webix_canvas_text.webix_inner_text_light {
    color: var(--color-background-common);
    text-shadow: 0 0 4px var(--color-view-text);
    padding: 0 2px;
  }

  .webix_chart_legend_item {
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-view-text);
    letter-spacing: 0.2px;
  }

  .webix_axis_title_x {
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-title-text);
    letter-spacing: 0.2px;
  }

  .webix_axis_title_y {
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-title-text);
    letter-spacing: 0.2px;
  }

  .webix_canvas_text.webix_axis_item_x {
    color: var(--color-title-text);
  }

  .webix_canvas_text.webix_axis_item_y {
    color: var(--color-title-text);
  }

  .webix_canvas_text.webix_axis_radar_title {
    color: var(--color-title-text);
  }
}

.webix_canvas_text {
  position: absolute;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  font-size: 12px;
  z-index: 80;
}

.webix_map_img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  border: 0px;
  opacity: 0;
  -webkit-user-select: none;
}

.webix_axis_item_y {
  position: absolute;
  height: 18px;
  line-height: 18px;
  margin-top: -4px;
  text-align: right;
  color: #74869f;
}

.webix_axis_item_x {
  padding-top: 2px;
  color: #74869f;
}

.webix_axis_title_x {
  text-align: center;
  font-size: 13px;
}

.webix_axis_title_y {
  text-align: center;
  font-family: Verdana;
  font-size: 13px;
  transform: rotate(-90deg);
  padding-left: 3px;
}

.webix_chart_legend {
  position: absolute;
  z-index: 81;
}

.webix_chart_legend_item {
  height: 18px;
  line-height: 18px;
  padding: 2px;
  cursor: pointer;
}

.webix_chart_legend_item.hidden {
  color: #cfd5dd;
}

.webix_axis_item_y.webix_radar {
  color: #555;
  font-size: 11px;
  padding-right: 3px;
  height: 13px;
  line-height: 13px;
  margin-top: 0px;
}

.webix_canvas_text.webix_axis_radar_title {
  margin-top: 0px;
  padding-top: 0px;
  color: #74869f;
  font-size: 12px;
}

.webix_chart_frame {
  background-color: #a0cfef;
  height: 100%;
  opacity: 0.3;
  position: absolute;
  top: 0;
  z-index: 82;
  border-left: 1px solid #3498db;
  border-right: 1px solid #3498db;
  cursor: w-resize;
}

.webix_chart_resizer {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAICAYAAAAx8TU7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTJCMjdFNENBRTg4MTFFMjk2NjJGMTJENjkyNDA2NTkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTJCMjdFNERBRTg4MTFFMjk2NjJGMTJENjkyNDA2NTkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5MkIyN0U0QUFFODgxMUUyOTY2MkYxMkQ2OTI0MDY1OSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5MkIyN0U0QkFFODgxMUUyOTY2MkYxMkQ2OTI0MDY1OSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Powz/icAAAAaSURBVHjaYmBgYDBjgAA4zcSABQysIECAAQBn+ACx2PqtbAAAAABJRU5ErkJggg==");
  background-position: 3px center;
  background-repeat: no-repeat;
  border-radius: 2px;
  height: 20px;
  bottom: 0;
  width: 11px;
  z-index: 83;
  position: absolute;
  background-color: #fff;
  border: 1px solid #cccccc;
  cursor: w-resize;

  &:focus {
    border-color: var(--color-border-2);
  }
}

.webix_wresize_cursor {
  cursor: w-resize;
}

.webix_donut_center_text {
  display: inline-block;
  line-height: normal;
  white-space: normal;
  vertical-align: middle;
}

.webix_dt_editor {
  position: absolute;
  z-index: 2;
  overflow: visible;
  background: var(--color-background-common);

  input {
    width: 100%;
    box-sizing: border-box;
    padding: 0 11px;
    margin: 0;
    border: 1px solid #ffd700;
    height: 100%;
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-view-text);
    letter-spacing: 0.2px;
  }

  select {
    width: 100%;
    box-sizing: border-box;
    padding: 0 7px;
    margin: 0;
    border: 1px solid #ffd700;
    height: 100%;
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-view-text);
    letter-spacing: 0.2px;
  }

  input[type="checkbox"] {
    margin: 7px 13px 0px;
    height: auto;
    width: auto;
  }
}

.webix_clipbuffer {
  width: 2000px;
  height: 1px;
  padding: 0;
  margin: 0;
  border: 0;
  left: 0px;
  top: 0px;
  white-space: pre-wrap;
  position: fixed;
  opacity: 0;
  pointer-events: none;
  cursor: default;
}

.webix_dt_editor.webix_password_editor {
  overflow: hidden;
}

.webix_password_editor {
  input {
    padding-right: 26px;
  }

  .webix_icon {
    position: absolute;
    right: 4px;
    top: 50%;
    margin-top: -9px;
    font-size: 18px;
    cursor: pointer;
    color: var(--color-title-text);

    &:hover {
      color: var(--color-border-2);
    }
  }
}

.webix_column {
  position: absolute;
  top: 0px;
  text-align: left;

  > div {
    border-right: 1px solid #EDEFF0;
    padding: 0 12px;
    border-bottom: 1px solid #EDEFF0;
  }

  > .webix_drag_over.webix_cell {
    background-color: #e6e6e6;
    color: var(--color-view-text);
  }

  > .webix_drag_over.webix_cell.webix_row_select {
    color: var(--color-view-text);
    background: var(--color-item);

    &:focus {
      background: #edeff5;
    }
  }

  > .webix_drag_over.webix_cell.webix_cell_select {
    color: var(--color-view-text);
    background: var(--color-item);

    &:focus {
      background: #edeff5;
    }
  }

  > div.webix_cell_select {
    color: var(--color-view-text);
    background: var(--color-item);
    border-bottom: 1px solid #EDEFF0;
    border-left: 1px solid #EDEFF0;
    border-right: 1px solid #EDEFF0;
    padding-top: 0px;
    padding-left: 11px;

    &:focus {
      background: #edeff5;
    }
  }

  > div.webix_column_select {
    color: var(--color-view-text);
    background: var(--color-item);
    border-left: 1px solid #EDEFF0;
    border-right: 1px solid #EDEFF0;
    padding-left: 11px;

    &:focus {
      background: #edeff5;
    }
  }

  > div.webix_row_select {
    color: var(--color-view-text);
    background: var(--color-item);
    border-bottom: 1px solid #EDEFF0;
    padding-top: 0px;

    &:focus {
      background: #edeff5;
    }
  }
}

.webix_hcolumn {
  position: absolute;
  top: 0px;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);
  text-align: left;
}

.webix_cell {
  overflow: hidden;
  line-height: 25px;
  white-space: nowrap;
  background: inherit;
  font: inherit;
  text-align: inherit;
  color: inherit;
  box-sizing: border-box;

  .webix_tree_close {
    background-color: transparent;
  }

  .webix_tree_open {
    background-color: transparent;
  }

  .webix_tree_none {
    background-color: transparent;
  }
}

.webix_hcell {
  width: 100%;
  overflow: hidden;
  background: inherit;
  font: inherit;
  text-align: left;
  color: inherit;
  box-sizing: border-box;
  padding: 0px 12px 0px 12px;

  .webix_excel_filter {
    position: absolute;
    top: 50%;
    right: 2px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin-top: -10px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    color: var(--color-title-text);

    &:hover {
      color: var(--color-border-2);
    }
  }

  .webix_tree_close {
    margin-right: 5px;
  }

  .webix_tree_open {
    margin-right: 5px;
  }

  input[type="checkbox"] {
    margin: 0px 1px 2px;
    vertical-align: middle;
  }

  .webix_input_icon {
    background-color: var(--color-border-common);
  }
}

.webix_ss_body {
  overflow: hidden;
  position: relative;
}

.webix_hs_center {
  overflow: hidden;
  float: left;
  position: relative;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);

  .webix_hcell.webix_last {
    border-right-width: 0px;
  }
}

.webix_hs_right {
  overflow: hidden;
  float: left;
  position: relative;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);

  .webix_hcell.webix_last {
    border-right-width: 0px;
  }

  .webix_first {
    border-left: 1px solid var(--color-border-common);
  }
}

.webix_hs_left {
  overflow: hidden;
  float: left;
  position: relative;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);
}

.webix_ss_center {
  overflow: hidden;
  float: left;
  position: relative;
}

.webix_ss_right {
  overflow: hidden;
  float: left;
  position: relative;

  .webix_column.webix_first {
    > div {
      border-left: 1px solid var(--color-border-common);
    }

    > div.webix_cell_select {
      padding-left: 12px;
    }
  }

  .webix_span_layer {
    border-left: 1px solid var(--color-border-common);
  }

  .webix_span_layer_top {
    border-left: 1px solid var(--color-border-common);
  }
}

.webix_ss_left {
  overflow: hidden;
  float: left;
  position: relative;

  .webix_column.webix_last > div {
    border-right: 1px solid var(--color-border-common);
  }
}

.webix_ss_center_scroll {
  height: 100%;
  position: relative;
  overflow: hidden;
  min-height: 1px;
}

.webix_ss_hscroll {
  bottom: 0px;
}

.webix_ss_vscroll {
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 2;
}

.webix_ss_vscroll_footer {
  position: absolute;
  bottom: 0px;
  right: 0px;
  border-left: 1px solid #EDEFF0;
  border-top: 1px solid #EDEFF0;
  z-index: 1;
}

.webix_ss_vscroll_header {
  position: absolute;
  top: 0px;
  right: 0px;
  border-left: 1px solid var(--color-border-common);
  border-bottom: 1px solid var(--color-border-common);
  z-index: 1;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);
}

.webix_dtable {
  position: relative;
  cursor: default;
  z-index: 0;

  .webix_resize_handle_x .webix_handle_content {
    border: none;
    background-color: var(--color-border-2);
  }

  .webix_resize_handle_y .webix_handle_content {
    border: none;
    background-color: var(--color-border-2);
  }

  .webix_ss_header {
    .webix_hcell {
      border-color: transparent;
    }

    .webix_hcolumn div.webix_last_row {
      border-bottom: 1px solid #5ccce7;
    }

    .webix_span.webix_last_row {
      border-bottom: 1px solid #5ccce7;
    }
  }

  .webix_ss_footer {
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #313131;
    letter-spacing: 0;
    background: var(--color-item);

    .webix_hcell {
      border-color: transparent;
    }

    .webix_hcolumn {
      font-family: Roboto, sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: #313131;
      letter-spacing: 0;
      background: var(--color-item);

      > div:first-child {
        border-top: 1px solid #5ccce7;
      }
    }

    .webix_hcell[row="0"] {
      border-top: 1px solid #5ccce7;
    }

    .webix_hs_left {
      font-family: Roboto, sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: #313131;
      letter-spacing: 0;
      background: var(--color-item);
    }

    .webix_hs_center {
      font-family: Roboto, sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: #313131;
      letter-spacing: 0;
      background: var(--color-item);
    }

    .webix_hs_right {
      font-family: Roboto, sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: #313131;
      letter-spacing: 0;
      background: var(--color-item);
    }

    div.webix_ss_vscroll_footer {
      font-family: Roboto, sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: #313131;
      letter-spacing: 0;
      background: var(--color-item);
    }
  }

  .webix_ss_body {
    .webix_column > div {
      border-right-color: transparent;
      border-left-color: transparent;
    }

    .webix_table_cell {
      border-right-color: transparent;
      border-left-color: transparent;
    }
  }

  .webix_ss_left .webix_column.webix_last > div {
    border-right: 1px solid #ccd2d4;
  }

  .webix_table_cell.webix_last_rightcell {
    border-right: 1px solid #ccd2d4;
  }

  div.webix_last_topcell {
    border-bottom: 1px solid #ccd2d4;
  }

  .webix_ss_right .webix_column.webix_first > div {
    border-left: 1px solid #ccd2d4;
  }

  .webix_hs_right .webix_hcell.webix_first {
    border-left: 1px solid var(--color-border-common);
  }

  .webix_hs_left .webix_hcell.webix_last {
    border-right: 1px solid var(--color-border-common);
  }

  .webix_hcell.webix_ss_filter {
    padding: 0px 4px;
  }

  .webix_hcell.webix_div_filter {
    padding: 1px 4px;
  }

  .webix_dtable_subview {
    background: var(--color-background-common);

    .webix_view {
      border-left-width: 1px;
      border-right-width: 1px;
      border-color: #EDEFF0;
    }
  }

  .webix_ss_filter {
    select {
      height: 24px;
      vertical-align: middle;
      border-radius: 2px;
      border-color: #CCD7E6;

      &:focus {
        border-color: var(--color-border-2);
      }
    }

    input {
      height: 24px;
      vertical-align: middle;
      border-radius: 2px;
      border-color: #CCD7E6;

      &:focus {
        border-color: var(--color-border-2);
      }
    }
  }

  .webix_select_mark > div.webix_row_select {
    box-shadow: inset 2px 0 var(--color-border-2);
  }

  .webix_column > .webix_drag_over.webix_cell {
    background-color: var(--color-item);
  }

  div.webix_ss_vscroll_header {
    border-bottom-color: #5ccce7;
  }

  div.webix_ss_vscroll_footer {
    border-top-color: #5ccce7;
    border-left-color: var(--color-border-common);
  }
}

.webix_ss_footer {
  clear: both;
  overflow: hidden;
  background: #fafafa;

  .webix_hcolumn {
    background: #fafafa;

    .webix_hcell {
      border-right: 1px solid #EDEFF0;
      border-top: 1px solid #EDEFF0;
    }
  }

  .webix_hs_left {
    background: #fafafa;
  }

  .webix_hs_center {
    background: #fafafa;
  }

  .webix_hs_right {
    background: #fafafa;
  }

  div.webix_ss_vscroll_footer {
    background: #fafafa;
  }

  .webix_span {
    border-right: 1px solid #EDEFF0;
    border-top: 1px solid #EDEFF0;
  }

  .webix_sel_hcell {
    background-color: #c9eaf5;
  }
}

.webix_ss_header {
  clear: both;
  overflow: hidden;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);

  .webix_hcolumn .webix_hcell {
    border-right: 1px solid var(--color-border-common);
    border-bottom: 1px solid var(--color-border-common);
  }

  .webix_span {
    border-right: 1px solid var(--color-border-common);
    border-bottom: 1px solid var(--color-border-common);
  }

  .webix_sel_hcell {
    background-color: #c9eaf5;
  }

  .webix_dd_over_column {
    background-color: #c9eaf5;
  }
}

.webix_table_cell {
  box-sizing: border-box;
  font-size: 12px;
  border-right: 1px solid #EDEFF0;
  padding: 0 12px;
  border-bottom: 1px solid #EDEFF0;
}

.webix_view.webix_table_cell {
  box-sizing: border-box;
}

.webix_block_selection {
  box-sizing: border-box;
  position: absolute;
  z-index: 2;
  background: var(--color-border-2);
  border: none;
  opacity: 0.1;
}

.webix_ss_sort_asc {
  position: absolute;
  top: 50%;
  right: 2px;
  font-family: "Webix Material Icons";
  font-size: 18px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  margin-top: -12px;
  float: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  &:before {
    content: '\F004';
  }
}

.webix_ss_sort_desc {
  position: absolute;
  top: 50%;
  right: 2px;
  font-family: "Webix Material Icons";
  font-size: 18px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  margin-top: -12px;
  float: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  &:before {
    content: '\F001';
  }
}

.webix_ss_sort_asc.webix_ss_sort_single {
  width: 20px;
  text-align: center;
}

.webix_ss_sort_desc.webix_ss_sort_single {
  width: 20px;
  text-align: center;
}

.webix_ss_sort_num {
  position: absolute;
  top: 0;
  right: 0;
  height: 12px;
  line-height: 12px;
  font-family: Roboto, sans-serif;
  font-size: 10px;
  text-align: right;
  color: var(--color-border-2);
}

.webix_ss_sort_single .webix_ss_sort_num {
  display: none;
}

.webix_excel_filter {
  ~ .webix_ss_sort_asc {
    right: 24px;
  }

  ~ .webix_ss_sort_desc {
    right: 24px;
  }
}

.webix_hcell.webix_ss_excel_filter {
  position: relative;
}

.webix_hcell.webix_ss_filter_active .webix_excel_filter {
  color: var(--color-border-2);

  &:hover {
    color: var(--color-item-active-selected);
  }
}

.webix_hcell.webix_ss_filter {
  padding: 3px 5px 3px 5px;
}

.webix_table_checkbox {
  margin: 0px 1px 2px;
  vertical-align: middle;
}

.webix_ss_filter {
  select {
    width: 100%;
    font-size: inherit;
    color: var(--color-view-text) !important;
    height: 30px;
    margin-top: -2px;
    padding: 3px;
    vertical-align: top;
    border: 1px solid var(--color-border-common);
    box-sizing: border-box;
    font-family: Roboto, sans-serif;
  }

  input {
    width: 100%;
    font-size: inherit;
    color: var(--color-view-text) !important;
    height: 30px;
    margin-top: -2px;
    padding: 0 3px;
    vertical-align: top;
    border: 1px solid var(--color-border-common);
    box-sizing: border-box;
    font-family: Roboto, sans-serif;
  }
}

.webix_richfilter {
  margin-top: 1px;
  line-height: 24px;
}

.webix_dd_drag_column {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
  background: var(--color-item);
  padding: 5px 10px 5px 10px;
}

.webix_hcell.webix_measure_size {
  box-sizing: border-box;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
}

.webix_column.webix_last > div {
  border-right-width: 0px;
}

.webix_last_topcell.webix_cell {
  border-bottom: 1px solid var(--color-border-common);
}

.webix_dd_drag {
  white-space: nowrap;
  overflow: hidden;
  border-left: 1px solid #EDEFF0;
  height: 28px;

  > div {
    display: inline-block;
    vertical-align: top;
    background: var(--color-background-common);
    border-top: 1px solid #EDEFF0;
    border-right: 1px solid #EDEFF0;
    border-bottom: 1px solid #EDEFF0;
    padding: 5px 12px;
    height: 28px;
    line-height: 20px;
    box-sizing: border-box;
  }
}

.webix_cell.webix_invalid {
  background-color: #ffdedb;
  color: #FF5C4C;
}

.webix_invalid_cell {
  position: relative;

  &:after {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    width: 0px;
    height: 1px;
    border-top: 8px solid #f44;
    border-left: 8px solid transparent;
  }
}

.webix_cell.webix_dtable_colrow {
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: var(--color-background-common);
  width: 100%;
  padding-right: 30px;
  padding-left: 12px;
  padding-top: 1px;
  border-bottom: 1px solid #EDEFF0;
}

.webix_cell.webix_dtable_subrow {
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: var(--color-background-common);
  width: 100%;
  padding-right: 30px;
  padding-left: 12px;
  padding-top: 1px;
  border-bottom: 1px solid #EDEFF0;
}

.webix_dtable_subview {
  position: absolute;
  left: 0px;
  top: 0px;
  background-color: var(--color-background-common);
  width: 100%;
  padding-right: 30px;
  padding-left: 10px;
  padding-top: 1px;
  border-bottom: 1px solid #EDEFF0;
  background: #EDEFF0;
  border-top: 1px solid #EDEFF0;
  padding: 0px 0px 0px 0px;
  box-sizing: border-box;
}

.webix_cell.webix_dtable_colrow.webix_selected {
  color: var(--color-view-text);
  background: var(--color-item);

  &:focus {
    background: #edeff5;
  }
}

.webix_dtable_subrow {
  border-top: 1px solid #EDEFF0;
  text-align: right;
}

.number .webix_cell {
  text-align: right;
}

.webix_rotate {
  transform: rotate(-90deg);
  line-height: normal;
}

.webix_measure_rotate {
  line-height: normal;
  white-space: normal;
  padding: 10px;
}

.webix_span_layer {
  background: transparent;
  position: absolute;
  left: 0px;
  top: 0px;
  height: 0px;
  width: 0px;
  overflow: visible;
}

.webix_span_layer_top {
  background: transparent;
  position: absolute;
  left: 0px;
  top: 0px;
  height: 0px;
  width: 0px;
  overflow: visible;
  z-index: 1;
}

.webix_dtable_span {
  position: absolute;
  background: var(--color-background-common);
  text-align: left;
}

.webix_dtable_span.webix_selected {
  color: var(--color-view-text);
  background: var(--color-item);

  &:focus {
    background: #edeff5;
  }
}

.webix_area_selection_layer {
  position: absolute;
  z-index: 2;
}

.webix_area_selection {
  position: absolute;
  background: var(--color-border-2);
}

.webix_dtable_focused {
  .webix_area_selection {
    background-color: var(--color-item-selected);
  }

  .webix_column {
    > div.webix_row_select {
      background: #edeff5;
    }

    > div.webix_column_select {
      background: #edeff5;
    }
  }

  .webix_area_selection_handle {
    background-color: var(--color-item-selected);
  }
}

.webix_area_selection_top {
  height: 2px;
}

.webix_area_selection_bottom {
  height: 2px;
}

.webix_area_selection_left {
  width: 2px;
}

.webix_area_selection_right {
  width: 2px;
}

.webix_area_selection_handle {
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1px solid #fff;
  background: var(--color-border-2);
  cursor: crosshair;
  margin: -6px 0 0 -6px;
}

.webix_topcell {
  position: relative;
  background: var(--color-background-common);
  z-index: 1;
}

.webix_window {
  position: absolute;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 7px 0 rgba(0, 0, 0, 0.1);
  border-radius: 0px;

  &:focus {
    box-shadow: 0 1px 14px 0 rgba(0, 0, 0, 0.12), 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  }
}

.webix_win_body {
  overflow: hidden;
  border-radius: 0px;

  > .webix_view {
    border-radius: 0px;

    .webix_cal_month {
      border-radius: 0px;
    }
  }
}

.webix_win_content {
  border-radius: 0px;
  height: auto;
  width: auto;
  overflow: hidden;
}

.webix_win_head {
  border-bottom: 1px solid var(--color-border-common);
}

.webix_win_title {
  text-align: center;
}

.webix_modal {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: black;
  opacity: 0.2;
}

.webix_modalbox_inside {
  pointer-events: none;
}

.webix_point_top {
  position: absolute;
  width: 13px;
  height: 7px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAArCAIAAADHSy4DAAAABnRSTlMAAAAAAABupgeRAAAACXBIWXMAAABPAAAATwFjiv3XAAAAhElEQVR4nMXVQQoAIQhAUe9/FC/pLAYayUm/EeT6YWGmoqpWharKG7n+XK5nt9L/LurMeV27oZHrReN0M6Oupr5S1GU0vhN1J7L27hp1QYXX1WtE5UxnNXI0ep7+pEGRpr95ooWObbXUm1npXWkFaF3vTqj9c+h8pVOb7gK6Yeje4tvwARi4FgcAh2V/AAAAAElFTkSuQmCC");
  background-position: 0 -36px;
}

.webix_point_right {
  position: absolute;
  width: 7px;
  height: 13px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAArCAIAAADHSy4DAAAABnRSTlMAAAAAAABupgeRAAAACXBIWXMAAABPAAAATwFjiv3XAAAAhElEQVR4nMXVQQoAIQhAUe9/FC/pLAYayUm/EeT6YWGmoqpWharKG7n+XK5nt9L/LurMeV27oZHrReN0M6Oupr5S1GU0vhN1J7L27hp1QYXX1WtE5UxnNXI0ep7+pEGRpr95ooWObbXUm1npXWkFaF3vTqj9c+h8pVOb7gK6Yeje4tvwARi4FgcAh2V/AAAAAElFTkSuQmCC");
  background-position: 0 -22px;
}

.webix_point_bottom {
  position: absolute;
  width: 13px;
  height: 7px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAArCAIAAADHSy4DAAAABnRSTlMAAAAAAABupgeRAAAACXBIWXMAAABPAAAATwFjiv3XAAAAhElEQVR4nMXVQQoAIQhAUe9/FC/pLAYayUm/EeT6YWGmoqpWharKG7n+XK5nt9L/LurMeV27oZHrReN0M6Oupr5S1GU0vhN1J7L27hp1QYXX1WtE5UxnNXI0ep7+pEGRpr95ooWObbXUm1npXWkFaF3vTqj9c+h8pVOb7gK6Yeje4tvwARi4FgcAh2V/AAAAAElFTkSuQmCC");
  background-position: 0 0;
}

.webix_point_left {
  position: absolute;
  width: 7px;
  height: 13px;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAArCAIAAADHSy4DAAAABnRSTlMAAAAAAABupgeRAAAACXBIWXMAAABPAAAATwFjiv3XAAAAhElEQVR4nMXVQQoAIQhAUe9/FC/pLAYayUm/EeT6YWGmoqpWharKG7n+XK5nt9L/LurMeV27oZHrReN0M6Oupr5S1GU0vhN1J7L27hp1QYXX1WtE5UxnNXI0ep7+pEGRpr95ooWObbXUm1npXWkFaF3vTqj9c+h8pVOb7gK6Yeje4tvwARi4FgcAh2V/AAAAAElFTkSuQmCC");
  background-position: 0 -9px;
}

.webix_resize_handle {
  position: absolute;
  z-index: 2;
  width: 15px;
  height: 15px;
  bottom: 0px;
  line-height: 15px;
  right: -1px;
  text-align: center;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAMAAAAMCGV4AAAABlBMVEUAAAAAAAClZ7nPAAAAAXRSTlMAQObYZgAAABZJREFUeAFjIAUwUshlpJDLSIhLGAAACQ4AFk79JaMAAAAASUVORK5CYII=);
  cursor: nw-resize;
}

.webix_resize_frame {
  position: absolute;
  opacity: 0.1;
  background: var(--color-border-2);
  display: block;
  border: 1px solid #0f5768;
  box-shadow: 0 2px 6px 0 #000, 0 1px 4px 0 #000;
}

.webix_resize_cursor {
  cursor: nw-resize;
}

.webix_shadow_medium {
  position: relative;
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 7px 0 rgba(0, 0, 0, 0.1);
}

.webix_shadow_small {
  position: relative;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
}

.webix_shadow_big {
  position: relative;
  box-shadow: 0 1px 14px 0 rgba(0, 0, 0, 0.12), 0 4px 10px 0 rgba(0, 0, 0, 0.1);
}

.webix_shadow_none {
  box-shadow: none !important;
}

.webix_toolbar.webix_shadow_small {
  z-index: 1;
}

.webix_toolbar.webix_shadow_medium {
  z-index: 1;
}

.webix_toolbar.webix_shadow_big {
  z-index: 1;
}

.webix_tree {
  .webix_scroll_cont > .webix_tree_leaves {
    display: inline-block;
    padding: 8px;
  }

  .webix_drop_area {
    height: 24px;
  }

  .webix_tree_item.webix_selected {
    background-color: var(--color-item);
    padding-right: 12px;

    &:focus {
      background-color: #edeff5;
    }

    span {
      background-color: transparent;
      padding: 0;
      margin: 0;
    }

    div {
      background-color: transparent;
    }
  }

  .webix_tree_item {
    padding-right: 12px;
  }
}

.webix_tree_item {
  clear: both;
  height: 24px;
  line-height: 24px;
  white-space: nowrap;
}

.webix_tree_item.webix_selected {
  background: transparent;

  span {
    padding: 4px 10px 4px 4px;
    margin-left: -4px;
    color: var(--color-view-text);
    background: var(--color-item);

    &:focus {
      background: #edeff5;
    }
  }
}

.webix_tree_item.webix_invalid {
  background-color: #ffdedb;
  color: #FF5C4C;
}

.webix_tree_checkbox {
  margin: 0px;
  padding: 0px;
  vertical-align: top;
  height: 100%;
  width: 13px;
}

.webix_indeterminate {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6+R8AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAZUlEQVR4nGPw8Mhldw9ObXAPTp1JBG4AqWcAawhNs2QgArgFp1q5haTVgzTNZCABuIekzSJdU3DqTOpoqq+vZ3IPSfsPwyD+INJECNBREzSeGkAxTYwG16B0a3CKICXtgTSA0h4ApZxpTQmN4jEAAAAASUVORK5CYII=");
  background-repeat: no-repeat;
  background-position: left center;
  height: 100%;
  width: 13px;
  margin-top: 0 !important;
  display: inline-block;
}

.webix_tree_close {
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 100%;
  cursor: pointer;
  margin: 0;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 24px;
  text-align: center;
  color: var(--color-title-text);

  &:before {
    margin-left: -2px;
    content: "\F028";
  }
}

.webix_tree_open {
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 100%;
  cursor: pointer;
  margin: 0;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 24px;
  text-align: center;
  color: var(--color-title-text);

  &:before {
    margin-left: -2px;
    content: "\F027";
  }
}

.webix_tree_none {
  display: inline-block;
  vertical-align: top;
  width: 20px;
  height: 100%;
  cursor: pointer;
  margin: 0;
  background-repeat: no-repeat;
  background-position: center center;
}

.webix_tree_folder {
  display: inline-block;
  vertical-align: top;
  width: 24px;
  height: 100%;
  cursor: pointer;
  margin: 0 4px 0 0;
  background-repeat: no-repeat;
  background-position: 0 center;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 20px;
  text-align: center;
  color: var(--color-border-common);

  &:before {
    content: "\F030";
  }
}

.webix_tree_file {
  display: inline-block;
  vertical-align: top;
  width: 24px;
  height: 100%;
  cursor: pointer;
  margin: 0 4px 0 0;
  background-repeat: no-repeat;
  background-position: 0 center;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 20px;
  text-align: center;
  color: var(--color-border-common);

  &:before {
    content: "\F032";
  }
}

.webix_tree_folder_open {
  display: inline-block;
  vertical-align: top;
  width: 24px;
  height: 100%;
  cursor: pointer;
  margin: 0 4px 0 0;
  background-repeat: no-repeat;
  background-position: 0 center;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 20px;
  text-align: center;
  color: var(--color-border-common);

  &:before {
    content: "\F031";
  }
}

.webix_tree_leaves .webix_tree_leaves {
  display: block;
  margin-left: 20px;
}

.webix_line_tree .webix_tree_leaves {
  margin-left: 0px;
}

.webix_tree_img {
  background-color: var(--color-background-common);
  float: left;
  width: 24px;
  height: 24px;
  background-position: 0 0;
}

.webix_tree_line1 {
  background-image: url("data:image/gif;base64,R0lGODlhGQAcAIABAMHBwf///yH5BAEKAAEALAAAAAAZABwAAAIxjI8Gyc3r4pP0wCovdnpPz4Gh+JFIZ6KkKrKg68GbjNGVTeGZmeiRP+IphBbi0EgrAAA7");
}

.webix_tree_line2 {
  background-image: url("data:image/gif;base64,R0lGODlhGQAcAIABAMHBwf///yH5BAEKAAEALAAAAAAZABwAAAIpjI8Gyc3r4pP0wCovdnpPz4Gh+JFIZ6KkKgLuC7/mTNf2jef6zvc+XgAAOw==");
  background-repeat: no-repeat;
}

.webix_tree_line3 {
  background-image: url("data:image/gif;base64,R0lGODlhGQAcAIABAMHBwf///yH5BAEKAAEALAAAAAAZABwAAAI1jI8Gyc3r4pP0wCovdnpPz4Gh+JFIZ6KkKgLuC78VC9KeveGYPpsJTwFmfCeixahABoQRXQEAOw==");
}

.webix_tree_line4 {
  background-image: url("data:image/gif;base64,R0lGODlhGQAcAIABAMHBwf///yH5BAEKAAEALAAAAAAZABwAAAIjjI+py+0Po5y02ouz3rxDAIZi+HGAiW6nmmqr22avHGMzUwAAOw==");
}

.webix_cal_month {
  height: 24px;
  line-height: 24px;
  text-align: center;
  position: relative;
  font-size: 14px;
  font-weight: bold;
  padding: 0 0 6px;
  box-sizing: content-box;
}

.webix_cal_prev_button {
  cursor: pointer;
  position: absolute;
  top: 0;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: 8px 6px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  left: 0;
  background-image: none;
  font-size: 24px;
  font-family: "Webix Material Icons";
  color: var(--color-title-text);

  &:hover {
    color: var(--color-border-2);
  }

  &:focus {
    color: var(--color-border-2);
  }

  &:before {
    content: "\F029";
  }
}

.webix_cal_next_button {
  cursor: pointer;
  position: absolute;
  top: 0;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: 8px 6px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  right: 0;
  background-image: none;
  font-size: 24px;
  font-family: "Webix Material Icons";
  color: var(--color-title-text);

  &:hover {
    color: var(--color-border-2);
  }

  &:focus {
    color: var(--color-border-2);
  }

  &:before {
    content: "\F028";
  }
}

.webix_cal_body {
  .webix_cal_row > div {
    float: left;
    text-align: center;
    height: 100%;
  }

  .webix_selected {
    color: var(--color-view-text);
    background: var(--color-item);
  }

  .webix_cal_select {
    color: var(--color-view-text);
    background: var(--color-item);
    background-color: transparent;

    .webix_cal_day_inner {
      color: var(--color-background-common);
      background-color: var(--color-border-2);

      &:hover {
        background-color: var(--color-border-2);
      }
    }

    &:focus .webix_cal_day_inner {
      background-color: var(--color-item-selected);
    }
  }

  .webix_cal_select.webix_cal_today {
    color: var(--color-view-text);
    background: var(--color-item);
  }

  .webix_hours {
    float: left;
    border-right: 1px solid var(--color-border-common);
    padding-right: 1px;

    .webix_cal_day_disabled {
      background-color: #fbfbfd;
      color: var(--color-title-text);

      &:not(.webix_cal_select) span:hover {
        background-color: transparent;
      }
    }

    .webix_cal_day_disabled.webix_cal_event {
      background-color: #fbfbfd;
      color: var(--color-title-text);

      &:not(.webix_cal_select) span:hover {
        background-color: transparent;
      }
    }
  }

  .webix_minutes {
    float: left;
    padding-left: 1px;

    .webix_cal_day_disabled {
      background-color: #fbfbfd;
      color: var(--color-title-text);

      &:not(.webix_cal_select) span:hover {
        background-color: transparent;
      }
    }

    .webix_cal_day_disabled.webix_cal_event {
      background-color: #fbfbfd;
      color: var(--color-title-text);

      &:not(.webix_cal_select) span:hover {
        background-color: transparent;
      }
    }
  }

  .webix_cal_today.webix_cal_range_start {
    background-color: transparent;
    color: var(--color-view-text);

    .webix_cal_day_inner {
      color: var(--color-background-common);
      background-color: var(--color-border-2);
    }
  }

  .webix_cal_today.webix_cal_range_end {
    background-color: transparent;
    color: var(--color-view-text);

    .webix_cal_day_inner {
      color: var(--color-background-common);
      background-color: var(--color-border-2);
    }
  }

  .webix_cal_outside.webix_cal_range_start {
    background-color: transparent;
    color: #b1bbc8;
  }

  .webix_cal_outside.webix_cal_range_end {
    background-color: transparent;
    color: #b1bbc8;
  }

  .webix_cal_outside.webix_cal_today.webix_cal_range_start {
    background-color: transparent;
    color: #b1bbc8;
  }

  .webix_cal_outside.webix_cal_today.webix_cal_range_end {
    background-color: transparent;
    color: #b1bbc8;
  }

  .webix_cal_block_empty {
    font-weight: 500;
    border-bottom: none;
  }

  .webix_cal_week_num {
    color: var(--color-view-text);
  }

  .webix_cal_today .webix_cal_day_inner {
    box-shadow: inset 0 0 0 1px var(--color-border-2);
  }

  .webix_cal_day_inner {
    display: inline-block;
    font-size: 12px;
    border-radius: 50%;

    &:hover {
      background-color: var(--color-item);
    }
  }

  .webix_cal_event {
    font-weight: 500;
    color: var(--color-border-2);
  }

  .webix_cal_outside {
    color: var(--color-title-text);
    font-weight: normal;

    + .webix_cal_range_first:before {
      width: 0;
    }
  }

  .webix_cal_today.webix_cal_select {
    background-color: transparent;

    .webix_cal_day_inner {
      color: var(--color-background-common);
      background-color: var(--color-border-2);

      &:hover {
        background-color: var(--color-border-2);
      }
    }

    &:focus .webix_cal_day_inner {
      background-color: var(--color-item-selected);
    }
  }

  .webix_cal_block {
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--color-view-text);
    letter-spacing: 0.2px;

    span {
      border-radius: 50%;

      &:hover {
        background-color: var(--color-item);
      }
    }
  }

  .webix_cal_block.webix_selected {
    background-color: transparent;

    span {
      background-color: var(--color-border-2);
      color: var(--color-background-common);

      &:hover {
        background-color: var(--color-border-2);
      }
    }

    &:focus span {
      background-color: var(--color-item-selected);
    }
  }

  .webix_cal_day_disabled {
    background-color: #fbfbfd;
    color: var(--color-title-text);

    &:not(.webix_cal_select) span:hover {
      background-color: transparent;
    }
  }

  .webix_cal_day_disabled.webix_cal_event {
    background-color: #fbfbfd;
    color: var(--color-title-text);

    &:not(.webix_cal_select) span:hover {
      background-color: transparent;
    }
  }

  .webix_cal_range_first {
    position: relative;

    &:before {
      content: "";
      display: block;
      width: 50%;
      height: 100%;
      position: absolute;
      top: 0;
      background: #e1f6fb;
      right: 100%;
    }
  }

  .webix_cal_range_last {
    position: relative;

    + .webix_cal_outside {
      background-color: var(--color-background-common);
      position: relative;
      z-index: 1;
    }

    &:after {
      content: "";
      display: block;
      width: 50%;
      height: 100%;
      position: absolute;
      top: 0;
      background: #e1f6fb;
      left: 100%;
    }
  }

  .webix_cal_range_start {
    position: relative;
    z-index: 1;
    background-color: transparent;

    .webix_cal_day_inner {
      color: var(--color-background-common);
      background-color: var(--color-border-2);
    }
  }

  .webix_cal_range_end {
    position: relative;
    z-index: 1;
    background-color: transparent;

    .webix_cal_day_inner {
      color: var(--color-background-common);
      background-color: var(--color-border-2);
    }
  }

  .webix_cal_range {
    background-color: #e1f6fb;

    &:first-child:before {
      width: 0;
    }

    &:last-child:after {
      width: 0;
    }
  }
}

.webix_cal_day {
  cursor: pointer;
  font-size: 12px;
  color: var(--color-view-text);
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.webix_cal_week_num {
  cursor: default;
  font-size: 12px;
  color: #a2adbe;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-right: 0px;
  border-right: 1px solid var(--color-border-common);
}

.webix_cal_event {
  font-weight: bold;
  color: #C66200;
}

.webix_cal_outside {
  color: #b1bbc8;
}

.webix_cal_inactive {
  background: #888;
}

.webix_cal_day_disabled {
  color: #b1bbc8;
  background: #f0f0f0;
}

.webix_cal_day_disabled.webix_cal_event {
  color: #b1bbc8;
  background: #f0f0f0;
}

.webix_cal_day_disabled.webix_cal_day {
  cursor: not-allowed;
}

.webix_cal_day_disabled.webix_cal_block {
  cursor: not-allowed;
}

.webix_hours {
  .webix_cal_day_disabled {
    background: var(--color-background-common);
    font-weight: normal;
    text-decoration: line-through;
  }

  .webix_cal_day_disabled.webix_cal_event {
    background: var(--color-background-common);
    font-weight: normal;
    text-decoration: line-through;
  }
}

.webix_minutes {
  .webix_cal_day_disabled {
    background: var(--color-background-common);
    font-weight: normal;
    text-decoration: line-through;
  }

  .webix_cal_day_disabled.webix_cal_event {
    background: var(--color-background-common);
    font-weight: normal;
    text-decoration: line-through;
  }
}

.webix_cal_month_name {
  cursor: pointer;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0.2px;

  &:hover {
    text-decoration: none;
    color: var(--color-border-2);
  }

  &:focus {
    color: var(--color-border-2);
  }
}

.webix_cal_block {
  float: left;
  text-align: center;
  cursor: pointer;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.webix_selected {
  background: var(--color-item);
  color: var(--color-view-text);
}

.webix_cal_footer {
  text-align: center;
  font-size: 12px;
  color: var(--color-section-text);
  height: 24px;
  padding: 6px 0 0;
  cursor: pointer;
}

.webix_cal_icons {
  float: right;
  height: 20px;
  line-height: 20px;
  padding: 4px 4px 0;

  .webix_cal_icon {
    text-align: center;
    padding: 0 4px;
  }
}

.webix_cal_time {
  height: 20px;
  line-height: 20px;
  padding: 4px 4px 0;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--color-view-text);
  letter-spacing: 0.2px;

  &:hover {
    text-decoration: none;
    color: var(--color-border-2);
  }

  &:focus {
    color: var(--color-border-2);
  }
}

.webix_cal_time_icons {
  float: left;
}

.webix_cal_icon {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--color-view-text);
  letter-spacing: 0.2px;

  &:hover {
    text-decoration: none;
    color: var(--color-border-2);
  }

  &:focus {
    color: var(--color-border-2);
  }
}

.webix_cal_month_name.webix_readonly {
  cursor: default;

  &:hover {
    text-decoration: none;
    color: #313131;
  }

  &:focus {
    text-decoration: none;
    color: #313131;
  }
}

.webix_time_header {
  padding: 0 0 6px;

  .webix_cal_hours {
    display: inline-block;
    font-size: 12px;
    text-align: center;
    height: 24px;
    line-height: 24px;
    box-sizing: border-box;
    border-bottom: none;
    border-right: none !important;
    font-family: Roboto, sans-serif;
    font-weight: 500;
    color: #313131;
    letter-spacing: 0.2px;
  }

  .webix_cal_minutes {
    display: inline-block;
    font-size: 12px;
    text-align: center;
    height: 24px;
    line-height: 24px;
    box-sizing: border-box;
    border-bottom: none;
    padding-left: 1px;
    border-left: none;
    font-family: Roboto, sans-serif;
    font-weight: 500;
    color: #313131;
    letter-spacing: 0.2px;
  }
}

.webix_cal_block_empty {
  float: left;
  text-align: center;
}

.webix_time_footer {
  text-align: center;
  font-size: 12px;
  height: 24px;
  padding: 6px 0 0;
  cursor: pointer;
}

.webix_cal_done {
  height: 24px;
  padding: 2px 8px;
  font-size: 14px;
  border-radius: 2px;
  border: 1px solid var(--color-border-common);
  font-family: Roboto, sans-serif;
  font-weight: 500;
  letter-spacing: 0px;
  outline: none;
  background: var(--color-item);
  color: var(--color-border-2);
  float: right;

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_cal_blurred_hours {
  background-color: #f7f7f7;
}

.webix_property_line {
  width: 100%;
  height: auto;
  line-height: 0;

  &:focus > div {
    background-color: #f7f8fb;
  }
}

.webix_property_line.webix_focused > div {
  background-color: #f7f8fb;
}

.webix_property_label {
  display: inline-block;
  padding-left: 12px;
  border-bottom: 1px solid #EDEFF0;
  overflow: hidden;
  box-sizing: border-box;
  border-right: 1px solid #EDEFF0;
}

.webix_property_value {
  display: inline-block;
  padding-left: 12px;
  border-bottom: 1px solid #EDEFF0;
  overflow: hidden;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.webix_property_label_line {
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-view-text);
  letter-spacing: 0px;
  line-height: 34px;
  padding-left: 12px;
  border-bottom: 1px solid #EDEFF0;
  box-sizing: border-box;

  .webix_el_label .webix_el_box {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-view-text);
    letter-spacing: 0px;
  }
}

.webix_property_label_line.webix_dark {
  background: var(--color-background-accent);
  border-color: var(--color-background-accent);
  color: var(--color-background-common);

  .webix_el_button {
    color: var(--color-background-common);
  }

  .webix_el_label .webix_el_box {
    color: var(--color-background-common);
  }

  .webix_inp_label {
    color: var(--color-background-common);
  }

  .webix_inp_top_label {
    color: var(--color-background-common);
  }

  .webix_slider_title {
    color: var(--color-background-common);
  }

  .webix_secondary {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      background-color: rgba(0, 0, 0, 0.2);
      color: var(--color-background-common);
      border-color: transparent;

      &:hover {
        color: var(--color-background-common);
        background-color: rgba(0, 0, 0, 0.4);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.4);
        color: var(--color-background-common);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.5);
        color: var(--color-background-common);
      }
    }
  }

  .webix_transparent {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      color: var(--color-background-common);

      &:hover {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.4);
      }
    }
  }

  .webix_inp_counter_next {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_inp_counter_prev {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_0 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_1 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_N {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_menu-x .webix_list_item {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_view > .webix_template {
    color: var(--color-background-common);
    background-color: var(--color-background-accent);
  }

  .webix_inp_static {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    input[type=text] {
      background-color: transparent;
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=text] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=combo] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=datepicker] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  textarea {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  select {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    option {
      background-color: var(--color-background-accent);
      color: var(--color-background-common);
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  .webix_text_highlight {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_el_texthighlight {
    input {
      caret-color: rgba(255, 255, 255, 0.7);
    }

    textarea {
      caret-color: rgba(255, 255, 255, 0.7);
    }
  }

  .webix_multicombo_value {
    color: var(--color-background-accent);
  }

  .webix_multicombo_tag {
    color: var(--color-background-accent);
  }

  .webix_el_counter {
    button {
      background-color: rgba(0, 0, 0, 0.3);
    }

    input[type=text]:focus {
      border-color: transparent;
    }
  }

  .webix_placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  ::placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_input_icon {
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_selected.webix_segment_0 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_1 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_N {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_img_btn_top {
    border-width: 0;

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon {
      color: var(--color-background-common);
    }
  }

  .webix_el_icon {
    color: var(--color-background-common);
  }

  .webix_img_btn {
    color: var(--color-background-common);
    border-width: 0;
  }

  .webix_icon_btn {
    color: var(--color-background-common);
  }

  .webix_icon_button {
    color: var(--color-background-common);

    &:hover {
      &:before {
        background-color: rgba(0, 0, 0, 0.2);
      }

      .webix_icon {
        opacity: 1;
      }
    }

    &:focus .webix_icon {
      opacity: 1;
    }

    .webix_icon {
      color: var(--color-background-common);
      opacity: 0.7;
    }
  }

  .webix_control {
    border-color: var(--color-border-2);
  }

  .webix_custom_checkbox {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_custom_radio {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_label_right {
    color: var(--color-background-common);
  }

  .webix_view.webix_control .webix_disabled_box {
    .webix_button {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    label {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_input_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    button {
      color: rgba(255, 255, 255, 0.4);
    }

    input {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    select {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    textarea {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_static {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;

      input {
        background-color: transparent;
      }
    }

    .webix_inp_counter_prev {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_counter_next {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_segment_0 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_N {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_item_tab {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_1.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_N.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }
  }

  .webix_disabled_view.webix_control {
    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_view.webix_menu-x .webix_list_item.menu {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_toolbar .webix_disabled_view.webix_control {
    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_top_label {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_invalid {
    .webix_el_box {
      input {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      .webix_inp_static {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;

        input {
          background-color: transparent;
        }
      }

      select {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      textarea {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }
    }

    .webix_multicombo_value {
      color: #FF5C4C;
    }

    .webix_multicombo_tag {
      color: #FF5C4C;
    }
  }

  input.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  select.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  textarea.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }
}

.webix_property_col_ind {
  float: right;
  cursor: pointer;
  margin: 0 8px 0 0;
  border: 1px solid var(--color-border-common);
  background: var(--color-background-common);
  border-radius: 3px;
  width: 16px;
  height: 16px;
}

.webix_property_check {
  margin: 0;
  vertical-align: middle;
}

.webix_tooltip {
  display: none;
  position: absolute;
  z-index: 10000;
  background-color: var(--color-view-text);
  padding: 4px 8px;
  border: none;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: var(--color-background-common);
  letter-spacing: 0.2px;
  border-radius: 2px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 20px;
}

.webix_global_tooltip {
  pointer-events: none;
}

.webix_comments .webix_list {
  .webix_list_item {
    margin-top: 24px;
    border: none;
    cursor: default;
  }

  .webix_comments_more_item {
    margin-top: 12px;
  }
}

.webix_comments_name {
  margin-left: 16px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.7);
}

.webix_comments_menu.webix_icon {
  line-height: normal;
  width: 6px;
  visibility: hidden;
  float: right;
  cursor: pointer;
  color: var(--color-title-text);
  margin: 0 4px 0 0;
}

.webix_comments_current:hover .webix_comments_menu {
  visibility: visible;
}

.webix_comments_current.active_menu .webix_comments_menu {
  visibility: visible;
}

.webix_comments_message {
  white-space: pre-wrap;
  line-height: 20px;
  margin-left: 70px;
  margin-right: 10px;

  a {
    color: var(--color-border-2);
    text-decoration: none;
    word-break: break-all;

    &:hover {
      text-decoration: underline;
    }

    &:visited {
      color: #7e57c2;
    }
  }

  .webix_comments_mention {
    font-weight: 500;
    white-space: nowrap;
  }
}

.webix_comments_mention {
  color: var(--color-border-2);
}

.webix_comments_avatar {
  margin-left: 14px;
  float: left;
  position: relative;
  width: 40px;
  height: 40px;
}

.webix_comments_status {
  z-index: 1;
  top: 30px;
  left: 30px;
  border-radius: 50%;
  border: 2px solid var(--color-background-common);
  position: absolute;
  height: 12px;
  width: 12px;
  box-sizing: border-box;
}

.webix_comments_status.active {
  background-color: #55CD97;
}

.webix_comments_status.busy {
  background-color: #FF5C4C;
}

.webix_comments_status.away {
  background-color: #FDBF4C;
}

.webix_comments_status.none {
  background-color: #d0d5dd;
}

.webix_comments_avatar_image {
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 50%;
  float: left;
  position: relative;
}

.webix_comments_photo {
  width: auto;
  height: 100%;
  margin: 0 auto;
}

.webix_comments_avatar_text {
  font-size: 16px;
  color: var(--color-border-2);
  line-height: 40px;
  text-align: center;
  background-color: #DFE2E6;

  .webix_icon {
    margin: 0;
  }
}

.webix_comments_date {
  float: right;
  color: var(--color-title-text);
  font-size: 12px;
}

.webix_comments_image {
  max-width: 100%;
  max-height: 300px;
  display: block;
}

.webix_comments_more {
  font-weight: 500;
  text-align: center;
  cursor: pointer;
  background: var(--color-item);
  color: var(--color-border-2);
  border: none;
  border-radius: 2px;
  padding-top: 2px;

  &:hover {
    background-color: var(--color-item-focus);
  }
}

.webix_comments_send .webix_el_box {
  float: right !important;
}

.webix_message_area {
  position: fixed;
  right: 5px;
  width: 250px;
  z-index: 1000;
}

.webix_message {
  min-width: 120px;
  font-family: Roboto, sans-serif;
  z-index: 10000;
  overflow: hidden;
  margin: 4px 4px 12px;
  transition: all 0.5s ease;
  cursor: pointer;
  font-size: 12px;
  color: var(--color-view-text);
  box-shadow: 0 1px 14px 0 rgba(0, 0, 0, 0.12), 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  line-height: 18px;
  border-radius: 2px;
  border: 1px solid var(--color-border-common);
  background-color: var(--color-background-common);

  img {
    float: left;
    margin-right: 8px;
  }

  div {
    padding: 8px 12px;
  }
}

.webix_message.hidden {
  height: 0px;
  min-height: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  border-width: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  box-shadow: none;
  overflow: hidden;
}

.webix_modal_box {
  pointer-events: auto;
  overflow: hidden;
  display: inline-block;
  min-width: 250px;
  width: 250px;
  text-align: center;
  position: fixed;
  background-color: var(--color-background-common);
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 7px 0 rgba(0, 0, 0, 0.1);
  font-family: Roboto, sans-serif;
  z-index: 20000;
  border-radius: 0px;
  border: 1px solid var(--color-border-common);
  outline: none;

  .webix_popup_button {
    margin-top: 8px;
  }

  img {
    float: left;
    margin-right: 8px;
  }
}

.webix_popup_button {
  cursor: pointer;
  height: 22px;
  line-height: 22px;
  display: inline-block;
  margin: 0 4px;
  border-radius: 2px;
  min-width: 100px;
  font-size: 14px;
  font-family: Roboto, sans-serif;
  font-weight: 500;
  letter-spacing: 0px;
  background: var(--color-item);
  color: var(--color-border-2);
  outline: none;
  border-color: var(--color-item);

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }

  div {
    border-radius: 0;
  }
}

.webix_popup_controls {
  padding: 4px 12px 12px;
}

div.webix_modal_cover {
  background-color: #000;
  cursor: default;
  opacity: 0.1;
  position: fixed;
  z-index: 19999;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  border: none;
  zoom: 1;
}

.webix_popup_button.confirm {
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-background-common);
  letter-spacing: 0px;
  outline: none;
  background: var(--color-border-2);
  border-color: var(--color-border-2);

  &:hover {
    background-color: var(--color-item-selected);
  }

  &:focus {
    background-color: var(--color-item-selected);
  }

  &:active {
    background-color: var(--color-item-active-selected);
  }
}

.webix_popup_input.webix_el_text {
  outline: none;
  overflow: hidden;
  padding: 3px 2px;

  input {
    width: 100%;
    height: 22px;
    font-size: 12px;
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    box-sizing: border-box;
  }
}

.webix_popup_input.webix_el_text.webix_required::before {
  position: absolute;
  right: 18px;
  padding-top: 1px;
  content: "*";
  color: #FF5C4C;
}

.webix_popup_input.webix_el_text.webix_popup_invalid input {
  background-color: #ffdedb;
  border-color: #fea5a8;
  color: #FF5C4C;
}

.webix_popup_title {
  color: var(--color-view-text);
  line-height: 20px;
  padding: 20px 16px 12px 16px;
  font-size: 14px;
  font-weight: 500;

  + div.webix_popup_text {
    padding-top: 0;
    box-shadow: none;
  }
}

.webix_popup_text {
  overflow: hidden;
  padding: 24px 16px 0px 16px;
  font-size: 12px;
  color: var(--color-view-text);
  line-height: 18px;
}

.webix_popup_text.webix_popup_label {
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.webix_alert {
  .webix_popup_title {
    box-shadow: inset 0 4px var(--color-border-2);
  }

  .webix_popup_text {
    box-shadow: inset 0 4px var(--color-border-2);
  }
}

.webix_confirm {
  .webix_popup_title {
    box-shadow: inset 0 4px var(--color-border-2);
  }

  .webix_popup_text {
    box-shadow: inset 0 4px var(--color-border-2);
  }
}

.webix_prompt {
  .webix_popup_title {
    box-shadow: inset 0 4px var(--color-border-2);
  }

  .webix_popup_text {
    box-shadow: inset 0 4px var(--color-border-2);
  }
}

.webix_alert-warning {
  .webix_popup_title {
    box-shadow: inset 0 4px #FDBF4C;
  }

  .webix_popup_text {
    box-shadow: inset 0 4px #FDBF4C;
  }
}

.webix_confirm-warning {
  .webix_popup_title {
    box-shadow: inset 0 4px #FDBF4C;
  }

  .webix_popup_text {
    box-shadow: inset 0 4px #FDBF4C;
  }
}

.webix_prompt-warning {
  .webix_popup_title {
    box-shadow: inset 0 4px #FDBF4C;
  }

  .webix_popup_text {
    box-shadow: inset 0 4px #FDBF4C;
  }
}

.webix_alert-error {
  .webix_popup_title {
    box-shadow: inset 0 4px #FF5C4C;
  }

  .webix_popup_text {
    box-shadow: inset 0 4px #FF5C4C;
  }
}

.webix_confirm-error {
  .webix_popup_title {
    box-shadow: inset 0 4px #FF5C4C;
  }

  .webix_popup_text {
    box-shadow: inset 0 4px #FF5C4C;
  }
}

.webix_prompt-error {
  .webix_popup_title {
    box-shadow: inset 0 4px #FF5C4C;
  }

  .webix_popup_text {
    box-shadow: inset 0 4px #FF5C4C;
  }
}

.webix_message.webix_debug {
  color: #313131;
  border-color: #fed282;
  background-color: #fff2db;
}

.webix_message.webix_error {
  color: #313131;
  border-color: #ff8d82;
  background-color: #ffdedb;
}

.webix_message.webix_success {
  color: #313131;
  border-color: #88dcb6;
  background-color: #ddf5ea;
}

.webix_color_row {
  clear: both;
  white-space: nowrap;
  line-height: 0;
  font-size: 0;

  div {
    line-height: 0;
    font-size: 0;
    display: inline-block;
    position: relative;

    > * {
      box-sizing: border-box;
    }
  }

  .webix_color_selected {
    > * {
      border: 1px solid;
      border-color: var(--color-background-common);
      border-radius: 2px;
      box-shadow: rgba(28, 161, 193, 0.6) 0 0 0 2px;
    }

    &:focus > * {
      box-shadow: var(--color-border-2) 0 0 0 2px;
    }
  }
}

.webix_color_palette {
  text-align: left;
  padding: 4px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.webix_color_palette.webix_palette_classic {
  padding: 0;
}

.webix_palette_classic {
  .webix_color_row .webix_color_selected {
    > * {
      border: 2px solid #f3f3f3;
      border-radius: 0px;
      box-shadow: none;
    }

    &:focus > * {
      box-shadow: inset 0 0 15px #fff;
    }
  }

  .webix_color_item {
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
}

.webix_palette_material {
  .webix_color_item {
    display: inline-block;
    box-sizing: border-box;
    border-radius: 2px;
    cursor: pointer;
    width: 100%;
    height: 100%;
  }

  .webix_color_row > div {
    margin: 0 4px 4px 0;
  }
}

.webix_color_area {
  width: 100%;
  height: 100%;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  .webix_button {
    width: calc(100% - 12px*2);
    height: 24px;
    margin: 0px 0px 12px 12px;
    box-sizing: border-box;
  }
}

.webix_color_block {
  position: relative;
  border-radius: 2px;
  margin: 12px 12px 14px;

  &:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(0deg, #000, hsla(0, 0%, 100%, 0));
    z-index: 2;
  }

  &:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: linear-gradient(90deg, #fff, hsla(20, 42%, 65%, 0));
    z-index: 1;
  }
}

.webix_color_line {
  position: relative;
  height: 8px;
  margin: 0 12px;
  border-radius: 8px;
  background-image: linear-gradient(90deg, red, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red);
}

.webix_color_circle {
  width: 8px;
  height: 8px;
  margin: -6px 0 0 -6px;
  border: 2px solid var(--color-background-common);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 3;

  &:focus {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), inset 0 0 4px var(--color-background-common);
  }
}

.webix_color_area_active {
  .webix_color_circle {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), inset 0 0 4px var(--color-background-common);
    pointer-events: none;
  }

  .webix_color_line_circle {
    box-shadow: inset 0 0 8px var(--color-background-common);
    pointer-events: none;
  }
}

.webix_color_line_circle {
  width: 12px;
  height: 12px;
  margin: -4px 0 0 -8px;
  border: 2px solid var(--color-background-common);
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 0;
  background: #12FF08;

  &:focus {
    box-shadow: inset 0 0 8px var(--color-background-common);
  }
}

.webix_color_out_block {
  height: 24px;
  float: left;
  border: 1px solid #CCD7E6;
  margin: 12px 0px 12px 12px;
  box-sizing: border-box;
}

.webix_color_out_text {
  height: 24px;
  float: left;
  border: 1px solid #CCD7E6;
  margin: 12px 0px 12px 12px;
  box-sizing: border-box;
  color: var(--color-view-text);
  font-size: 12px;
  background: var(--color-background-common);
  font-family: Roboto, sans-serif;
  border-color: #CCD7E6;
  padding: 0px 12px;

  &:focus {
    border: 1px solid var(--color-border-2);
  }
}

.webix_daterange {
  .webix_view {
    background-color: var(--color-background-common);
  }

  .webix_range_0 .webix_cal_next_button {
    visibility: hidden;
  }

  .webix_range_N .webix_cal_prev_button {
    visibility: hidden;
  }

  .webix_range_1 {
    .webix_cal_next_button {
      visibility: hidden;

      &:hover {
        cursor: default;
      }
    }

    .webix_cal_prev_button {
      visibility: hidden;

      &:hover {
        cursor: default;
      }
    }
  }

  .webix_range_left .webix_cal_next_button:hover {
    cursor: default;
  }

  .webix_range_right .webix_cal_prev_button:hover {
    cursor: default;
  }

  .webix_cal_icons {
    text-align: right;
    padding: 0 4px;

    .webix_cal_icon {
      border-top: none;
    }
  }

  .webix_cal_time {
    display: none;
  }

  .webix_cal_timepicker .webix_range_time_start {
    display: block;
  }

  .webix_range_timepicker {
    .webix_cal_time {
      display: block;
      padding: 4px;
    }

    .webix_range_time_start {
      float: left;
    }

    .webix_range_time_end {
      float: right;
    }
  }

  .webix_range_footer .webix_cal_footer {
    padding: 0;
  }
}

.webix_cal_range {
  background-color: var(--color-background-common);
}

.webix_cal_range_start {
  border-radius: 3px 0 0 3px;
  background-color: var(--color-item);
  color: var(--color-view-text);
}

.webix_cal_range_end {
  border-radius: 0 3px 3px 0;
  background-color: var(--color-item);
  color: var(--color-view-text);
}

.webix_cal_event.webix_cal_range_start {
  background-color: var(--color-item);
  color: var(--color-view-text);
}

.webix_cal_event.webix_cal_range_end {
  background-color: var(--color-item);
  color: var(--color-view-text);
}

.webix_cal_outside.webix_cal_range {
  background-color: transparent;
  color: #b1bbc8;
}

.webix_timeboard {
  .webix_slider_title {
    text-align: left;
    margin-left: 10px;
  }

  .webix_colon_template .webix_template {
    padding: 0;
    text-align: center;
    line-height: 100%;
    font-size: 27px;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  .webix_day_part .webix_el_box {
    padding-left: 6px;
    color: var(--color-border-2);
    cursor: pointer;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;

    &:hover {
      color: var(--color-item-active-selected);
    }

    &:focus {
      color: var(--color-item-active-selected);
    }
  }
}

.webix_drag_over {
  background-color: var(--color-item);
}

.webix_drop_zone {
  background-color: var(--color-item);
}

.webix_drag_main {
  position: relative;
  background-color: var(--color-background-common);

  .webix_tree_item {
    border: 1px solid #EDEFF0;
    box-sizing: border-box;
  }

  .webix_list_item {
    border: 1px solid #EDEFF0;
    box-sizing: border-box;
  }

  .webix_dataview_item {
    border: 1px solid #EDEFF0;
    box-sizing: border-box;
  }
}

.webix_drag_multiple {
  height: 100%;
  width: 100%;
  position: absolute;
  box-sizing: border-box;
  border: 1px solid #EDEFF0;
  background-color: var(--color-background-common);
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  bottom: 8px;
  left: 8px;
}

.webix_drag_multiple_last {
  height: 100%;
  width: 100%;
  position: absolute;
  box-sizing: border-box;
  border: 1px solid #EDEFF0;
  background-color: var(--color-background-common);
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  bottom: 16px;
  left: 16px;
}

.webix_invisible {
  display: none !important;
}

.webix_drop_area {
  height: 28px;
  box-sizing: border-box;
  background-color: #f1f2f7;
}

.webix_drop_area_inner {
  height: 28px;
  box-sizing: border-box;
  background-color: #f1f2f7;
}

.webix_vscroll_x {
  height: 0px;
  width: 100%;
  overflow-y: hidden;
  overflow-x: scroll;
}

.webix_vscroll_y {
  width: 0px;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
}

.webix_vscroll_body {
  width: 16px;
  height: 16px;
}

.webix_scroll_x {
  width: 50px;
  height: 4px !important;
  left: 1px;
  bottom: 3px;
  background-color: silver;
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  border-radius: 4px;
  box-sizing: border-box;
}

.webix_scroll_y {
  width: 4px !important;
  height: 50px;
  top: 1px;
  right: 3px;
  background-color: silver;
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  border-radius: 4px;
  box-sizing: border-box;
}

.webix_custom_scroll {
  -ms-overflow-style: none;
  scrollbar-width: none;

  &::-webkit-scrollbar {
    display: none;
  }
}

.webix_c_scroll_y {
  position: absolute;
  z-index: 3;
  width: 10px;
  right: 0px;

  > div {
    transition: width 0.3s 0.2s, margin 0.3s 0.2s;
    width: 4px;
    height: 100%;
    background-color: silver;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    margin: 0px 3px;
  }

  &:hover > div {
    width: 10px;
    margin: 0px;
  }
}

.webix_c_scroll_y.webix_scroll_active div {
  width: 10px;
  margin: 0px;
}

.webix_c_scroll_x {
  position: absolute;
  z-index: 3;
  height: 10px;
  bottom: 0px;

  > div {
    transition: height 0.3s 0.2s, margin 0.3s 0.2s;
    height: 4px;
    width: 100%;
    background-color: silver;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    margin: 3px 0px;
  }

  &:hover > div {
    height: 10px;
    margin: 0px;
  }
}

.webix_c_scroll_x.webix_scroll_active div {
  height: 10px;
  margin: 0px;
}

.webix_c_scroll_bar_y {
  position: absolute;
  background: rgba(0, 0, 0, 0.05);
  height: 100%;
  width: 10px;
  right: 0px;
}

.webix_c_scroll_bar_x {
  position: absolute;
  background: rgba(0, 0, 0, 0.05);
  width: 100%;
  height: 10px;
  bottom: 0px;
}

.webix_scroll_cont {
  width: 100%;
  height: auto;
  clear: both;
  position: relative;
}

.webix_secondary {
  .webix_button {
    background: var(--color-item);
    color: var(--color-border-2);

    &:hover {
      background-color: var(--color-item-focus);
    }

    &:focus {
      background-color: var(--color-item-focus);
    }

    &:active {
      background-color: var(--color-item-active);
    }

    .webix_icon {
      color: var(--color-border-2);
    }

    .webix_img_btn_text {
      color: var(--color-border-2);
    }

    .webix_icon_btn {
      color: var(--color-border-2);
    }
  }

  .webix_pressed .webix_button {
    background-color: var(--color-item-active);
  }
}

.webix_primary {
  .webix_button {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }

    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }
  }

  .webix_pressed .webix_button {
    background-color: var(--color-item-active-selected);
  }
}

.webix_danger {
  .webix_button {
    background: #FF5C4C;
    color: var(--color-background-common);

    &:hover {
      background-color: #ff4938;
    }

    &:focus {
      background-color: #ff4938;
    }

    &:active {
      background-color: #ff3723;
    }

    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }
  }

  .webix_pressed .webix_button {
    background-color: #ff3723;
  }
}

.webix_transparent {
  .webix_button {
    color: var(--color-view-text);
    background: transparent;
    border: none;

    .webix_img_btn_text {
      color: var(--color-view-text);
    }

    .webix_icon {
      color: var(--color-title-text);
    }

    .webix_icon_btn {
      color: var(--color-title-text);
    }

    &:hover {
      background-color: rgba(0, 0, 0, 0.04);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.04);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.05);
    }
  }

  .webix_pressed .webix_button {
    background-color: rgba(0, 0, 0, 0.05);
  }
}

.webix_button {
  border-radius: 2px;
  height: 100%;
  width: 100%;
  cursor: pointer;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-border-2);
  letter-spacing: 0px;
  outline: none;
  -webkit-appearance: none;
  padding: 0 6px;
}

.webixbutton {
  border-radius: 2px;
  height: auto;
  width: auto;
  cursor: pointer;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-border-2);
  letter-spacing: 0px;
  outline: none;
  -webkit-appearance: none;
  padding: 8px 15px;
  border-width: 0px;
}

.webix_el_button {
  .webix_el_box {
    position: relative;
  }

  .webix_hidden_upload {
    height: 1px;
    width: 1px;
    border: 0 !important;
    font-size: 1px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
    opacity: 0;
  }

  button {
    border-width: 0px;
  }
}

.webix_el_toggle {
  .webix_el_box {
    position: relative;
  }

  button {
    border-width: 0px;
  }
}

.webix_img_btn {
  vertical-align: top;
  border: none;
  width: 100%;
  padding: 0;

  .webix_icon {
    color: var(--color-border-2);
    margin-right: 4px;
  }

  .webix_image {
    display: inline-block;
    margin-right: 4px;
    vertical-align: middle;
  }
}

.webix_img_btn_top {
  vertical-align: top;
  border: none;
  width: 100%;
  padding: 0;

  .webix_icon {
    font-size: 20px;
    position: absolute;
    top: 8px;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
    color: var(--color-title-text);
  }

  .webix_image {
    font-size: 20px;
    position: absolute;
    top: 8px;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
  }
}

.webix_img_btn_text {
  position: absolute;
  left: 0;
  bottom: 4px;
  width: 100%;
  text-align: center;
  cursor: pointer;
  color: var(--color-border-2);
}

.webix_pressed .webix_button {
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.webix_view.webix_control {
  .webix_disabled_box {
    .webix_button {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: var(--color-title-text);
    }

    .webix_image {
      opacity: 0.4;
    }

    label {
      color: var(--color-title-text);
    }

    .webix_input_icon {
      color: var(--color-border-common);
    }

    button {
      color: var(--color-title-text);
    }

    .webix_slider_title {
      color: var(--color-title-text);
    }

    input {
      color: var(--color-title-text);
      background: #fbfbfd;
      border-color: #EDEFF0;
    }

    select {
      color: var(--color-title-text);
      background: #fbfbfd;
      border-color: #EDEFF0;
    }

    textarea {
      color: var(--color-title-text);
      background: #fbfbfd;
      border-color: #EDEFF0;
    }

    .webix_inp_static {
      color: var(--color-title-text);
      background: #fbfbfd;
      border-color: #EDEFF0;
    }

    .webix_slider_right {
      color: var(--color-title-text);
      background: #fbfbfd;
      border-color: #EDEFF0;
    }

    .webix_slider_handle {
      color: var(--color-title-text);
      background: #fbfbfd;
      border-color: #EDEFF0;
    }

    .webix_inp_counter_prev {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_inp_counter_next {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_segment_0 {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_segment_N {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: #dde0ec;
    }

    .webix_segment_1.webix_selected {
      background-color: #dde0ec;
    }

    .webix_segment_N.webix_selected {
      background-color: #dde0ec;
    }

    .webix_slider_left {
      background-color: var(--color-title-text);
    }

    .webix_item_tab {
      color: var(--color-title-text);
      background: var(--color-item);
      border-color: var(--color-item);
      text-shadow: none;
    }

    .webix_custom_checkbox {
      color: var(--color-border-common);
    }

    .webix_custom_radio {
      color: var(--color-border-common);
    }
  }

  > .webix_disabled {
    opacity: 0;
  }
}

.webix_disabled_view.webix_control {
  .webix_icon_btn {
    color: var(--color-title-text);
  }

  .webix_icon {
    color: var(--color-title-text);
  }

  .webix_image {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
  }
}

.webix_toolbar {
  .webix_disabled_view.webix_control {
    .webix_icon {
      color: var(--color-title-text);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: var(--color-title-text);
    }

    .webix_icon_btn {
      color: var(--color-title-text);
    }
  }

  .webix_el_label {
    text-transform: none;

    .webix_el_box {
      font-family: Roboto, sans-serif;
      font-size: 14px;
      font-weight: 500;
      color: var(--color-view-text);
      letter-spacing: 0px;
    }
  }

  .webix_layout_line {
    background: transparent;
  }

  .webix_layout_clean {
    background: transparent;
  }
}

.webix_richtext_editor {
  height: 100%;
}

.webix_richtext_container .webix_template {
  padding: 10px;
  overflow-x: auto;
  border: solid var(--color-border-common);
  border-width: 0px 1px 1px;
  border-radius: 0px 0px 6px 6px;
}

.webix_richtext_inp_label .webix_template {
  box-sizing: border-box;
  color: #313131;
  text-transform: none;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  float: none;
  padding-top: 10px;
  padding-left: 0;
  padding-right: 8px;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.2px;
  margin-bottom: 0px;
}

.webix_richtext {
  .wxi-underline {
    vertical-align: sub;
    font-size: 20px;
    width: 20px;
  }

  .wxi-italic {
    vertical-align: sub;
    font-size: 20px;
    width: 20px;
  }

  .wxi-bold {
    vertical-align: sub;
    font-size: 20px;
    width: 20px;
  }

  .webix_richtext_container {
    box-shadow: inset 0 1px var(--color-border-common);
  }
}

.webix_control {
  background: transparent;

  input {
    box-sizing: border-box;
    font-family: Roboto, sans-serif;
  }

  button {
    box-sizing: border-box;
    font-family: Roboto, sans-serif;
  }

  textarea {
    box-sizing: border-box;
    font-family: Roboto, sans-serif;
  }
}

.webix_el_label {
  box-sizing: border-box;
  font-family: Roboto, sans-serif;
  color: var(--color-view-text);

  .webix_el_box {
    font-family: Roboto, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #313131;
    letter-spacing: 0.2px;
  }
}

.webix_inp_label {
  box-sizing: border-box;
  font-family: Roboto, sans-serif;
  color: #313131;
  text-transform: none;
  font-size: 12px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  float: left;
  padding-top: 1px;
  padding-left: 0;
  padding-right: 8px;
  font-weight: 500;
  letter-spacing: 0.2px;
  margin-bottom: 0px;
}

.webix_inp_top_label {
  box-sizing: border-box;
  font-family: Roboto, sans-serif;
  color: #313131;
  text-transform: none;
  font-size: 12px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  float: none;
  padding: 3px 2px;
  padding-bottom: 0px;
  font-weight: 500;
  letter-spacing: 0.2px;
  margin-bottom: 0px;
}

.webix_inp_bottom_label {
  box-sizing: border-box;
  font-family: Roboto, sans-serif;
  font-size: 12px;
  color: #516075;
}

.webix_el_box {
  box-sizing: border-box;
  padding: 3px 2px;
  height: 100%;
  width: 100%;
  font-size: 12px;
  overflow: hidden;
}

.webixtoolbarlabel {
  font-size: 14px;
  letter-spacing: 0;
}

.webix_el_text {
  input {
    font-size: 12px;
    height: 100%;
    padding: 0px 12px;
    border: 1px solid var(--color-border-common);
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 4px;
    width: 24px;
  }

  .webix_multicombo_input {
    background-color: transparent;
    border: 0;
    float: left;
    vertical-align: middle;
    font-size: 12px;
    padding: 0px;
    color: var(--color-view-text);
    font-family: Roboto, sans-serif;
    margin-left: 9px;

    &:focus {
      border: 0;
      box-shadow: none;
    }
  }

  .webix_inp_static {
    border-radius: 2px;
    white-space: nowrap;
  }
}

.webix_el_search {
  font-size: 12px;

  input {
    font-size: 12px;
    height: 100%;
    padding: 0px 12px;
    border: 1px solid var(--color-border-common);
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;
    padding-right: 28px;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_inp_static {
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
  }

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 4px;
    width: 24px;
  }

  span {
    position: absolute;
    right: 15px;
    cursor: pointer;
    padding-left: 7px;
  }
}

.webix_el_combo {
  font-size: 12px;

  input {
    font-size: 12px;
    height: 100%;
    padding: 0px 12px;
    border: 1px solid var(--color-border-common);
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;
    padding-right: 28px;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_inp_static {
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
  }

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 4px;
    width: 24px;
  }
}

.webix_el_datepicker {
  font-size: 12px;

  input {
    font-size: 12px;
    height: 100%;
    padding: 0px 12px;
    border: 1px solid var(--color-border-common);
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_inp_static {
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;
    padding-right: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 4px;
    width: 24px;
  }
}

.webix_el_colorpicker {
  font-size: 12px;

  input {
    font-size: 12px;
    height: 100%;
    padding: 0px 12px;
    border: 1px solid var(--color-border-common);
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;
    padding-right: 28px;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_inp_static {
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;
    padding-right: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 0;
    width: 16px;
    height: 16px;
    border-radius: 2px;
  }

  div.webix_inp_static div {
    margin: 2.5px -20px 0px -5px;
  }
}

.webix_multitext_icon {
  &:hover {
    color: var(--color-border-2);
    background: inherit;
    cursor: pointer;
  }

  &:active {
    color: var(--color-border-2);
    background: inherit;
    cursor: pointer;
  }
}

.webix_label_right {
  color: var(--color-view-text);
  text-transform: none;
  font-size: 12px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding-left: 4px;
  margin-bottom: 0px;
}

.webix_el_checkbox {
  .webix_label_right {
    display: block;
    padding-top: 1px;
  }

  input {
    margin: 0px;
    padding: 0px;
    float: left;
    border-color: var(--color-border-common);
  }
}

.webix_el_select select {
  height: 100%;
  font-size: 12px;
  font-family: Roboto, sans-serif;
  border: 1px solid var(--color-border-common);
  border-radius: 2px;
  border-color: var(--color-border-common);

  &:focus {
    border: 1px solid var(--color-border-2);
  }
}

.webix_el_group {
  height: 100%;
  white-space: nowrap;
}

.webix_all_segments {
  height: 100%;
  white-space: nowrap;

  .webix_segment_1 {
    margin-left: 1px;
    border-left: none;
  }

  .webix_segment_N {
    margin-left: 1px;
    border-left: none;
  }
}

.webix_inp_counter_next {
  border: 1px solid var(--color-border-common);
  cursor: pointer;
  -webkit-appearance: none;
  width: 20px;
  height: 100%;
  vertical-align: top;
  padding: 0;
  background: var(--color-item);
  color: var(--color-border-2);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_inp_counter_prev {
  border: 1px solid var(--color-border-common);
  cursor: pointer;
  -webkit-appearance: none;
  width: 20px;
  height: 100%;
  vertical-align: top;
  padding: 0;
  background: var(--color-item);
  color: var(--color-border-2);
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_inp_counter_value {
  border: 1px solid var(--color-border-common);
  cursor: pointer;
  -webkit-appearance: none;
  width: 50px;
  height: 100%;
  vertical-align: top;
  font-size: 12px;
  color: var(--color-view-text);
  text-align: center;
  border-left-width: 0px;
  border-right-width: 0px;
  border-radius: 0;
}

.webix_el_textarea {
  textarea {
    border: 1px solid var(--color-border-common);
    height: 100%;
    margin: 0;
    padding: 5px;
    color: var(--color-view-text);
    resize: none;
    font-size: 12px;
    font-family: Roboto, sans-serif;
    padding-left: 12px;
    padding-right: 12px;
    border-radius: 2px;
    background: var(--color-background-common);
    border-color: #CCD7E6;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_inp_label {
    padding-top: 7px;
  }
}

.webix_textarea_measure {
  border: 1px solid var(--color-border-common);
  height: 100%;
  margin: 0;
  padding: 5px;
  color: var(--color-view-text);
  resize: none;
  font-size: 12px;
  font-family: Roboto, sans-serif;
  padding-left: 12px;
  padding-right: 12px;
  box-sizing: border-box;
  overflow: hidden;
}

.webix_noscroll.webix_el_textarea textarea {
  overflow: hidden;
}

.webix_segment_0 {
  border: 1px solid var(--color-border-common);
  border-right-width: 0px;
  height: 100%;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-appearance: none;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0px;
  outline: none;
  background: var(--color-item);
  color: var(--color-border-2);
  cursor: pointer;
  padding: 0;
  border-color: var(--color-item);
  background-color: var(--color-item);

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_segment_1 {
  border: 1px solid var(--color-border-common);
  border-right-width: 0px;
  height: 100%;
  -webkit-appearance: none;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0px;
  outline: none;
  background: var(--color-item);
  color: var(--color-border-2);
  cursor: pointer;
  padding: 0;
  border-color: var(--color-item);
  background-color: var(--color-item);

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_segment_N {
  border: 1px solid var(--color-border-common);
  height: 100%;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  -webkit-appearance: none;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0px;
  outline: none;
  background: var(--color-item);
  color: var(--color-border-2);
  cursor: pointer;
  padding: 0;
  border-color: var(--color-item);
  background-color: var(--color-item);

  &:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
  }

  &:hover {
    background-color: var(--color-item-focus);
  }

  &:focus {
    background-color: var(--color-item-focus);
  }

  &:active {
    background-color: var(--color-item-active);
  }
}

.webix_segment_0.webix_selected {
  color: var(--color-background-common);
  background: var(--color-item);
  border-color: var(--color-border-2);
  background-color: var(--color-border-2);

  &:focus {
    background: #edeff5;
  }
}

.webix_segment_1.webix_selected {
  color: var(--color-background-common);
  background: var(--color-item);
  border-color: var(--color-border-2);
  background-color: var(--color-border-2);

  &:focus {
    background: #edeff5;
  }
}

.webix_segment_N.webix_selected {
  color: var(--color-background-common);
  background: var(--color-item);
  border-color: var(--color-border-2);
  background-color: var(--color-border-2);

  &:focus {
    background: #edeff5;
  }
}

.webix_segment_0.webix_disabled {
  color: var(--color-title-text);
  background-color: #fbfbfd;
  border-color: transparent;
  cursor: not-allowed;

  &:hover {
    box-shadow: none;
    background-color: #fbfbfd;
  }

  &:focus {
    box-shadow: none;
    background-color: #fbfbfd;
  }

  &:active {
    box-shadow: none;
    background-color: #fbfbfd;
  }
}

.webix_segment_1.webix_disabled {
  color: var(--color-title-text);
  background-color: #fbfbfd;
  border-color: transparent;
  cursor: not-allowed;

  &:hover {
    box-shadow: none;
    background-color: #fbfbfd;
  }

  &:focus {
    box-shadow: none;
    background-color: #fbfbfd;
  }

  &:active {
    box-shadow: none;
    background-color: #fbfbfd;
  }
}

.webix_segment_N.webix_disabled {
  color: var(--color-title-text);
  background-color: #fbfbfd;
  border-color: transparent;
  cursor: not-allowed;

  &:hover {
    box-shadow: none;
    background-color: #fbfbfd;
  }

  &:focus {
    box-shadow: none;
    background-color: #fbfbfd;
  }

  &:active {
    box-shadow: none;
    background-color: #fbfbfd;
  }
}

.webix_segment_0.webix_disabled.webix_selected {
  background-color: #dde0ec;

  &:hover {
    background-color: #dde0ec;
  }

  &:focus {
    background-color: #dde0ec;
  }
}

.webix_segment_1.webix_disabled.webix_selected {
  background-color: #dde0ec;

  &:hover {
    background-color: #dde0ec;
  }

  &:focus {
    background-color: #dde0ec;
  }
}

.webix_segment_N.webix_disabled.webix_selected {
  background-color: #dde0ec;

  &:hover {
    background-color: #dde0ec;
  }

  &:focus {
    background-color: #dde0ec;
  }
}

.webix_inp_static {
  border: 1px solid var(--color-border-common);
  overflow: hidden;
  padding: 0px 12px;
  height: 100%;
  box-sizing: border-box;
  float: left;
}

.webix_placeholder {
  color: var(--color-title-text);
}

::placeholder {
  color: var(--color-title-text);
  opacity: 1;
}

:-ms-input-placeholder {
  color: var(--color-title-text);
}

.webix_el_richselect {
  font-size: 12px;

  input {
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
  }

  .webix_inp_static {
    color: var(--color-view-text);
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
    -webkit-appearance: none;
    border-radius: 2px;
    padding-right: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;

    &:focus {
      border: 1px solid var(--color-border-2);
    }
  }

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 4px;
    width: 24px;
  }
}

.webix_el_texthighlight {
  position: relative;

  .webix_el_box {
    color: var(--color-view-text);
    position: relative;
  }

  .webix_input_icon {
    background-color: transparent;
    position: absolute;
    z-index: 1;
    padding-left: 4px;
    width: 24px;
  }

  .webix_text_highlight {
    line-height: normal;
    letter-spacing: normal;
    box-sizing: border-box;
    -webkit-text-size-adjust: none;
    height: 100%;
    position: absolute;
    border: 1px solid transparent;
    border-radius: 2px;
    background-color: #fff;
    overflow: auto;

    .webix_text_highlight_value {
      text-align: left;
    }
  }

  input {
    line-height: normal;
    letter-spacing: normal;
    box-sizing: border-box;
  }

  textarea {
    line-height: normal;
    letter-spacing: normal;
    box-sizing: border-box;
    overflow: auto;
  }
}

.webix_clear_icon:hover {
  color: #FF5C4C;
  cursor: pointer;

  &::before {
    content: "\F011";
    font-family: "Webix Material Icons";
  }
}

.webix_el_radio {
  .webix_inp_label {
    line-height: normal !important;
    padding-top: 4px;
  }

  .webix_radio_option.webix_disabled .webix_custom_radio {
    color: var(--color-title-text);
    cursor: not-allowed;
  }

  .webix_label_right {
    display: table-cell;
    vertical-align: middle;
  }

  .webix_custom_radio {
    padding: 0;
    display: block;
    background-color: transparent;
    border-color: transparent;
    color: var(--color-title-text);
    cursor: pointer;

    &:before {
      font-family: "Webix Material Icons";
      font-size: 20px;
      content: "\F035";
      display: block;
    }

    &:focus {
      color: #188ba6;
    }
  }

  .webix_radio_1 .webix_custom_radio {
    color: var(--color-border-2);

    &:before {
      content: "\F036";
    }
  }
}

.webix_inp_radio_border {
  display: table-cell;
  vertical-align: middle;

  input {
    margin: 0px;
    padding: 0px;
    float: left;
  }
}

.webix_line_break {
  clear: both;
}

.webix_custom_checkbox {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  float: left;
  position: relative;
  font-size: 20px;
  height: 100%;
  padding: 0;
  margin-top: 1px;
  border: none;
  background-color: transparent;
  color: var(--color-title-text);

  &:before {
    content: "\F013";
    font-family: "Webix Material Icons";
    cursor: pointer;
  }

  &:focus {
    color: #188ba6;
  }
}

.webix_custom_radio {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.webix_radio_option.webix_disabled {
  .webix_label_right {
    color: var(--color-title-text);
    cursor: not-allowed;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  .webix_inp_radio_border {
    color: var(--color-title-text);
    cursor: not-allowed;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
}

.webix_radio_option {
  display: table;
  float: left;
  height: 24px;
  margin-right: 20px;
}

.webix_measure_size {
  font-family: Roboto, sans-serif;

  .webix_inp_radio_border {
    display: table-cell !important;
  }

  .webix_radio_option {
    display: table !important;
    float: left !important;
  }

  .webix_line_break {
    display: block !important;
  }

  input {
    width: 5px;
  }

  textarea {
    width: 5px;
  }

  select {
    width: 5px;
  }

  div {
    float: none;
  }
}

.webix_measure_size.webix_el_radio .webix_label_right {
  display: table-cell !important;
}

.webix_invalid {
  .webix_el_box {
    input {
      background-color: #ffdedb;
      border-color: #ff8d82;
      color: #FF5C4C;
    }

    .webix_inp_static {
      background-color: #ffdedb;
      border-color: #ff8d82;
      color: #FF5C4C;
    }

    select {
      background-color: #ffdedb;
      border-color: #ff8d82;
      color: #FF5C4C;
    }

    textarea {
      background-color: #ffdedb;
      border-color: #ff8d82;
      color: #FF5C4C;
    }
  }

  .webix_custom_radio {
    background-color: #fff6f6;
    border-color: #fea5a8;
  }

  .webix_inp_bottom_label {
    font-size: 12px;
    color: #FF5C4C;
  }

  .webix_list {
    background: #f8e2e2;
  }
}

input.webix_invalid {
  background-color: #ffdedb;
  border-color: #ff8d82;
  color: #FF5C4C;
}

select.webix_invalid {
  background-color: #ffdedb;
  border-color: #ff8d82;
  color: #FF5C4C;
}

textarea.webix_invalid {
  background-color: #ffdedb;
  border-color: #ff8d82;
  color: #FF5C4C;
}

.webix_el_label.webix_disabled_view {
  color: var(--color-title-text);
}

.webix_disabled_top_label {
  color: var(--color-title-text);
}

label.webix_required:after {
  content: "*";
  padding-left: 4px;
  color: #FF5C4C;
}

legend.webix_required:after {
  content: "*";
  padding-left: 4px;
  color: #FF5C4C;
}

.webix_measure_size.webix_required:after {
  content: "*";
  padding-left: 4px;
  color: #FF5C4C;
}

.webix_richtext_inp_label.webix_required .webix_template:after {
  content: "*";
  padding-left: 4px;
  color: #FF5C4C;
}

.webix_multicombo .webix_inp_static {
  padding: 0 3px 0 0;
}

.webix_multicombo_listbox {
  width: auto;
  line-height: 1;
  margin: 0;
  padding: 0;
  list-style: none;
}

.webix_multicombo_value {
  float: left;
  position: relative;
  background-color: var(--color-background-2);
  display: inline-block;
  margin: 3px 0 0 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-radius: 100px;
  box-sizing: border-box;
  padding: 0 20px 0 12px;
}

.webix_multicombo_tag {
  float: left;
  position: relative;
  background-color: var(--color-background-2);
  display: inline-block;
  margin: 3px 0 0 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-radius: 100px;
  box-sizing: border-box;
  min-width: 15px;
  text-align: center;
  padding: 0 12px 0 12px;
}

.webix_multicombo_value.webix_readonly {
  padding: 0 12px 0 12px;
  background-color: var(--color-background-2);
  border-radius: 100px;
}

.webix_multicombo_delete {
  position: absolute;
  top: 50%;
  right: 2px;
  margin-top: -8px;
  font-size: 16px;
  height: 16px;
  line-height: 1;
  color: var(--color-title-text);
  cursor: pointer;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;

  &::after {
    content: "\F033";
    font-family: "Webix Material Icons";
  }
}

.webix_multilist {
  .webix_list_item {
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .webix_selected {
    background: #f2f2f2;
    color: var(--color-view-text);
  }

  .wxi-checkbox-marked {
    vertical-align: middle;
    font-size: 20px;
    width: 24px;
    margin-right: 4px;
    color: var(--color-border-2);
  }

  .wxi-checkbox-blank {
    vertical-align: middle;
    font-size: 20px;
    width: 24px;
    margin-right: 4px;
    color: var(--color-title-text);
  }
}

.webix_checksuggest_select_all {
  border-color: transparent;
  border-bottom: 1px solid var(--color-border-common);
  margin-bottom: 1px;

  .webix_label_right {
    text-transform: capitalize;
    display: block;
    padding: 4px 12px 0 12px;
    text-align: center;
    font-size: 14px;
    color: var(--color-border-2);
  }

  input {
    display: none;
  }

  &:hover {
    cursor: pointer;
    background-color: var(--color-item);
    border-radius: 2px;

    .webix_label_right {
      cursor: pointer;
      color: var(--color-border-2);
    }
  }
}

.webix_el_texthighlight.webix_el_text {
  .webix_text_highlight_value {
    position: relative;
    top: 50%;
    transform: translate(0, -50%);
    overflow: hidden;
    white-space: pre;
  }

  input {
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 0 12px;
  }

  .webix_text_highlight {
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 0 12px;
  }

  .webix_input_icon {
    top: 3px;
  }
}

.webix_el_texthighlight.webix_el_textarea {
  textarea {
    padding: 5px 12px;
  }

  .webix_text_highlight_value {
    word-wrap: break-word;
    margin: 5px 12px;
    white-space: pre-wrap;
  }
}

.webix_el_texthighlight.webix_disabled_view .webix_text_highlight {
  background-color: #fbfbfd;
}

.webix_el_texthighlight.webix_control .webix_el_box {
  input {
    display: block;
    position: relative;
    z-index: 1;
    color: transparent;
    caret-color: var(--color-view-text);
    background: transparent;
    resize: none;
  }

  textarea {
    display: block;
    position: relative;
    z-index: 1;
    color: transparent;
    caret-color: var(--color-view-text);
    background: transparent;
    resize: none;
  }
}

.webix_el_tabbar {
  background: transparent;

  .webixtype_icon {
    .webix_img_btn {
      box-sizing: border-box;
      margin: 0 auto;
      text-align: center;

      .webix_icon_btn {
        box-sizing: border-box;
        margin: 0 3px;
        color: var(--color-border-2);
        font-size: 24px;
        height: 100%;
        line-height: inherit;
        vertical-align: top;
        width: 100%;
      }

      &:active {
        background-color: var(--color-background-common);
      }

      &:hover {
        background-color: transparent;
      }
    }

    .webix_item_tab {
      padding: 0;
      border-radius: 0;

      .webix_img_btn {
        color: var(--color-border-2);
      }
    }

    .webix_img_btn_top {
      background-position: center 0;
      position: relative;
      height: 100%;

      &:active {
        background-color: var(--color-background-common);
      }

      &:hover {
        background-color: transparent;
      }
    }

    .webix_item_tab.webix_selected {
      background: var(--color-background-common);
    }

    .webix_tab_more_icon {
      background: var(--color-background-common);

      .webix_icon {
        color: var(--color-border-2);
      }

      &:hover {
        background-color: var(--color-item);
      }

      &:focus {
        background-color: var(--color-item);
      }
    }
  }

  .webixtype_iconTop {
    box-sizing: border-box;

    .webix_item_tab {
      padding: 0;
      border-radius: 0;
      font-size: 12px;
      padding-top: 2px;
      padding-bottom: 2px;

      .webix_img_btn {
        color: var(--color-border-2);
      }
    }

    .webix_img_btn_top {
      background-position: center 0;
      position: relative;
      height: 100%;

      .webix_icon {
        top: 0;
      }

      .webix_image {
        top: 0;
      }

      &:hover {
        background-color: transparent;
      }
    }

    .webix_icon {
      color: var(--color-border-2);
    }

    .webix_img_btn_text {
      bottom: 0px;
      font-size: 12px;
    }

    .webix_item_tab.webix_selected {
      background: var(--color-background-common);

      .webix_img_btn_text {
        color: var(--color-border-2);
      }

      .webix_icon {
        color: var(--color-border-2);
      }

      .webix_icon_btn {
        background-color: var(--color-background-common);
      }

      .webix_img_btn {
        color: var(--color-border-2);
      }
    }

    .webix_tab_more_icon {
      background: var(--color-background-common);

      .webix_icon {
        color: var(--color-border-2);
      }

      &:hover {
        background-color: var(--color-item);
      }

      &:focus {
        background-color: var(--color-item);
      }
    }

    .webix_img_btn:hover {
      background-color: transparent;
    }
  }

  .webixtype_image {
    box-sizing: border-box;

    .webix_item_tab {
      padding: 0;
      border-radius: 0;
      font-size: 12px;
      padding-top: 2px;
      padding-bottom: 2px;

      .webix_img_btn {
        color: var(--color-border-2);
      }
    }

    .webix_img_btn_top {
      background-position: center 0;
      position: relative;
      height: 100%;

      .webix_icon {
        top: 0;
      }

      .webix_image {
        top: 0;
      }

      &:hover {
        background-color: transparent;
      }
    }

    .webix_icon {
      color: var(--color-border-2);
    }

    .webix_img_btn_text {
      bottom: 0px;
      font-size: 12px;
    }

    .webix_item_tab.webix_selected {
      background: var(--color-background-common);

      .webix_img_btn_text {
        color: var(--color-border-2);
      }

      .webix_icon {
        color: var(--color-border-2);
      }

      .webix_icon_btn {
        background-color: var(--color-background-common);
      }

      .webix_img_btn {
        color: var(--color-border-2);
      }
    }

    .webix_tab_more_icon {
      background: var(--color-background-common);

      .webix_icon {
        color: var(--color-border-2);
      }

      &:hover {
        background-color: var(--color-item);
      }

      &:focus {
        background-color: var(--color-item);
      }
    }

    .webix_img_btn:hover {
      background-color: transparent;
    }
  }

  + .webix_multiview {
    background-color: var(--color-background-common);
  }

  .webixtype_bottom .webix_tab_more_icon {
    background: var(--color-background-common);

    .webix_icon {
      color: var(--color-border-2);
    }

    &:hover {
      background-color: var(--color-item);
    }

    &:focus {
      background-color: var(--color-item);
    }
  }
}

.webix_all_tabs {
  height: 100%;
  display: flex;
  align-items: stretch;

  .webix_item_tab.webix_disabled {
    color: var(--color-title-text);
    background-color: #fbfbfd;
    border-color: transparent;
    cursor: not-allowed;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;

    &:hover {
      color: var(--color-title-text);
      background-color: #fbfbfd;
      border-color: transparent;
    }
  }

  .webix_item_tab.webix_disabled.webix_selected {
    color: var(--color-title-text);
    background-color: #fbfbfd;
    border-color: transparent;

    &:hover {
      color: var(--color-title-text);
      background-color: #fbfbfd;
      border-color: transparent;
    }
  }

  .webix_item_tab {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-border-2);
    letter-spacing: 0px;
    border: none;

    &:hover {
      background-color: var(--color-item);
    }

    .webix_icon.webix_tab_close {
      width: 28px;
      font-size: 20px;
      padding: 0;
      margin-top: 1px;
      color: var(--color-title-text);

      &:focus {
        color: #FF5C4C;
      }
    }
  }

  .webix_item_tab.webix_selected {
    box-shadow: inset 0 -2px var(--color-border-2);
    padding-bottom: 0;

    &:hover {
      background-color: transparent;
    }

    &:focus {
      color: var(--color-item-active-selected);
      box-shadow: inset 0 -2px var(--color-item-active-selected);
    }
  }

  .webix_item_tab.webix_selected.webix_disabled {
    box-shadow: inset 0 -2px var(--color-title-text);
  }

  .webix_tab_filler {
    border: none;
  }

  .webix_tab_more_icon {
    .webix_icon {
      color: var(--color-border-2);
    }

    &:hover {
      background-color: var(--color-item);
    }

    &:focus {
      background-color: var(--color-item);
    }
  }
}

.webix_tab_filler {
  background: transparent;
  font-size: 1px;
  border-bottom: 1px solid var(--color-border-common);
  box-sizing: border-box;

  &:first-child {
    border-right: 0;
  }
}

.webix_item_tab {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  border: 1px solid var(--color-border-common);
  border-left-width: 0px;
  background: var(--color-background-common);
  color: var(--color-border-2);
  border-top-left-radius: 2px;
  border-bottom-left-radius: 0px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 0px;
  box-sizing: border-box;

  &:first-child {
    border-left: 1px solid var(--color-border-common);
  }
}

.webixtype_bottom {
  .webix_item_tab {
    border-radius: 0;
    background: var(--color-background-common);
    padding: 0;

    &:last-child {
      border-right: none;
    }
  }

  .webix_item_tab.webix_selected {
    border-bottom-width: 1px;
    background: var(--color-background-common);
    padding: 0;
    box-shadow: inset 0 2px var(--color-border-2);
    color: var(--color-border-2);

    &:last-child {
      border-right: none;
    }

    &:focus {
      box-shadow: inset 0 2px var(--color-item-active-selected);
    }
  }

  .webix_item_tab.webix_selected.webix_disabled {
    box-shadow: inset 0 2px var(--color-title-text);
  }
}

.webix_item_tab.webix_selected {
  border-bottom-width: 0px;
  background: var(--color-background-common);
  color: var(--color-border-2);
}

.webix_before_all_tabs {
  width: 100%;
}

.webix_after_all_tabs {
  width: 100%;
  border-left: 1px solid var(--color-border-common);
  border-right: 1px solid var(--color-border-common);
  box-sizing: border-box;
}

.webix_tab_more_icon {
  cursor: pointer;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding: 0 3px;
  box-sizing: border-box;

  .webix_icon {
    width: 100%;
  }
}

.webix_tab_list .webix_list_item:last-child {
  border-bottom: none;
}

.webix_icon.webix_tab_close {
  font-size: 12px;
  position: absolute;
  right: 0px;

  &:focus {
    color: #FF5C4C;
  }
}

.webix_item_tab_text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0 5px;
}

.webix_item_tab_text_close {
  padding-right: 22px;
}

.webix_menu {
  background: var(--color-background-common);
  border: 1px solid var(--color-border-common);
  border-radius: 0px;

  .webix_list_item {
    border: none;
    text-decoration: none;
    background: var(--color-background-common);
    height: 28px;
    display: block;

    &:hover {
      background: rgba(100, 100, 100, 0.1);
    }

    &:active {
      background: rgba(100, 100, 100, 0.1);
    }

    &:focus {
      background: rgba(100, 100, 100, 0.1);
    }

    .webix_submenu_icon {
      float: right;
      text-align: right;
      position: relative;
      margin-left: 4px;
    }
  }

  .webix_context_separator {
    height: 3px;
    padding: 1px 3px 0 3px;

    .sep_line {
      height: 1px;
      border-top: 1px solid var(--color-border-common);
    }
  }

  .webix_submenu_icon {
    top: 8px;
  }

  .webix_context_spacer {
    height: 28px;
  }

  .webix_list_item.webix_sidebar_selected {
    background: rgba(0, 0, 0, 0.02);

    &:hover {
      background: rgba(0, 0, 0, 0.02) !important;
    }
  }
}

.webix_menu-x {
  border-color: transparent;
  background: transparent;
  color: var(--color-background-common);

  .webix_list_item {
    border: none;
    text-decoration: none;
    background: var(--color-border-2);
    height: 28px;
    display: inline-block;
    line-height: 24px;
    border-right: 1px solid #fff;
    border-left: 0px;
    color: #fff;
    font-size: 12px;

    &:hover {
      background: rgba(100, 100, 100, 0.1);
      background-color: var(--color-item-selected);
    }

    &:active {
      background: rgba(100, 100, 100, 0.1);
      background-color: var(--color-item-selected);
    }

    &:focus {
      background: rgba(100, 100, 100, 0.1);
      background-color: var(--color-item-selected);
    }

    .webix_submenu_icon {
      float: right;
      text-align: right;
      position: relative;
      margin-left: 0;
      font-size: 14px;
      font-family: "Webix Material Icons";
      width: 6px;
      top: 0;

      &:before {
        content: '\F001';
      }
    }

    &:first-child {
      margin-left: 0;
      border-top-left-radius: 2px;
      border-bottom-left-radius: 2px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }

    .webix_icon_btn {
      color: #fff;
      text-align: left;
    }

    &:last-child {
      border-right: none;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border-top-right-radius: 2px;
      border-bottom-right-radius: 2px;
    }
  }

  .webix_submenu_icon {
    top: 10px;
  }

  .webix_list_item.webix_selected {
    box-shadow: none;
  }

  .webix_list_item.webix_disabled {
    color: var(--color-title-text);
    background-color: #fbfbfd;
  }
}

.webix_menu-x.webix_disabled_view {
  .webix_disabled {
    background-color: transparent;
  }

  .webix_list_item.menu {
    color: var(--color-title-text);
    background: var(--color-item);
  }
}

.webix_menu_link {
  color: inherit;
  text-decoration: none;
  display: block;
  height: 100%;
}

.webix_toolbar.webix_layout_subbar {
  background: transparent;

  .webix_el_label .webix_el_box {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-view-text);
    letter-spacing: 0px;
  }

  .webix_view {
    color: var(--color-view-text);
  }
}

.webix_toolbar.webix_layout_subbar.webix_dark {
  background: var(--color-background-accent);
  border-color: var(--color-background-accent);

  .webix_el_button {
    color: var(--color-background-common);
  }

  .webix_el_label .webix_el_box {
    color: var(--color-background-common);
  }

  .webix_inp_label {
    color: var(--color-background-common);
  }

  .webix_inp_top_label {
    color: var(--color-background-common);
  }

  .webix_slider_title {
    color: var(--color-background-common);
  }

  .webix_secondary {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      background-color: rgba(0, 0, 0, 0.2);
      color: var(--color-background-common);
      border-color: transparent;

      &:hover {
        color: var(--color-background-common);
        background-color: rgba(0, 0, 0, 0.4);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.4);
        color: var(--color-background-common);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.5);
        color: var(--color-background-common);
      }
    }
  }

  .webix_transparent {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      color: var(--color-background-common);

      &:hover {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.4);
      }
    }
  }

  .webix_inp_counter_next {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_inp_counter_prev {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_0 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_1 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_N {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_menu-x .webix_list_item {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_view > .webix_template {
    color: var(--color-background-common);
    background-color: var(--color-background-accent);
  }

  .webix_inp_static {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    input[type=text] {
      background-color: transparent;
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=text] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=combo] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=datepicker] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  textarea {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  select {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    option {
      background-color: var(--color-background-accent);
      color: var(--color-background-common);
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  .webix_text_highlight {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_el_texthighlight {
    input {
      caret-color: rgba(255, 255, 255, 0.7);
    }

    textarea {
      caret-color: rgba(255, 255, 255, 0.7);
    }
  }

  .webix_multicombo_value {
    color: var(--color-background-accent);
  }

  .webix_multicombo_tag {
    color: var(--color-background-accent);
  }

  .webix_el_counter {
    button {
      background-color: rgba(0, 0, 0, 0.3);
    }

    input[type=text]:focus {
      border-color: transparent;
    }
  }

  .webix_placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  ::placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_input_icon {
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_selected.webix_segment_0 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_1 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_N {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_img_btn_top {
    border-width: 0;

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon {
      color: var(--color-background-common);
    }
  }

  .webix_el_icon {
    color: var(--color-background-common);
  }

  .webix_img_btn {
    color: var(--color-background-common);
    border-width: 0;
  }

  .webix_icon_btn {
    color: var(--color-background-common);
  }

  .webix_icon_button {
    color: var(--color-background-common);

    &:hover {
      &:before {
        background-color: rgba(0, 0, 0, 0.2);
      }

      .webix_icon {
        opacity: 1;
      }
    }

    &:focus .webix_icon {
      opacity: 1;
    }

    .webix_icon {
      color: var(--color-background-common);
      opacity: 0.7;
    }
  }

  .webix_control {
    border-color: var(--color-border-2);
  }

  .webix_custom_checkbox {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_custom_radio {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_label_right {
    color: var(--color-background-common);
  }

  .webix_view.webix_control .webix_disabled_box {
    .webix_button {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    label {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_input_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    button {
      color: rgba(255, 255, 255, 0.4);
    }

    input {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    select {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    textarea {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_static {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;

      input {
        background-color: transparent;
      }
    }

    .webix_inp_counter_prev {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_counter_next {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_segment_0 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_N {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_item_tab {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_1.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_N.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }
  }

  .webix_disabled_view.webix_control {
    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_view.webix_menu-x .webix_list_item.menu {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_toolbar .webix_disabled_view.webix_control {
    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_top_label {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_invalid {
    .webix_el_box {
      input {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      .webix_inp_static {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;

        input {
          background-color: transparent;
        }
      }

      select {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      textarea {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }
    }

    .webix_multicombo_value {
      color: #FF5C4C;
    }

    .webix_multicombo_tag {
      color: #FF5C4C;
    }
  }

  input.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  select.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  textarea.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }
}

.webix_hidden_upload {
  height: 1px;
  width: 1px;
  border: 0 !important;
  font-size: 1px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
  opacity: 0;
}

.webix_upload_client {
  width: 60px;
  text-align: center;
  float: right;
}

.webix_upload_error {
  width: 60px;
  text-align: center;
  float: right;
}

.webix_upload_server {
  width: 60px;
  text-align: center;
  float: right;
  color: #55CD97;
}

.webix_error_icon {
  display: inline-block;
  background-repeat: no-repeat;
  width: 20px;
  height: auto;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 20px;
  color: #FF5C4C;

  &:before {
    content: "\F034";
  }
}

.webix_cancel_icon {
  display: inline-block;
  background-repeat: no-repeat;
  margin-top: 5px;
  width: 20px;
  height: auto;
  background-image: none;
  font-family: "Webix Material Icons";
  font-size: 17px;
  margin: 0;

  &:hover {
    color: #FF5C4C;
  }

  &:before {
    content: "\F011";
  }
}

.webix_remove_upload {
  float: right;
}

.webix_upload_flash {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: #fff;
}

.webix_drop_file {
  background: #f4f4f4;
  position: relative;

  &::before {
    position: absolute;
    bottom: 10px;
    left: 0px;
    width: 100%;
    text-align: center;
    pointer-events: none;
  }
}

.webix_fieldset > fieldset {
  border: 1px solid var(--color-border-common);
  margin: 0px;
  padding: 5px 8px;
}

.webix_fieldset_label {
  color: var(--color-view-text);
  font-size: 12px;
  padding: 0px 8px;
  text-transform: uppercase;
}

.webix_forminput > fieldset {
  border: none;
  margin: 0px;
  padding: 0px;
}

.webix_forminput_label {
  color: var(--color-view-text);
  font-family: Roboto, sans-serif;
  float: left;
  line-height: 24px;
  padding: 3px 2px;
  padding-right: 8px;
  box-sizing: border-box;
}

legend.webix_forminput_label_top {
  width: 100%;
  padding: 3px 2px 0;
}

.webix_slider_box {
  position: relative;
  padding: 0px 10px;
  height: 100%;
  padding-top: 13px;
  float: left;
  border-radius: 5px;
  box-sizing: border-box;
  margin-top: -11px;

  .webix_slider_left {
    height: 6px;
    float: left;
    width: 100px;
    background: var(--color-border-2);
    border: 1px solid #CCD7E6;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    box-sizing: border-box;
  }

  .webix_slider_right {
    height: 6px;
    float: left;
    width: 100px;
    background: #fff;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 1px solid #e8eaec;
    box-sizing: border-box;
    border-color: #CCD7E6;
  }

  .webix_slider_handle {
    z-index: 1;
    position: absolute;
    width: 12px;
    height: 12px;
    top: 9px;
    border-radius: 8px;
    border: 1px solid #CCD7E6;
    background-color: var(--color-background-common);

    &:focus {
      border-color: var(--color-border-2);
    }
  }
}

.webix_rangeslider {
  .webix_slider_box {
    .webix_slider_left {
      position: absolute;
    }

    .webix_slider_active {
      z-index: 2;
    }

    .webix_slider_right {
      border-radius: 5px;
    }
  }

  .webix_slider_title_box {
    position: relative;
    float: left;
    height: 14px;
    width: 1px;
    margin-top: 0px;
  }

  .webix_slider_title.webix_slider_move {
    position: absolute;
  }

  .webix_slider_title {
    height: 14px;
    margin-top: 0px;
  }
}

.webix_rangeslider.webix_slider_vertical {
  .webix_slider_box .webix_slider_right {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
  }

  .webix_slider_title.webix_slider_move {
    display: block;
    position: relative;
  }
}

.webix_slider_alt.webix_slider_vertical .webix_slider_box .webix_slider_handle {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAFAQMAAABCXz8WAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAZQTFRFAAAAAAAApWe5zwAAAAJ0Uk5TNgD/j1xNAAAADklEQVR4nGNgYPjPAMYACgAB/xSLTywAAAAASUVORK5CYII=");
  background-repeat: no-repeat;
}

.webix_slider_alt .webix_slider_box {
  .webix_slider_left {
    border: 1px solid #CCD7E6;
    background: var(--color-border-2);
  }

  .webix_slider_right {
    border: 1px solid #e1e1e1;
    border-color: #CCD7E6;
  }

  .webix_slider_handle {
    width: 11px;
    margin: 0 2px;
    height: 12px;
    top: 9px;
    border-radius: 2px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAICAYAAAAx8TU7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTJCMjdFNENBRTg4MTFFMjk2NjJGMTJENjkyNDA2NTkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTJCMjdFNERBRTg4MTFFMjk2NjJGMTJENjkyNDA2NTkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5MkIyN0U0QUFFODgxMUUyOTY2MkYxMkQ2OTI0MDY1OSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5MkIyN0U0QkFFODgxMUUyOTY2MkYxMkQ2OTI0MDY1OSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Powz/icAAAAaSURBVHjaYmBgYDBjgAA4zcSABQysIECAAQBn+ACx2PqtbAAAAABJRU5ErkJggg==");
    background-repeat: no-repeat;
    background-position: 3px center;
    background-color: var(--color-background-common);
    border: 1px solid #CCD7E6;

    &:focus {
      border-color: var(--color-border-2);
    }
  }
}

.webix_slider_vertical {
  .webix_slider_box {
    margin-top: -10px;

    .webix_slider_left {
      width: 6px;
      float: none;
      border-top-left-radius: 0;
      border-bottom-left-radius: 5px;
      border-top-right-radius: 0;
      border-bottom-right-radius: 5px;
    }

    .webix_slider_right {
      width: 6px;
      float: none;
      border-top-left-radius: 5px;
      border-bottom-left-radius: 0;
      border-top-right-radius: 5px;
      border-bottom-right-radius: 0;
    }

    .webix_slider_handle {
      left: 6px;
    }
  }

  .webix_slider_title {
    padding-top: 1px;
    text-align: left;
  }
}

.webix_slider_vertical.webix_slider_alt .webix_slider_handle {
  height: 11px;
  width: 14px;
  left: 3px;
}

.webix_slider_title {
  text-align: center;
}

.webix_slider_title.webix_slider_move {
  position: relative;
  text-align: left;
  display: inline-block;
  width: auto;
  white-space: nowrap;
}

.webix_switch_toggle {
  position: absolute;
  visibility: hidden;
}

.webix_switch_box {
  display: block;
  position: relative;
  top: 50%;
  margin-top: -11px;
  height: 22px;
  cursor: pointer;
  background-color: var(--color-item);
  border: 1px solid var(--color-border-common);
  border-radius: 60px;
  transition: background-color 0.4s ease;
  color: var(--color-view-text);
  text-align: center;
  float: left;
  box-sizing: border-box;

  &:active .webix_switch_handle {
    box-shadow: 0 0px 2px 2px rgba(0, 0, 0, 0.2);
  }

  .webix_switch_text {
    padding-top: 2px;
  }
}

.webix_el_switch .webix_label_right {
  display: block;
  padding-top: 3px;
  margin-top: 4px;
}

.webix_switch_handle {
  height: 20px;
  width: 20px;
  border-radius: 100%;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
  border: 1px solid #eee;
  position: absolute;
  top: 0px;
  background-color: #fff;
  transition: left 0.3s ease;
  cursor: pointer;
  box-sizing: border-box;

  &:focus {
    box-shadow: 0 0px 2px 2px rgba(0, 0, 0, 0.2);
  }
}

.webix_switch_text {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 1px 0 0 18px;
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
}

.webix_switch_on .webix_switch_text {
  padding: 1px 18px 0 0;
}

.webix_switch_box.webix_switch_on {
  background-color: var(--color-border-2);
  color: #fff;
}

.webix_progress_top {
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  height: 6px;
  overflow: hidden;
  z-index: 95;
  background: #f2f2f2;

  .webix_progress_state {
    width: 0px;
    height: 6px;
    background: var(--color-border-2);
    transition: width 3s;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent);
    background-size: 10px 10px;
  }
}

.webix_progress_bottom {
  width: 100%;
  position: absolute;
  top: auto;
  left: 0px;
  height: 17px;
  overflow: hidden;
  z-index: 95;
  background: #f2f2f2;
  bottom: 0px;

  .webix_progress_state {
    width: 0px;
    height: 17px;
    background: var(--color-border-2);
    transition: width 3s;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent);
    background-size: 14px 14px;
  }
}

.webix_progress_icon {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 95;

  .webix_progress_state {
    font-family: "Webix Material Icons";
    font-size: 50px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -25px;
    margin-top: -25px;
    display: inline-block;
    color: #93a0b3;
  }
}

.webix_gage_box {
  display: table;
  height: 100%;
  width: 100%;

  > div {
    display: table-cell;
    vertical-align: middle;
  }
}

.webix_gage_body {
  height: 100%;
  width: 100%;
  transform: rotate(180deg);
}

.webix_gage_label {
  font-size: 0.9em;
  text-align: center;
  margin-top: 10px;
}

.webix_gage_placeholder {
  margin-top: -20px;
}

.webix_gage_info {
  text-align: center;
  font-size: 0.7em;
  position: relative;
  margin: 0 auto 10px auto;
}

.webix_gage_min_range {
  left: -23%;
  display: inline-block;
  margin-top: 20px;
  position: absolute;
  text-align: center;
  width: 46%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.webix_gage_max_range {
  right: -23%;
  display: inline-block;
  margin-top: 20px;
  position: absolute;
  text-align: center;
  width: 46%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.webix_gage_range_info {
  font-size: 1.2em;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.webix_gage_value {
  font-size: 2.2em;
  color: var(--color-view-text);
  overflow: hidden;
  text-overflow: ellipsis;
}

.webix_gage_gradient_point_animated {
  transition: transform 1.3s linear;
}

.webix_gage_animated {
  stroke: hsl(120, 100%, 50%);
  animation: gage_dash 1.3s linear forwards;
  transition: stroke 1.3s linear, stroke-dasharray 1.3s linear;
}

@keyframes gage_dash {
  to {
    stroke-dashoffset: 0;
  }
}

.webix_gage_small_font {
  .webix_gage_info {
    font-size: 1em;
  }

  .webix_gage_range_info {
    font-size: 1em;
  }

  .webix_gage_label {
    font-weight: 500;
    font-size: 1.2em;
  }

  .webix_gage_value {
    font-weight: 500;
    font-size: 1.2em;
  }

  .webix_gage_min_range {
    margin-top: 0;
  }

  .webix_gage_max_range {
    margin-top: 0;
  }

  .webix_gage_placeholder {
    margin-top: 0;
    padding-top: 20px;
  }
}

.webix_bullet_header {
  font-weight: 500;
  font-size: 12px;
  fill: var(--color-view-text);
}

.webix_bullet_subheader {
  font-size: 12px;
  fill: var(--color-view-text);
}

.webix_bullet_scale {
  fill: var(--color-title-text);
  font-size: 12px;
  font-weight: 500;
  stroke: none;
  text-anchor: middle;
}

.webix_bullet_scale_lines {
  stroke: var(--color-title-text);
}

.webix_bullet_marker {
  y: 5px;
  width: 3px;
}

.webix_timeline .webix_scroll_cont {
  padding-top: 28px;
}

.webix_timeline_item {
  line-height: 0;
  padding: 0 12px;
  position: relative;
  box-sizing: border-box;
}

.webix_timeline_date {
  line-height: 20px;
  overflow: hidden;
  position: absolute;
  top: 0px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.webix_timeline_event {
  line-height: 20px;
  overflow: hidden;
  position: absolute;
  top: 0px;
}

.webix_timeline_left .webix_timeline_date {
  text-align: right;
}

.webix_timeline_right {
  .webix_timeline_details {
    text-align: right;
  }

  .webix_timeline_value {
    text-align: right;
  }
}

.webix_timeline_value {
  font-weight: 500;
}

.webix_timeline_details {
  color: var(--color-title-text);
  padding-top: 2px;
}

.webix_timeline_horizontal {
  .webix_scroll_cont {
    white-space: nowrap;
    display: inline-block;
    padding-left: 28px;
    height: 100%;
    box-sizing: border-box;
  }

  .webix_timeline_item {
    display: inline-block;
    height: 100%;
    padding: 12px 0 12px 0;
    white-space: normal;

    .webix_timeline_date {
      left: 0px;
    }

    .webix_timeline_event {
      left: 0px;
    }
  }

  .webix_timeline_item.webix_timeline_bottom .webix_timeline_event {
    top: initial;
  }
}

.webix_treemap {
  background-color: #f5f5f5;

  .webix_scroll_cont {
    position: relative;
    height: 100%;
    width: 100%;
  }
}

.webix_treemap_item {
  position: absolute;
  color: var(--color-section-text);
  overflow: hidden;
  text-align: left;
  box-sizing: border-box;
  padding: 3px 5px;
  border-width: 0px 1px 1px 0;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.2);
  background: transparent;
  cursor: pointer;

  &:hover {
    box-shadow: inset 0 0 0 1px #5ccce7;
  }
}

.webix_treemap_level_top {
  z-index: 1;
  border-color: rgba(0, 0, 0, 0.4);
}

.webix_treemap_item_bottom {
  border-bottom-width: 0;
}

.webix_treemap_item_right {
  border-right-width: 0;
}

.webix_treemap_item.webix_selected {
  border-color: inherit;
  box-shadow: inset 0 0 0 2px var(--color-border-2);
}

.webix_treemap_header {
  width: 100%;
  box-sizing: border-box;
  padding: 0 10px;
  border-bottom: 1px solid var(--color-border-common);
}

.webix_treemap_header_item {
  cursor: pointer;

  &:last-child {
    cursor: default;
  }
}

.webix_treemap_reset {
  float: right;
  width: 25px;
  text-align: center;

  &:before {
    content: "\F011";
    color: var(--color-view-text);
    font-family: "Webix Material Icons";
    font-size: 16px;
    display: block;
    cursor: pointer;
  }
}

.webix_treemap_path_icon {
  width: 20px;
  text-align: center;
}

.webix_barcode {
  position: relative;

  .webix_canvas_text {
    font-size: 12px;
    padding: 0 2px;
    box-sizing: border-box;
  }
}

.portlet_drag {
  position: absolute;
  z-index: 1;
  top: 5px;
  right: 5px;
  width: 18px;
  opacity: 0.5;
  cursor: pointer;
}

.portlet_in_drag {
  opacity: 0.4;
}

.portlet_marker {
  opacity: 0.5;
  background: var(--color-border-2);
  position: absolute;
  z-index: 2;
  transition: top 0.5s, left 0.5s, width 0.5s, height 0.5s;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

.portlet_markertop {
  opacity: 0.5;
  background: var(--color-border-2);
  position: absolute;
  z-index: 2;
  transition: top 0.5s, left 0.5s, width 0.5s, height 0.5s;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 50%;
}

.portlet_markerbottom {
  opacity: 0.5;
  background: var(--color-border-2);
  position: absolute;
  z-index: 2;
  transition: top 0.5s, left 0.5s, width 0.5s, height 0.5s;
  top: 50%;
  left: 0px;
  width: 100%;
  height: 50%;
}

.portlet_markerleft {
  opacity: 0.5;
  background: var(--color-border-2);
  position: absolute;
  z-index: 2;
  transition: top 0.5s, left 0.5s, width 0.5s, height 0.5s;
  top: 0px;
  left: 0px;
  width: 50%;
  height: 100%;
}

.portlet_markerright {
  opacity: 0.5;
  background: var(--color-border-2);
  position: absolute;
  z-index: 2;
  transition: top 0.5s, left 0.5s, width 0.5s, height 0.5s;
  top: 0px;
  left: 50%;
  width: 50%;
  height: 100%;
}

.panel_icon {
  position: absolute;
  z-index: 93;
  top: 5px;
  right: 5px;
  line-height: normal;
  font-size: 13px;
  width: 18px;
  opacity: 0.5;
  cursor: pointer;
}

.panel_target {
  position: absolute;
  z-index: 3;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid var(--color-border-common);
  box-sizing: border-box;
}

.webix_popup.webix_sidemenu.webix_sidemenu_left {
  border-width: 0 1px 0 0;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  border: none;
}

.webix_sidemenu_left.webix_animate {
  transition: left 0.6s;
}

.webix_popup.webix_sidemenu.webix_sidemenu_right {
  left: auto;
  border-width: 0 0 0 1px;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  border: none;
}

.webix_sidemenu_right.webix_animate {
  transition: right 0.6s;
}

.webix_popup.webix_sidemenu.webix_sidemenu_top {
  border-width: 0 0 1px 0;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  border: none;
}

.webix_sidemenu_top .webix_win_body {
  position: relative;

  > .webix_view {
    position: absolute;
    top: auto;
    left: 0;
    bottom: 0;
  }
}

.webix_sidemenu_top.webix_animate {
  transition: height 0.6s;

  .webix_win_body {
    transition: height 0.6s;
  }
}

.webix_popup.webix_sidemenu.webix_sidemenu_bottom {
  border-width: 1px 0 0 0;
  top: auto;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1);
  border: none;
}

.webix_sidemenu_bottom.webix_animate {
  transition: height 0.6s;

  .webix_win_body {
    transition: height 0.6s;
  }
}

.webix_sidebar {
  background: #ECEFF1;
  background-color: var(--color-background-common);

  .webix_tree_item.webix_selected {
    background-color: var(--color-item);
    padding-right: 0;
    color: var(--color-border-2);
    font-weight: 500;

    &:focus span {
      background: transparent;
    }

    span {
      background-color: transparent;
      padding-right: 0;
      margin: 0;
      padding: 0px;
      color: var(--color-border-2);
    }

    .webix_sidebar_icon {
      margin-right: 8px;
      color: var(--color-border-2);
    }

    .webix_sidebar_dir_icon {
      color: var(--color-border-2);
    }
  }

  .webix_tree_item {
    color: var(--color-view-text);
    height: 36px;
    line-height: 36px;
    cursor: pointer;

    span {
      margin: 0;
      padding: 0px;
    }

    &:hover {
      background-color: #edeff5;
    }

    .webix_sidebar_icon {
      margin-right: 8px;
    }
  }

  .webix_scroll_cont > .webix_tree_leaves {
    display: block;
    padding: 0;
  }

  .webix_tree_leaves .webix_tree_leaves {
    margin-left: 0px;
  }

  .webix_tree_branch_1 {
    border-bottom: 1px solid #e5e5e5;
    border: none;

    .webix_tree_item {
      padding-left: 44px;
      padding-right: 12px;
    }

    > .webix_tree_item {
      height: 36px;
      line-height: 36px;
      padding-left: 12px;
      color: var(--color-view-text);
      cursor: pointer;
    }
  }

  .webix_sidebar_icon {
    width: 20px;
    vertical-align: middle;
    color: var(--color-title-text);
    font-size: 20px;
  }

  .webix_sidebar_dir_icon {
    color: var(--color-title-text);
    font-size: 20px;
  }

  .webix_tree_item.webix_sidebar_selected {
    color: var(--color-border-2);
    background-color: var(--color-item);
    font-weight: 500;

    .webix_sidebar_icon {
      color: var(--color-border-2);
    }

    .webix_sidebar_dir_icon {
      color: var(--color-border-2);
    }
  }
}

.webix_sidebar_selected {
  background-color: rgba(0, 0, 0, 0.02);
}

.webix_sidebar_expanded .webix_tree_item:hover {
  background-color: rgba(0, 0, 0, 0.02);
}

.webix_icon.webix_sidebar_icon {
  width: 44px;
  text-align: center;
}

span.webix_sidebar_dir_icon {
  float: right;
  line-height: inherit;
}

.webix_sidebar_popup {
  border: none !important;
  box-shadow: 2px 3px 3px #ddd;
  border-radius: 0;

  .webix_list_item {
    border-radius: 0;
  }

  .webix_sidebar_popup_title {
    background-color: var(--color-item);

    .webix_template {
      border: none;
      line-height: 36px;
    }
  }

  .webix_sidebar_popup_title.webix_selected {
    color: var(--color-border-2);
    font-weight: 500;
  }
}

.webix_sidebar_popup_right {
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 7px 0 rgba(0, 0, 0, 0.1);

  .webix_sidebar_popup_title .webix_template {
    border: 1px solid #E5E5E5;
    border-right: none;
  }

  .webix_list_item.webix_selected {
    box-shadow: inset -2px 0 var(--color-border-2);
  }

  .webix_list_item.webix_sidebar_selected {
    box-shadow: inset -2px 0 var(--color-border-2);
  }
}

.webix_sidebar_popup_list.webix_sidebar_popup_left .webix_icon {
  float: right;
  line-height: inherit;
  width: 8px;
}

.webix_sidebar_popup_list.webix_sidebar_popup_right .webix_icon {
  float: left;
  line-height: inherit;
  margin-left: -8px;
}

.webix_sidebar_popup_title {
  background: #ECEFF1;

  .webix_template {
    line-height: 36px;
    padding: 0 10px;
    border: 1px solid #E5E5E5;
    border-left: none;
  }
}

.webix_sidebar_popup_title.webix_selected {
  border-left-color: var(--color-item);
  background: var(--color-item);
}

.webix_sidebar_selected.webix_sidebar_popup_title .webix_template {
  background: rgba(0, 0, 0, 0.03);
  border-left: none;
}

.webix_sidebar_popup_list {
  .webix_list_item {
    border-left: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
    border-width: 0px;

    &:first-child {
      border-top: 1px solid #E5E5E5;
      border-width: 0px;
    }

    &:hover {
      background: #f6f9fb;
    }
  }

  .webix_list_item.webix_selected {
    color: var(--color-border-2);
    font-weight: 500;

    &:hover {
      background: var(--color-item);
    }
  }

  .webix_list_item.webix_sidebar_selected {
    background-color: var(--color-item);
    color: var(--color-border-2);
    font-weight: 500;

    &:hover {
      background-color: var(--color-item) !important;
    }
  }

  .webix_tree_branch_1 > .webix_tree_item {
    height: 36px;
    line-height: 36px;
  }
}

.webix_view.webix_pdf {
  background-color: #404040;
  overflow: auto;
}

.webix_pdf .canvas_wrapper {
  margin: 0px auto;
  box-shadow: 5px 5px 15px #1c1c1c;
  width: 100%;
  height: 100%;
}

.webix_toolbar.pdf_bar {
  background-color: #474747;

  .webix_img_btn {
    text-align: center;

    &:focus {
      background-color: #333333;
    }

    &:hover {
      background-color: #333333;
    }
  }

  .webix_view {
    background-color: transparent;
  }

  .webix_icon_btn {
    margin: 0;
    font-size: 16px;
  }

  .webix_template {
    background-color: transparent;
    color: #fff;
    line-height: 2em;
  }

  .webix_el_box {
    input {
      background-color: #5c5c5c;
      color: #fff;
      border-color: #404040;

      &:focus {
        border-color: #333;
      }
    }

    .webix_input_icon {
      color: #fff;
    }
  }

  .webix_inp_static {
    background-color: #5c5c5c;
    color: #fff;
    border-color: #404040;

    &:focus {
      border-color: #333;
    }
  }
}

.webix_view.webix_popup.pdf_opt_list {
  border: none;
}

.pdf_opt_list .webix_list {
  background-color: #404040;
  color: #fff;

  .webix_list_item {
    border-color: #474747;
    line-height: 1.5em;

    &:hover {
      color: #404040;
      background-color: #fff;
    }
  }

  .webix_list_item.webix_selected {
    color: #404040;
    background-color: #fff;
  }
}

.webix_dbllist {
  .bottom_label {
    text-align: center;
    font-size: 12px;
    background: #ededed;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    color: var(--color-title-text);
    letter-spacing: 0.2px;
  }

  .webix_list {
    background: #ededed;
  }

  .webix_list_item {
    background: var(--color-background-common);
    margin: 3px 4px 0px 4px;
    border: 1px solid var(--color-border-common);
    box-sizing: border-box;
  }

  .webix_list_item.webix_selected {
    border-bottom-color: var(--color-border-common);
    background-color: var(--color-item);
    color: var(--color-view-text);
  }

  .dbllist_button {
    width: 45%;
    height: 30px;
    margin-top: 4px;
    padding: 0;
    border-radius: 2px;
    border: 1px solid var(--color-border-common);
    cursor: pointer;
    font-size: 12px;
    font-family: Roboto, sans-serif;
    background-color: var(--color-item);

    .webix_icon {
      color: var(--color-border-2);
      font-size: 20px;
      width: 26px;
    }

    &:first-child {
      margin-top: 28px;
      margin-right: 4px;
    }

    &:last-child {
      margin-left: 4px;
    }

    &:hover {
      background-color: var(--color-item-focus);
    }

    &:focus {
      background-color: var(--color-item-focus);
    }

    &:active {
      background-color: var(--color-item-focus);
    }
  }
}

.dbllist_buttons .webix_template {
  padding: 0 0 0 4px;
}

.webix_sparklines {
  padding: 1px 0;
  box-sizing: border-box;

  svg {
    box-sizing: border-box;
  }
}

.webix_sparklines_line {
  stroke: #3498db;
  stroke-width: 1;
  fill: transparent;
  stroke-linecap: round;
}

.webix_sparklines_item {
  fill: #3498db;
  stroke-width: 1;
}

.webix_sparklines_bar {
  fill: #6dbcf0;
}

.webix_sparklines_bar_negative {
  fill: #d86c79;
}

.webix_sparklines_area {
  fill: #e5eef4;
  opacity: 0.5;
}

.webix_sparklines_origin {
  stroke: #888;
  stroke-width: 1;
  fill: transparent;
}

.webix_sparklines_event_area {
  fill: transparent;
}

.webix_sparklines_donut_hole {
  fill: var(--color-background-common);
}

.webix_sparklines_line_chart .webix_sparklines_event_area:hover {
  fill: rgba(220, 220, 220, 0.4);
  stroke: rgba(255, 255, 255, 0.6);
}

.webix_sparklines_area_chart .webix_sparklines_event_area:hover {
  fill: rgba(220, 220, 220, 0.4);
  stroke: rgba(255, 255, 255, 0.6);
}

.webix_sparklines_splinearea_chart .webix_sparklines_event_area:hover {
  fill: rgba(220, 220, 220, 0.4);
  stroke: rgba(255, 255, 255, 0.6);
}

.webix_sparklines_radar_chart .webix_sparklines_event_area:hover {
  fill: rgba(220, 220, 220, 0.4);
  stroke: rgba(255, 255, 255, 0.6);
}

.webix_sparklines_pie_chart .webix_sparklines_event_area:hover {
  fill: rgba(255, 255, 255, 0.3);
}

.webix_sparklines_bar_chart .webix_sparklines_event_area:hover {
  fill: rgba(255, 255, 255, 0.3);
}

.webix_ui_print {
  display: none;
}

.webix_print_pdf {
  display: none;
}

body.webix_print {
  margin-top: 0px;
}

@media print {
  body.webix_print {
    overflow: visible !important;
    background-color: none !important;

    > * {
      display: none;
    }

    * {
      visibility: hidden;
    }
  }

  .webix_ui_print {
    display: block !important;
    margin: 0 0 0 0!important;
    visibility: visible !important;

    * {
      visibility: visible !important;
    }
  }

  .webix_print_noscroll {
    height: auto !important;
    width: auto !important;
    overflow: visible !important;

    .webix_scroll_cont {
      overflow: visible !important;
    }
  }

  .webix_print_pagebreak {
    page-break-after: always;
  }

  .webix_print_header {
    display: block !important;
    padding: 20px 0px;
    text-align: center;
    height: auto !important;
    visibility: visible !important;

    * {
      visibility: visible !important;
    }
  }

  .webix_print_footer {
    display: block !important;
    padding: 20px 0px;
    text-align: center;
    height: auto !important;
    visibility: visible !important;

    * {
      visibility: visible !important;
    }
  }

  .webix_table_print {
    display: table;
    visibility: visible !important;
    table-layout: fixed;
    width: 100%;
    border: 1px solid #ebebeb;
    margin-bottom: 20px;
    position: initial;

    td {
      overflow: hidden;
    }

    tr {
      page-break-inside: avoid;
    }

    .webix_print_top_split .webix_cell {
      border-bottom: 1px solid #d2d2d2;
    }

    .webix_cell {
      display: table-cell !important;
      border-right: 1px solid #ebebeb;
      border-bottom: 1px solid #ebebeb;
      padding: 0px 10px;
      white-space: nowrap;
    }

    .webix_header_cell {
      display: table-cell;
      font-family: Roboto, sans-serif;
      font-size: 12px;
      font-weight: 500;
      color: #313131;
      letter-spacing: 0;
      background: var(--color-item);
      border-right: 1px solid var(--color-border-common);
      border-bottom: 1px solid var(--color-border-common);
    }

    .webix_footer_cell {
      display: table-cell;
      background: #fafafa;
      border-right: 1px solid #EDEFF0;
      border-top: 1px solid #EDEFF0;
      border-bottom: 1px solid #EDEFF0;
    }

    .webix_cell.webix_dtable_span {
      position: initial !important;
      white-space: normal;
    }

    .webix_rotate {
      transform-origin: center 40% !important;
    }
  }

  .webix_table_print.borderless {
    border: none;

    .webix_cell {
      border: none;
    }
  }

  .webix_table_print.webix_view.webix_list-x {
    white-space: normal;

    .webix_list_item {
      display: table-cell;
    }
  }
}

.webix_fullscreen_html .webix_template > * {
  width: 100% !important;
  height: 100% !important;
  margin: 0px !important;
}

.webix_icon {
  display: inline-block;
  font-family: "Webix Material Icons";
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
  font-size: 17px;
  width: 20px;
  text-align: center;
}

.webix_icon_btn {
  display: inline-block;
  font-family: "Webix Material Icons";
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
  font-size: 20px;
  text-align: center;
  width: 20px;
  margin-right: 4px;
  color: var(--color-title-text);
  vertical-align: text-bottom;
}

.webix_input_icon {
  display: inline-block;
  font-family: "Webix Material Icons";
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
  font-size: 20px;
  width: 20px;
  float: right;
  color: var(--color-title-text);
  box-sizing: content-box;
}

.webix_icon_button {
  background-color: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  vertical-align: middle;
  position: relative;
  z-index: 0;

  .webix_icon {
    font-size: 20px;
    height: 20px;
    width: 20px;
    display: inline-block;
    text-align: center;
    color: var(--color-title-text);
  }

  &:before {
    content: '';
    opacity: 0;
    position: absolute;
    transition-duration: 0.15s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    z-index: -1;
    bottom: 0px;
    left: 0px;
    right: 0px;
    top: 0px;
    border-radius: 50%;
    transform: scale(0);
    transition-property: transform, opacity;
  }

  &:hover {
    .webix_icon {
      color: var(--color-view-text);
    }

    &:before {
      background-color: var(--color-item);
      opacity: 1;
      transform: scale(1);
    }
  }

  &:focus .webix_icon {
    color: var(--color-view-text);
  }
}

.webix_el_icon .webix_el_box {
  padding: 0;
  margin: 0 auto;
  text-align: center;
  position: relative;
  overflow: visible;
  cursor: pointer;
}

.webix_badge {
  background-color: #ff8839;
  color: var(--color-background-common);
  border-radius: 11px;
  font-size: 12px;
  height: 22px;
  min-width: 22px;
  padding: 0 4px;
  text-align: center;
  line-height: 22px;
  position: absolute;
  right: 0;
  top: 0;
  box-sizing: border-box;
}

.webix_badge.webix_measure_size {
  right: auto;
  box-sizing: border-box;
}

@font-face {
  font-family: "Webix Material Icons";
  src: url('/css/fonts/webixmdi-webfont.woff2') format('woff2'), url('/css/fonts/webixmdi-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

.mainFont {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--color-view-text);
  letter-spacing: 0.2px;
}

.buttonFont {
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-border-2);
  letter-spacing: 0px;
}

.selectFocusRule {
  background: #edeff5;
}

.layoutBarBG .webix_el_label .webix_el_box {
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-view-text);
  letter-spacing: 0px;
}

.layoutBarBG.webix_dark {
  background: var(--color-background-accent);
  border-color: var(--color-background-accent);

  .webix_el_button {
    color: var(--color-background-common);
  }

  .webix_el_label .webix_el_box {
    color: var(--color-background-common);
  }

  .webix_inp_label {
    color: var(--color-background-common);
  }

  .webix_inp_top_label {
    color: var(--color-background-common);
  }

  .webix_slider_title {
    color: var(--color-background-common);
  }

  .webix_secondary {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      background-color: rgba(0, 0, 0, 0.2);
      color: var(--color-background-common);
      border-color: transparent;

      &:hover {
        color: var(--color-background-common);
        background-color: rgba(0, 0, 0, 0.4);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.4);
        color: var(--color-background-common);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.5);
        color: var(--color-background-common);
      }
    }
  }

  .webix_transparent {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      color: var(--color-background-common);

      &:hover {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.4);
      }
    }
  }

  .webix_inp_counter_next {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_inp_counter_prev {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_0 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_1 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_N {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_menu-x .webix_list_item {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_view > .webix_template {
    color: var(--color-background-common);
    background-color: var(--color-background-accent);
  }

  .webix_inp_static {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    input[type=text] {
      background-color: transparent;
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=text] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=combo] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=datepicker] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  textarea {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  select {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    option {
      background-color: var(--color-background-accent);
      color: var(--color-background-common);
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  .webix_text_highlight {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_el_texthighlight {
    input {
      caret-color: rgba(255, 255, 255, 0.7);
    }

    textarea {
      caret-color: rgba(255, 255, 255, 0.7);
    }
  }

  .webix_multicombo_value {
    color: var(--color-background-accent);
  }

  .webix_multicombo_tag {
    color: var(--color-background-accent);
  }

  .webix_el_counter {
    button {
      background-color: rgba(0, 0, 0, 0.3);
    }

    input[type=text]:focus {
      border-color: transparent;
    }
  }

  .webix_placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  ::placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_input_icon {
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_selected.webix_segment_0 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_1 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_N {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_img_btn_top {
    border-width: 0;

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon {
      color: var(--color-background-common);
    }
  }

  .webix_el_icon {
    color: var(--color-background-common);
  }

  .webix_img_btn {
    color: var(--color-background-common);
    border-width: 0;
  }

  .webix_icon_btn {
    color: var(--color-background-common);
  }

  .webix_icon_button {
    color: var(--color-background-common);

    &:hover {
      &:before {
        background-color: rgba(0, 0, 0, 0.2);
      }

      .webix_icon {
        opacity: 1;
      }
    }

    &:focus .webix_icon {
      opacity: 1;
    }

    .webix_icon {
      color: var(--color-background-common);
      opacity: 0.7;
    }
  }

  .webix_control {
    border-color: var(--color-border-2);
  }

  .webix_custom_checkbox {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_custom_radio {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_label_right {
    color: var(--color-background-common);
  }

  .webix_view.webix_control .webix_disabled_box {
    .webix_button {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    label {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_input_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    button {
      color: rgba(255, 255, 255, 0.4);
    }

    input {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    select {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    textarea {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_static {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;

      input {
        background-color: transparent;
      }
    }

    .webix_inp_counter_prev {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_counter_next {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_segment_0 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_N {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_item_tab {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_1.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_N.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }
  }

  .webix_disabled_view.webix_control {
    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_view.webix_menu-x .webix_list_item.menu {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_toolbar .webix_disabled_view.webix_control {
    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_top_label {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_invalid {
    .webix_el_box {
      input {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      .webix_inp_static {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;

        input {
          background-color: transparent;
        }
      }

      select {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      textarea {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }
    }

    .webix_multicombo_value {
      color: #FF5C4C;
    }

    .webix_multicombo_tag {
      color: #FF5C4C;
    }
  }

  input.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  select.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  textarea.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }
}

.webix_toolbar.webix_dark {
  background: var(--color-background-accent);
  border-color: var(--color-background-accent);

  .webix_el_button {
    color: var(--color-background-common);
  }

  .webix_el_label .webix_el_box {
    color: var(--color-background-common);
  }

  .webix_inp_label {
    color: var(--color-background-common);
  }

  .webix_inp_top_label {
    color: var(--color-background-common);
  }

  .webix_slider_title {
    color: var(--color-background-common);
  }

  .webix_secondary {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      background-color: rgba(0, 0, 0, 0.2);
      color: var(--color-background-common);
      border-color: transparent;

      &:hover {
        color: var(--color-background-common);
        background-color: rgba(0, 0, 0, 0.4);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.4);
        color: var(--color-background-common);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.5);
        color: var(--color-background-common);
      }
    }
  }

  .webix_transparent {
    .webix_icon {
      color: var(--color-background-common);
    }

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon_btn {
      color: var(--color-background-common);
    }

    button {
      color: var(--color-background-common);

      &:hover {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:focus {
        background-color: rgba(0, 0, 0, 0.2);
      }

      &:active {
        background-color: rgba(0, 0, 0, 0.4);
      }
    }
  }

  .webix_inp_counter_next {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_inp_counter_prev {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_0 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_1 {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_segment_N {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_menu-x .webix_list_item {
    background-color: rgba(0, 0, 0, 0.2);
    color: var(--color-background-common);
    border-color: transparent;

    &:hover {
      color: var(--color-background-common);
      background-color: rgba(0, 0, 0, 0.4);
    }

    &:focus {
      background-color: rgba(0, 0, 0, 0.4);
      color: var(--color-background-common);
    }

    &:active {
      background-color: rgba(0, 0, 0, 0.5);
      color: var(--color-background-common);
    }
  }

  .webix_view > .webix_template {
    color: var(--color-background-common);
    background-color: var(--color-background-accent);
  }

  .webix_inp_static {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    input[type=text] {
      background-color: transparent;
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=text] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=combo] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  input[type=datepicker] {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  textarea {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  select {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);

    option {
      background-color: var(--color-background-accent);
      color: var(--color-background-common);
    }

    &:focus {
      border-color: var(--color-background-common);
      box-shadow: none;
    }
  }

  .webix_text_highlight {
    border-color: transparent;
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_el_texthighlight {
    input {
      caret-color: rgba(255, 255, 255, 0.7);
    }

    textarea {
      caret-color: rgba(255, 255, 255, 0.7);
    }
  }

  .webix_multicombo_value {
    color: var(--color-background-accent);
  }

  .webix_multicombo_tag {
    color: var(--color-background-accent);
  }

  .webix_el_counter {
    button {
      background-color: rgba(0, 0, 0, 0.3);
    }

    input[type=text]:focus {
      border-color: transparent;
    }
  }

  .webix_placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  ::placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_input_icon {
    color: rgba(255, 255, 255, 0.7);
  }

  .webix_selected.webix_segment_0 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_1 {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_selected.webix_segment_N {
    background: var(--color-border-2);
    color: var(--color-background-common);

    &:hover {
      background-color: var(--color-item-selected);
    }

    &:focus {
      background-color: var(--color-item-selected);
    }

    &:active {
      background-color: var(--color-item-active-selected);
    }
  }

  .webix_img_btn_top {
    border-width: 0;

    .webix_img_btn_text {
      color: var(--color-background-common);
    }

    .webix_icon {
      color: var(--color-background-common);
    }
  }

  .webix_el_icon {
    color: var(--color-background-common);
  }

  .webix_img_btn {
    color: var(--color-background-common);
    border-width: 0;
  }

  .webix_icon_btn {
    color: var(--color-background-common);
  }

  .webix_icon_button {
    color: var(--color-background-common);

    &:hover {
      &:before {
        background-color: rgba(0, 0, 0, 0.2);
      }

      .webix_icon {
        opacity: 1;
      }
    }

    &:focus .webix_icon {
      opacity: 1;
    }

    .webix_icon {
      color: var(--color-background-common);
      opacity: 0.7;
    }
  }

  .webix_control {
    border-color: var(--color-border-2);
  }

  .webix_custom_checkbox {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_custom_radio {
    color: var(--color-background-common);

    &:focus {
      color: #f0f0f0;
    }
  }

  .webix_label_right {
    color: var(--color-background-common);
  }

  .webix_view.webix_control .webix_disabled_box {
    .webix_button {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    label {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_input_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    button {
      color: rgba(255, 255, 255, 0.4);
    }

    input {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    select {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    textarea {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_static {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;

      input {
        background-color: transparent;
      }
    }

    .webix_inp_counter_prev {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_inp_counter_next {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      border-color: transparent;
    }

    .webix_segment_0 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_1 {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_N {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_item_tab {
      color: rgba(255, 255, 255, 0.4);
      background-color: rgba(0, 0, 0, 0.1);
      text-shadow: none;
    }

    .webix_segment_0.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_1.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }

    .webix_segment_N.webix_selected {
      background-color: rgba(0, 0, 0, 0.15);
    }
  }

  .webix_disabled_view.webix_control {
    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_view.webix_menu-x .webix_list_item.menu {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_toolbar .webix_disabled_view.webix_control {
    .webix_icon {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_disabled_box .webix_img_btn_text {
      color: rgba(255, 255, 255, 0.4);
    }

    .webix_icon_btn {
      color: rgba(255, 255, 255, 0.4);
    }
  }

  .webix_disabled_top_label {
    color: rgba(255, 255, 255, 0.4);
  }

  .webix_invalid {
    .webix_el_box {
      input {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      .webix_inp_static {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;

        input {
          background-color: transparent;
        }
      }

      select {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }

      textarea {
        color: #ffdedb;
        background-color: rgba(255, 92, 76, 0.3);
        border-color: #ff8d82;
      }
    }

    .webix_multicombo_value {
      color: #FF5C4C;
    }

    .webix_multicombo_tag {
      color: #FF5C4C;
    }
  }

  input.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  select.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }

  textarea.webix_invalid {
    color: #ffdedb;
    background-color: rgba(255, 92, 76, 0.3);
    border-color: #ff8d82;
  }
}

.webix_view.webix_layout_accordion {
  background-color: var(--color-background-2);
}

.webix_accordionitem {
  .webix_accordionitem_button {
    float: right;
    position: relative;
    height: 19px;
    width: 19px;
    margin: 9.5px 9px;
  }

  .webix_accordionitem_header {
    line-height: 36px;

    &:hover {
      background-color: #fafafa;
    }

    &:focus {
      background-color: #fafafa;
    }

    .webix_accordionitem_button {
      color: var(--color-title-text);
      background-image: none;
      font-family: "Webix Material Icons";
      font-size: 24px;
      text-align: center;
      width: 24px;
      height: 35px;
      margin: 0 6px 0 6px;

      &:before {
        content: '\F002';
      }
    }

    .webix_accordionitem_label .webix_icon {
      color: var(--color-title-text);
    }
  }

  .webix_accordionitem_header.collapsed .webix_accordionitem_button:before {
    content: '\F004';
  }
}

.webix_accordionitem.collapsed {
  background-color: var(--color-item);

  .webix_accordionitem_button {
    float: right;
    position: relative;
    margin-top: 8.5px;
  }

  .webix_accordionitem_header {
    background-color: var(--color-item);
    color: var(--color-border-2);

    .webix_accordionitem_button {
      color: var(--color-border-2);
    }

    .webix_accordionitem_label .webix_icon {
      color: var(--color-border-2);
    }

    &:hover {
      background-color: #edeff5;
    }

    &:focus {
      background-color: #edeff5;
    }
  }
}

.webix_accordionitem.horizontal.collapsed {
  background-color: var(--color-item);

  .webix_accordionitem_header {
    background-color: var(--color-item);
    color: var(--color-border-2);

    .webix_accordionitem_button {
      color: var(--color-border-2);
    }

    .webix_accordionitem_label .webix_icon {
      color: var(--color-border-2);
    }

    &:hover {
      background-color: #edeff5;
    }

    &:focus {
      background-color: #edeff5;
    }
  }

  &:last-child > .webix_accordionitem_header .webix_accordionitem_button:before {
    content: '\F001';
  }
}

.webix_layout_accordion.webix_dark {
  .webix_accordionitem_header {
    background-color: var(--color-background-accent);
    color: var(--color-background-common);

    .webix_accordionitem_button {
      color: var(--color-background-common);
    }

    &:hover {
      background-color: #61707e;
    }

    &:focus {
      background-color: #61707e;
    }
  }

  .webix_accordionitem_header.collapsed {
    background-color: var(--color-item);
    color: var(--color-border-2);

    .webix_accordionitem_button {
      color: var(--color-border-2);
    }
  }

  .webix_accordionitem.horizontal.collapsed .webix_accordionitem_header {
    &:hover {
      background-color: #edeff5;
    }

    &:focus {
      background-color: #edeff5;
    }
  }

  .webix_accordionitem.collapsed .webix_accordionitem_header {
    &:hover {
      background-color: #edeff5;
    }

    &:focus {
      background-color: #edeff5;
    }
  }
}

.webix_accordionitem.horizontal:last-child > .webix_accordionitem_header .webix_accordionitem_button:before {
  content: '\F003';
}

.webix_accordionitem.vertical {
  > .webix_accordionitem_header .webix_accordionitem_button {
    height: 35px;
    margin: 0px 6px 0 6px;

    &:before {
      content: '\F004';
    }
  }

  > .webix_accordionitem_header.collapsed .webix_accordionitem_button:before {
    content: '\F001';
  }
}

.dataHeaderFont {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0;
}

.webix_dtable.webix_header_border .webix_ss_header {
  .webix_hcolumn > div {
    border-right-color: var(--color-border-common);
    border-bottom-color: var(--color-border-common);
  }

  .webix_span {
    border-right-color: var(--color-border-common);
    border-bottom-color: var(--color-border-common);
  }
}

.webix_dtable.webix_footer_border .webix_ss_footer {
  .webix_hcolumn > div {
    border-right-color: var(--color-border-common);
    border-top-color: var(--color-border-common);
  }

  .webix_span {
    border-right-color: var(--color-border-common);
    border-top-color: var(--color-border-common);
  }
}

.webix_dtable.webix_data_border {
  .webix_ss_body .webix_column > div {
    border-right-color: #EDEFF0;
  }

  .webix_table_cell {
    border-right-color: #EDEFF0;
  }
}

.dtBodyCell {
  border-bottom: 1px solid #EDEFF0;
}

.dataItemStyle {
  border-color: #EDEFF0;
}

.webix_list_item.webix_group_back {
  color: #313131;
  background: var(--color-item);
  border-bottom: 1px solid var(--color-border-common);
}

.webix_dataview_item.tiles.webix_selected {
  border-color: #5ccce7;
}

.webix_view.webix_menu .webix_list_item .webix_submenu_icon {
  font-size: 14px;
  font-family: "Webix Material Icons";
  width: 6px;
  top: 0;
  margin-left: 0;
}

.webix_view.webix_popup.webix_menu {
  border: none;
}

.webix_menu.webix_view {
  .webix_list_item {
    &:hover {
      background-color: #edeff5;
    }

    &:active {
      background-color: #edeff5;
    }

    .webix_submenu_icon:before {
      content: '\F003';
    }
  }

  .webix_list_item.webix_selected {
    background: var(--color-item);
  }

  .webix_list_item.webix_disabled {
    background-color: var(--color-background-common);
  }

  .webix_icon {
    color: var(--color-title-text);
  }
}

.webix_property .webix_property_label_line {
  background-color: var(--color-item);
}

.focusStyle {
  border: 1px solid var(--color-border-2);
}

.webix_focused .webix_inp_static {
  border: 1px solid var(--color-border-2);
}

.webix_checksuggest_select_all.webix_el_checkbox .webix_label_right {
  padding-top: 5px;
}

.buttonStyle {
  font-family: Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-border-2);
  letter-spacing: 0px;
  outline: none;
}

div.webix_inp_static {
  background: var(--color-background-common);
  font-family: Roboto, sans-serif;
  border-color: #CCD7E6;
}

.webix_el_counter {
  .webix_inp_counter_value {
    width: 42px;
    background: var(--color-background-common);
    font-family: Roboto, sans-serif;
    border-color: #CCD7E6;
  }

  .webix_inp_counter_prev {
    background: var(--color-item);
    width: 30px;
    border: 1px solid #CCD7E6;
    font-weight: bold;
    font-family: "Courier New", Courier, monospace;
    font-size: 20px;
    border-right: none;
  }

  .webix_inp_counter_next {
    background: var(--color-item);
    width: 30px;
    border: 1px solid #CCD7E6;
    font-weight: bold;
    font-family: "Courier New", Courier, monospace;
    font-size: 20px;
    border-left: none;
  }
}

.webix_view.webix_control.webix_el_tabbar {
  background: var(--color-background-common);
}

.passiveBarBG {
  background: var(--color-background-common);
  color: var(--color-border-2);
}

.webix_selected.webix_segment_0 {
  &:hover {
    background-color: var(--color-item-selected);
  }

  &:focus {
    background-color: var(--color-item-selected);
  }

  &:active {
    background-color: var(--color-item-active-selected);
  }
}

.webix_selected.webix_segment_1 {
  &:hover {
    background-color: var(--color-item-selected);
  }

  &:focus {
    background-color: var(--color-item-selected);
  }

  &:active {
    background-color: var(--color-item-active-selected);
  }
}

.webix_selected.webix_segment_N {
  &:hover {
    background-color: var(--color-item-selected);
  }

  &:focus {
    background-color: var(--color-item-selected);
  }

  &:active {
    background-color: var(--color-item-active-selected);
  }
}

.webix_checkbox_1 .webix_custom_checkbox {
  color: var(--color-border-2);

  &:before {
    content: "\F012";
  }
}

.webix_sidebar.webix_sidebar_left {
  .webix_tree_item.webix_sidebar_selected {
    box-shadow: inset 2px 0 var(--color-border-2);

    + .webix_tree_leaves .webix_tree_item {
      box-shadow: inset 2px 0 var(--color-border-2);
    }
  }

  .webix_tree_item.webix_selected {
    box-shadow: inset 2px 0 var(--color-border-2);
  }
}

.webix_sidebar.webix_sidebar_right {
  .webix_tree_item.webix_sidebar_selected {
    box-shadow: inset -2px 0 var(--color-border-2);

    + .webix_tree_leaves .webix_tree_item {
      box-shadow: inset -2px 0 var(--color-border-2);
    }
  }

  .webix_tree_item.webix_selected {
    box-shadow: inset -2px 0 var(--color-border-2);
  }
}

.webix_sidebar.webix_sidebar_expanded .webix_tree_item.webix_sidebar_selected {
  background-color: transparent;

  &:hover {
    background-color: #edeff5;
  }
}

.webix_sidebar_popup_left {
  .webix_list_item.webix_selected {
    box-shadow: inset 2px 0 var(--color-border-2);
  }

  .webix_list_item.webix_sidebar_selected {
    box-shadow: inset 2px 0 var(--color-border-2);
  }
}

.webix_sidebar_popup.webix_sidebar_popup_left {
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 7px 0 rgba(0, 0, 0, 0.1);
}

.webix_sidebar_popup.webix_sidebar_popup_right {
  box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 7px 0 rgba(0, 0, 0, 0.1);

  .webix_sidebar_popup_right {
    box-shadow: none;
  }
}

.webix_sidebar.webix_dark {
  border-color: #373a42;
  background-color: #4A4E58;

  .webix_tree_item {
    color: var(--color-background-common);

    &:hover {
      background-color: #33353c;
    }
  }

  .webix_tree_item.webix_selected {
    color: var(--color-border-2);
    background-color: #373a42;
  }

  .webix_tree_item.webix_sidebar_selected {
    color: var(--color-border-2);
    background-color: #373a42;
  }
}

.webix_sidebar.webix_dark.webix_sidebar_expanded .webix_tree_item.webix_sidebar_selected {
  background-color: transparent;

  &:hover {
    background-color: #33353c;
  }
}

.webix_sidebar_popup.webix_dark {
  border-color: #373a42;

  .webix_sidebar_popup_title {
    background-color: #373a42;

    .webix_template {
      border-color: #373a42;
      color: var(--color-background-common);
    }
  }

  .webix_sidebar_popup_title.webix_selected .webix_template {
    color: var(--color-border-2);
  }
}

.webix_sidebar_popup_list.webix_dark {
  background-color: #4A4E58;
  border-color: #4A4E58;

  .webix_list_item {
    background: #4A4E58;
    color: var(--color-background-common);
    border-color: #373a42;

    &:hover {
      background-color: #33353c;
    }
  }

  .webix_list_item.webix_selected {
    background-color: #373a42;
    color: var(--color-border-2);
  }

  .webix_list_item.webix_sidebar_selected {
    background-color: #373a42;
    color: var(--color-border-2);

    &:hover {
      background-color: #373a42 !important;
    }
  }
}

.webix_list_item.webix_selected.webix_disabled {
  box-shadow: inset 2px 0 var(--color-title-text);
}

.webixlabel {
  font-weight: 500;
}

legend.webix_forminput_label {
  font-family: Roboto, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #313131;
  letter-spacing: 0.2px;
}

.invalidStyle {
  color: #FF5C4C;
  background-color: #ffdedb;
}

.webix_timeline_point {
  r: 4;
}

.webix_skin_mark {
  height: 240px;
}

.wxi-angle-down:before {
  content: "\F001";
}

.wxi-angle-left:before {
  content: "\F002";
}

.wxi-angle-right:before {
  content: "\F003";
}

.wxi-angle-up:before {
  content: "\F004";
}

.wxi-angle-double-right:before {
  content: "\F005";
}

.wxi-angle-double-left:before {
  content: "\F006";
}

.wxi-clock:before {
  content: "\F007";
}

.wxi-calendar:before {
  content: "\F008";
}

.wxi-search:before {
  content: "\F009";
}

.wxi-dots:before {
  content: "\F010";
}

.wxi-close:before {
  content: "\F011";
}

.wxi-checkbox-marked:before {
  content: "\F012";
}

.wxi-checkbox-blank:before {
  content: "\F013";
}

.wxi-trash:before {
  content: "\F014";
}

.wxi-pencil:before {
  content: "\F015";
}

.wxi-eye:before {
  content: "\F016";
}

.wxi-eye-slash:before {
  content: "\F017";
}

.wxi-columns:before {
  content: "\F018";
}

.wxi-drag:before {
  content: "\F019";
}

.wxi-check:before {
  content: "\F020";
}

.wxi-underline:before {
  content: "\F021";
}

.wxi-bold:before {
  content: "\F022";
}

.wxi-italic:before {
  content: "\F023";
}

.wxi-sync:before {
  content: "\F024";
}

.wxi-plus-square:before {
  content: "\F025";
}

.wxi-minus-square:before {
  content: "\F026";
}

.wxi-menu-down:before {
  content: "\F027";
}

.wxi-menu-right:before {
  content: "\F028";
}

.wxi-menu-left:before {
  content: "\F029";
}

.wxi-folder:before {
  content: "\F030";
}

.wxi-folder-open:before {
  content: "\F031";
}

.wxi-file:before {
  content: "\F032";
}

.wxi-close-circle:before {
  content: "\F033";
}

.wxi-alert:before {
  content: "\F034";
}

.wxi-radiobox-blank:before {
  content: "\F035";
}

.wxi-radiobox-marked:before {
  content: "\F036";
}

.wxi-angle-double-down:before {
  content: "\F037";
}

.wxi-angle-double-up:before {
  content: "\F038";
}

.wxi-plus-circle:before {
  content: "\F039";
}

.wxi-minus-circle:before {
  content: "\F040";
}

.wxi-plus:before {
  content: "\F041";
}

.wxi-minus:before {
  content: "\F042";
}

.wxi-download:before {
  content: "\F043";
}

.wxi-user:before {
  content: "\F044";
}

.wxi-filter:before {
  content: "\F045";
}

.wxi-menu-up:before {
  content: "\F046";
}

.webix_strong {
  font-weight: 500;
  white-space: nowrap;
}

.webix_light {
  color: #b3b3b3;
}

.webix_view.webix_el_label {
  box-sizing: border-box;
}

.webix_spin {
  animation: webix_spin 2s infinite linear;
}

@-webkit-keyframes webix_spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(359deg);
  }
}

@keyframes webix_spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(359deg);
  }
}