.rt-project-key__entry {
  display: flex;
  flex-direction: row;
  align-items: center;

  height: $react-timelines-project-height + $react-timelines-border-width;
  line-height: $react-timelines-project-height;
  text-align: left;
  border-bottom: $react-timelines-border-width solid $react-timelines-sidebar-separator-color;
}

.rt-icon {
  color: $react-feather-color;
}

.rt-project-keys > .rt-project-key >
.rt-project-key__entry {
  padding-left: $react-timelines-sidebar-key-indent-width;
}

.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-key__entry  {
  padding-left: $react-timelines-sidebar-key-indent-width * 2;
}

.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-key__entry {
  padding-left: $react-timelines-sidebar-key-indent-width * 3;
}

.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-key__entry {
  padding-left: $react-timelines-sidebar-key-indent-width * 4;
}

.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-keys > .rt-project-key >
.rt-project-key__entry {
  padding-left: $react-timelines-sidebar-key-indent-width * 5;
}

.rt-project-key__title {
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.rt-project-key__side-button {
  height: $react-timelines-project-height;
  width: $react-timelines-project-height;
  color: transparent;
  background: transparent;

  &:hover,
  &:focus {
    background: $react-timelines-sidebar-key-icon-hover-color;
    color: transparent;
  }

  &::before {
    position: absolute;
    width: $react-timelines-sidebar-key-icon-size;
    height: $react-timelines-sidebar-key-icon-size;
    margin-top: -$react-timelines-sidebar-key-icon-size / 2;
    margin-left: -$react-timelines-sidebar-key-icon-size / 2;
    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDQ4Mi4xMzYgNDgyLjEzNSI+PHBhdGggZmlsbD0iIzc2NzY3NiIgZD0iTTQ1NS40ODIgMTk4LjE4NEwzMjYuODMgMzI2LjgzMmMtMzUuNTM2IDM1LjU0LTkzLjExIDM1LjU0LTEyOC42NDcgMGwtNDIuODgtNDIuODg2IDQyLjg4LTQyLjg3NiA0Mi44ODQgNDIuODc2YzExLjg0NSAxMS44MjIgMzEuMDY0IDExLjg0NiA0Mi44ODYgMGwxMjguNjQ0LTEyOC42NDNjMTEuODE2LTExLjgzIDExLjgxNi0zMS4wNjYgMC00Mi45bC00Mi44OC00Mi44OGMtMTEuODIzLTExLjgxNS0zMS4wNjUtMTEuODE1LTQyLjg4OCAwbC00NS45MyA0NS45MzVjLTIxLjI5LTEyLjUzLTQ1LjQ5LTE3LjkwNS02OS40NS0xNi4yOWw3Mi41LTcyLjUyN2MzNS41MzYtMzUuNTIgOTMuMTM3LTM1LjUyIDEyOC42NDUgMGw0Mi44ODYgNDIuODg0YzM1LjUzNiAzNS41MjMgMzUuNTM2IDkzLjE0IDAgMTI4LjY2MnpNMjAxLjIwNiAzNjYuNjk4bC00NS45MDMgNDUuOWMtMTEuODQ1IDExLjg0Ni0zMS4wNjQgMTEuODE3LTQyLjg4IDBsLTQyLjg4NS00Mi44OGMtMTEuODQ1LTExLjgyMi0xMS44NDUtMzEuMDQyIDAtNDIuODg3bDEyOC42NDYtMTI4LjY0NWMxMS44Mi0xMS44MTQgMzEuMDctMTEuODE0IDQyLjg4NCAwbDQyLjg4NiA0Mi44ODYgNDIuODc2LTQyLjg4Ni00Mi44NzYtNDIuODhjLTM1LjU0LTM1LjUyMi05My4xMTMtMzUuNTIyLTEyOC42NSAwbC0xMjguNjUgMTI4LjY0Yy0zNS41MzcgMzUuNTQ2LTM1LjUzNyA5My4xNDcgMCAxMjguNjUzTDY5LjU0IDQ1NS40OGMzNS41MSAzNS41NCA5My4xMSAzNS41NCAxMjguNjQ2IDBsNzIuNDk2LTcyLjVjLTIzLjk1NiAxLjU5OC00OC4wOTItMy43ODMtNjkuNDc0LTE2LjI4MnoiLz48L3N2Zz4=');
    content: ' ';
  }
}