//kanban start
.kanban_data {
  img.mat-list-avatar {
    width: 30px !important;
    height: 30px !important;
  }
}

.kanban_data {
  .mat-list-text {
    padding-left: 6px !important;
  }
}

.kanban_data {
  .mat-list {
    .mat-list-item.mat-3-line {
      height: 60px !important;
      margin: 0 0 7px 0;
    }
  }
}

.kanban_data {
  .mat-list {
    .mat-list-item.mat-3-line:last-child {
      margin: 0 0 0px 0;
    }
  }
}

.kanban_data {
  .mat-list {
    .mat-list-item-content {
      background: #ffffff;
      border-left: solid 3px $primary-color;
      box-shadow: 1px 1px 2px #b1b1b1;
      border-radius: 3px;
    }
  }
}

.kanban_data {
  .mat-list {
    .mat-list-item-content:hover {
      background: $card-hover;
      transition: all 0.5s;
      border-left-color: $primary-color;
    }
  }
}

.kanban_data {
  .compact-list.mat-list {
    background: #fbfbfb;
    padding: 5px;
    height: 270px;
  }
}

.kanban_data {
  overflow: auto;
  height: calc(100vh - 208px);
  max-height: calc(100vh - 208px);
}

// .kanban-loader{
//   height: calc(100vh - 165px);
//   max-height: calc(100vh - 155px);
// }

.goal-replan {
  // float: right;
  margin: -15px 0 ;
}

.font_icon_add {
  .fa {
    float: right;
    margin: 0 0;
  }
}

.kanban_search {
  float: right;
  margin: -18px 10px 0 0;
}

.kanban_data {
  p {
    word-break: break-word;
    margin: 0;
    line-height: 20px;
  }
}

.details_userstory {
  min-height: 90vh;
  max-height: 90vh;
  overflow: auto;
  right: 0;
  box-shadow: none !important;
  
@media only screen and (max-width: 1366px) and (min-width: 1024px) {
  min-height: 88vh;
  max-height: 88vh; 
}
}

.adhoc-detail-summary .details_userstory {
  min-height: 71vh !important;
  max-height: 71vh !important; 
}

.addnewtask {
  max-width: 350px !important;
  min-width: 350px !important;
}

.add-newtask {
  cursor: pointer;
  color: $grey-iconColor;
}

.kanban-listIcon {
  fa-icon {
    font-size: 12px;
    cursor: pointer;
    float: right;
  }
}

.bug-priority-po {
  color: red;
}

.bug-priority-p1 {
  color: orange;
}

.bug-priority-p2 {
  color: skyblue;
}

.bug-priority-p3 {
  color: grey;
}

.kanban-listIcon fa-icon:hover {
  color: $primary-color;
}

.kanban-listItems {
  box-shadow: 0px 0px 2px 1px #d4d4d4;
  padding: 10px;
  margin: 0px 0 5px 0;
  cursor: pointer;
}

.kanban-listItems {
  img {
    width: 22px;
    height: 22px;
    border-radius: 50px;
    float: left;
  }
}

.font_icon_add {
  color: $userstory-status-text-color;
  font-weight: bold;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border:1px solid #e6e6e6;
}

.kanban-listItems {
  .mat-checkbox {
    label {
      margin: 0;
    }
  }
}

.kanban-listItems {
  &:hover {
    background: $grey-background;
  }
}

.kanban-load-title {
  background: $grey-color-background;
  border-bottom: 2px solid $kanban-border-bottomcolor;
}

.kanban-replantype {
  margin-top: -3px;
}



.kanban-loading-bg {
  background: $kanban-loading-color-primary;
  animation: kanbanLoad 2s;
  -moz-animation: kanbanLoad 2s infinite;
  /* Firefox */
  -webkit-animation: kanbanLoad 2s infinite;
  /* Safari and Chrome */
}

@-moz-keyframes kanbanLoad

/* Firefox */
  {
  0% {
    background: $kanban-loading-color-primary;
  }

  50% {
    background: $kanban-loading-color-secondary;
  }

  100% {
    background: $kanban-loading-color-primary;
  }
}

@-webkit-keyframes kanbanLoad

/* Firefox */
  {
  0% {
    background: $kanban-loading-color-primary;
  }

  50% {
    background: $kanban-loading-color-secondary;
  }

  100% {
    background: $kanban-loading-color-primary;
  }
}


.clear-filters a:hover {
  text-decoration: underline !important;
  color: blue !important;
}

.goals-selectusers {
  z-index: 9;
  padding: 0px;
  position: absolute !important;
  right: -13px;

  
  .project_member {
    float: left !important;
    margin: 0 0 0 5px !important;
  }
}
.superagile-select {
  .project_member {
    float: left !important;
  }
}

