@include media-breakpoint-down(sm) {
  .epics-other-filters {
    .epics-sort-btn i {
      position: absolute;
      top: 11px;
      right: 6px;
    }

    .btn-sort-direction {
      flex: 0 1 auto;
    }
  }
}

.epic-discussion-separator {
  border-color: $border-color;
}

.epic-sidebar {
  .help-icon,
  .date-warning-icon {
    &:hover {
      cursor: pointer;
    }
  }

  .help-icon {
    color: $gl-text-color-secondary;
  }

  .btn-sidebar-action.btn-link {
    line-height: $gl-font-size;
  }

  .btn-sidebar-date-remove {
    height: $gl-font-size;
    line-height: $gl-btn-horz-padding;
  }

  .date-warning-icon {
    color: $orange-500;
    margin-top: -1px;
  }

  .is-option-selected {
    > span {
      color: $gl-text-color;
      font-weight: $gl-font-weight-bold;
    }
  }
}

.epic-tabs-content {
  .roadmap-container {
    min-height: 600px;

    .roadmap-shell {
      border: 1px solid $white-dark;
      border-top: 0;
    }

    .empty-state {
      margin-top: 0;
    }
  }
}

@include media-breakpoint-down(xs) {
  .epic-page-container {
    .detail-page-header {
      display: flex;
    }

    .detail-page-header-actions {
      margin-top: 0;
    }
  }
}

.tooltip .tooltip-inner .milestone-date-range {
  color: $gl-text-color-tertiary;
}

.new-epic-form .md-area.gfm-form {
  @include gl-rounded-base;
  @include gl-border-none;
  @include gl-inset-border-1-gray-200;

  &.is-focused {
    @include gl-focus($gl-border-size-1, $gray-900);
    @include gl-text-gray-900;
  }

  .markdown-area::placeholder {
    @include gl-text-gray-200;
  }
}

.labels-select-wrapper.is-embedded {
  width: $gl-dropdown-width;

  .labels-select-dropdown-button {
    @include gl-bg-white;
    @include gl-font-regular;
    @include gl-font-base;
    @include gl-line-height-normal;
    @include gl-py-3;
    @include gl-px-4;
    @include gl-h-auto;
    @include gl-text-left;
    @include gl-border-none;
    @include gl-inset-border-1-gray-200;
    @include gl-rounded-base;
    @include gl-white-space-nowrap;

    .gl-button-text {
      @include gl-text-gray-700;
      @include gl-display-flex;
      @include gl-justify-content-space-between;
      @include gl-w-full;
    }

    .gl-icon {
      @include gl-m-0;
    }
  }

  .labels-select-dropdown-contents {
    @include gl-left-0;
    @include gl-shadow-x0-y2-b4-s0;

    width: 300px !important;
    min-height: 335px;
    max-height: none;
    margin-bottom: $gl-spacing-scale-6 !important;

    a:not(.btn) {
      @include gl-reset-color;
    }
  }

  .dropdown-title {
    padding-top: $gl-spacing-scale-2 !important;
    padding-bottom: $gl-spacing-scale-4 !important;
  }

  .dropdown-footer .list-unstyled {
    @include gl-m-0;
  }
}
