.sidebar-wrapper {
  width: $sidebar-width;
  height: 100%;
  font-size: 12px;
  background: $blue-dark;
  .sidebar-list {
    display: flex;
    flex-direction: column;
    .sidebar-icon-wrapper {
      width: 100%;
      height: $sidebar-width;
      display: flex;
      align-items: center;
      justify-content: center;
      border-right: 4px solid transparent;
      &:hover,
      &.active {
        border-color: $blue;
        .sidebar-icon {
          color: $blue;
        }
      }
      &.active {
        background: darken($blue-dark, 3%);
      }
      .sidebar-icon {
        font-size: 32px;
        color: $light;
      }
    }
  }
}
