Is it possible to create a table with scroll enabled where the vertical scroll bar doesn't extend into the header?

I'm trying to create a table where the header is fixed and matches columns, obeying horizontal scrolling, but where the vertical scroll bar doesn't extend all the way into the header.

Currently the scroll bars do this:

I'm trying to make it so that vertical scroll bar stops at the top of the first line/gray area, is this even possible?

This is my current css:

.scrollable-table-container > table > tbody > tr > th,.scrollable-table-container > table > tbody > tr > td {    background-color: var(--color3HEX);    border: none;}.collapsed-row, .collapsed-row > th, .collapsed-row > td {    background-color: var(--color4HEX) !important;}.scrollable-table-container > table {    overflow: visible;}.scrollable-table-container {    max-height: 65vh;    overflow-y: auto;}    .scrollable-table-container > table > thead {        position: sticky;        top: 0;        z-index: 99;    }

I've tried some adjustments, but so far everything i've tried removes both scroll bars or takes the headers out of alignment or both.

My question is, is what i'm trying to do even possible?