div#easy_gantt.easy{
  a{

  }
  #easy_gantt_menu{
    //overflow: hidden;
    padding-bottom: $gap - 3;
    p{
      margin-bottom: 0;
    }
  }
  #gantt_footer_buttons{
    float: left;
    margin-top: $gap;
    &+p{
      float: right;
      margin-top: $gap;
    }
  }
  .button.active{
    @extend %button-main;
  }
}
#button_jump_today{
  padding-right: 0;
}

.easy-gantt{
  &__menu{
    @extend %box-sizing-border-box !optional;
    //@extend %material__elevation--inline !optional;
    @extend %flex !optional;
    @extend %flex-wrap-wrap !optional;
    @extend %justify-content-space-between !optional;
    user-select: none;
    position: relative;
    z-index: 1;
    background-color: $color-foreground;
    padding: $box-padding;
    margin: 0 (-$box-padding);
    &:after{
      display: none;
    }
    &-item {
      display: inline-block;
      text-align: left;
      .active{
        color: $color-negative !important;
        background: none !important;
        border: none !important;
        &:before{
          color: $color-negative;
        }
      }
    }
    &-group{
      ul{
        margin: 0;
      }
      &--tooltiped{
        @extend %menu-tooltip !optional;
        & > ul{
          display: none;
          right: 0;
        }
        &:hover{
          & > ul{
            display: block;
          }
        }
      }
    }
    .problem-finder{
      @include small;
      color: $color-text;
      &.active{
        background: none;
        border: none;
        color: $color-text;
      }
      &:hover{text-decoration: none;}
    }
    .gantt-menu-problems-list{
      @extend %material__elevation--depth_2;
      border-width: 1px !important;
    }
    .gantt-menu-problems-count.gantt-with-problems{
      @extend %border-radius-infinite;
      font-weight: bold;
      background: $color-negative;
      border: 1px solid darken($color-negative,5%);
      text-align: center;
      width: 1.5*$gap;
      line-height: 1.5*$gap;
      display: inline-block;
      color: white;
      padding: .25*$gap;
      margin-right: $gap;

    }
  }
}

.gantt-menu-sub-panel{
  width: 100%;
  & > span{
    display: none !important;
  }
}
#button_problem_finder.active{
  color: $color-negative !important;
  background: none !important;
  border: none !important;
}

.gantt-menu-problems-reason {
  color: $color-negative !important;
}

.gantt-grid-milestone-bullet{
  margin-top: $gap !important;
  width: $gap !important;
  height: $gap !important;
  background: $color-text !important;
  border: none !important;
  .gantt-milestone-shared &{
    background: $color-important !important;
  }
}
.gantt_subtask_arrow:before{
  opacity: .75;
}
.gantt_cell + .gantt_cell, .gantt_side_content{
 color: $color-text !important;
}

.gantt_grid .gantt_grid_head_cell, .gantt_grid_scale, #gantt_grid, .gantt_scale_cel, .gantt_task_scale{
  border-color: $color-border-minor !important;
}
.gantt_grid{
  @extend %material__elevation--depth_2;
  border-right-width: 1px !important;
}
.gantt{
  &_grid_data &_row{
    &, &.odd{
      &:hover{
        background: rgba($color-negative, .25);
      }
    }
  }
}

.gantt_task_scale, .gantt_grid_scale{
  @extend %material__elevation--depth_1;
  z-index: 2 !important;
  margin-top: -1px;
}
#gantt_cont{
  width: auto !important;
  margin: 0 (-$box-padding - 1);
}
.gantt_tree{
  &_indent{
    width: $box-padding !important;
  }
  &_icon{
    width: $box-padding !important;
    text-align: center;
  }
}
div.gantt_task_progress{
  position: relative;
  z-index: 1 !important;
}

div.gantt_task_line{
  &.gantt_parent_task-subtype{
    .gantt_task_progress, .gantt_task_content{
      height: 100%;
    }
  }
  .gantt_task_content,
  .gantt_task_ticks{
    background-color: rgba($color-positive, .1);
    border-color: rgba($color-positive, 1);
  }
  .gantt_task_progress{
    background-color: rgba($color-positive, .5);
  }
  &.wrong{
    .gantt_task_ticks,
    .gantt_task_content {
      background-color: rgba($color-negative, .1);
      border-color: rgba($color-negative, 1);
    }
    .gantt_task_progress{
      background-color: rgba($color-negative, .5);
    }
  }
  &.critical{
    $color-critical: mix($color-main, $color-negative);
    .gantt_task_ticks,
    .gantt_task_content {
      background-color: rgba($color-critical, .1);
      border-color: rgba($color-critical, 1);
    }
    .gantt_task_progress{
      background-color: rgba($color-critical, .5);
    }
  }
  &.closed{
    .gantt_task_ticks,
    .gantt_task_content {
      background-color: rgba($color-service-text, .25) !important;
      border-color: rgba($color-service-text, 1) !important;
    }
    .gantt_task_progress{
      background-color: rgba($color-service-text, .5) !important;
    }
  }
  &.gantt_project-type{
    .gantt_task_content{
      background-color: rgba($color-main, .25) !important;
      border-color: rgba($color-main, 1) !important;
    }
    div.gantt_task_progress{
      &.gantt-project-overdue{
        background-color: rgba($color-main, .5) !important;
      }
    }
  }
  &.gantt_milestone-type{
    .gantt_task_content{
      @include transform( #{scale(.35) rotate(45deg)});
      background-color: rgba($color-text, 1) !important;
      border-color: rgba($color-text, 1) !important;
    }
  }
}
.gantt-relation-simple > .gantt_line_wrapper div, .gantt-relation-simple > .gantt_link_arrow {
  border-color: rgba($color-text, 1) !important;
}
.gantt-relation-simple:hover > .gantt_line_wrapper div {
  box-shadow: 0 0 5px 0 rgba($color-text, 1) !important;
}