.select_users, .superagile-select {
  float: right;
  position: relative;
  z-index: 9;

  .project_member {
    float: right;
    margin: 0 0 0 -5px;
    border-radius: 50px;
    cursor: pointer;
  }

  .members_count {
    background: $grey-background;
    border-radius: 50px;
    border: solid 2px $white-color;
    text-align: center;
    float: right;
    width: 34px;
    height: 34px;
    padding: 6px 2px;
    position: relative;
    right: 9px;
    z-index: -1;
    cursor: pointer;
    font-size: 11px;
    transition: all 0.5s;

    &:hover {
      z-index: 0;
      transition: all 0.5s;
      border: solid 2px $primary-color;
    }

  }

  .countActive {
    z-index: 99;
    border: solid 2px $primary-color;
    transition: all 0.5s;
  }

  .projectmembers_list {
    width: 250px;
    position: absolute;
    right: 0;
    background: $white-color;
    max-height: 200px;
    z-index: 9;
    overflow: auto;
    box-shadow: 0px 2px 9px $grey-background;
    top: 35px;

    .single_projectmember {
      padding: 5px 10px;

      &:hover {
        background: $grey-background !important;
      }

      img {
        margin: 0;
      }

      p {
        margin: 5px 0 0 0;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis
      }

      .mat-checkbox {
        margin: 5px 0 0 0;
      }
    }
  }
}

.select_colours {
  position: absolute;
  right: 46px;
  z-index: 100;
}
.first_colour {
  float: right;
  border-radius: 50px;
  cursor: pointer;
}

 .colour_plus {
  background: $grey-background;
  border-radius: 50px;
  border: solid 2px $white-color;
  text-align: center;
  float: right;
  width: 34px;
  height: 34px;
  padding: 6px 2px;
  position: relative;
  right: 9px;
  z-index: -1;
  cursor: pointer;
  font-size: 11px;
  transition: all 0.5s;

  &:hover {
    z-index: 0;
    transition: all 0.5s;
    border: solid 2px $primary-color;
  }
}

.membershow {
  border: solid 2px $primary-color;
  border-radius: 50px;

  &:hover {
    transition: all 0.5s;
    position: relative;
    z-index: 99;
  }
}

.memberhide {
  border: solid 2px $white-color;
  border-radius: 50px;

  &:hover {
    transition: all 0.5s;
    position: relative;
    z-index: 99;
    border: solid 2px $primary-color !important;
  }
}

.search-userstory {
  position: relative;
}

.clear_filters {
  font-size: 18px;
  position: relative;
}

.filter_circle {
  position: absolute;
  right: 3px;
  margin: auto;
  // font-size: 10px;
  bottom: 13px;
}

.userstory_inputs {
  display: none !important;
}

.selectuser_countlow {
  display: none;
}

.goals-selectusers{
display: block !important;
position: absolute !important;
right: -15px;
margin-top: 0.875rem;
}

@media (max-width: 1600px) {
  .userstory_inputs {
    display: block !important;
    font-size: 16px;
    margin: 5px 0 0 0;
  }

  .selectuser_counthigh {
    display: none;
  }

  .selectuser_countlow {
    display: block;
  }

  .hide_input {
    display: none;
  }
}

/*--------------kanban start-----------*/

.userstory_search-user .mat-form-field-underline{
      display: none;
}

.userstory_search-user input{
    background: #fff;
	margin : auto;
}

.userstory_search-user {
	margin-right: 0px !important;
}

.custom-select-matform .mat-form-field-underline{
    display: none;
}

.lock_image{
    width: 25px !important;
    height: 25px !important;
}

.userstory_title-top{
      margin-top: -20px; 
}

.custom-select-matform .mat-select, .search_goalinput .mat-select{
    background: $white-color;
    vertical-align: middle;
    border: 1px solid $custom-border-color !important;
    padding: 5px !important;
    border-radius: 3px;
	height: 32px;
}

.project_member img{
  border: 2px solid #d0d0d0;
}


.userstory_top-title mat-checkbox{
  margin-top: -3px !important;
}

/*--------------kanban start-----------*/

.kanban-listItemsRed {
  box-shadow: 0px 0px 2px 1px #d4d4d4;
  padding: 10px;
  border-left: 2px solid red;
  margin: 0px 0 5px 0;
  cursor: pointer;
  img {
    width: 22px;
    height: 22px;
    border-radius: 50px;
  }
}

.projectmembers_list{
  .single_projectmember{
margin-top: 2px;
  }
}

.project_member_unAssign {
  float: left;
  margin: 0px;
  border-radius: 50px;
  cursor: pointer;
}