kendo splitter pane doesn't show vertical scrollbar

Question

I am working on an application and using the splitter from kendo ui. It looks like this:

The left side is a form and only half of it is shown.

The application is fairly big, so I will break it down and make it concise.

This is the entry.component.html: (parent component)

<kendo-splitter orientation="vertical" class="main">
  <kendo-splitter-pane // you can ignore this pane, I just added it for completeness
    [scrollable]="false"
    size="248px"
    min="200px"
    max="300px"
  >
    <dispo-signal-signal-bar
    ></dispo-signal-signal-bar>
  </kendo-splitter-pane>

  <kendo-splitter-pane min="69%" max="87%" [scrollable]="false"> 
    <dispo-einsatz-einsatz-details></dispo-einsatz-einsatz-details>
  </kendo-splitter-pane>
</kendo-splitter>

Please notice the second splitter-pane. When removing [scrollable]="false", the whole splitter is scrollable. But I need just a scrollbar for the left side.

Here is also the relevant scss for the entry.component:

.main {
  height: calc(100% - 56px);
  border: none;
}

The picture shows the <dispo-einsatz-einsatz-details>.

There I use another splitter to create the left and right side in the picture.

details.component.html:

<kendo-splitter>
  <kendo-splitter-pane class="form-pane" size="50%">
    //here is the left side, the form
  </kendo-splitter-pane>

  <kendo-splitter-pane>
    //here is the tabgroup on the right side of the picture
  </kendo-splitter-pane>
</kendo-splitter>

Since the content of the form overflows vertically, I expected a vertical scrollbar, but there is none.

Then I tried to add one manually like this:

details.component.scss:

.form-pane {
  height: 100% !important;
  overflow-y: scroll !important;
}

But this only creates the empty scrollbar for the left side...

Question: How can I add seperate, vertical scrollbars for the left (and also the right) side? And why isn't it working by default?