ngx bootstrap issue inside a container with overflow and adaptivePosition: true

Question

I truly tries to find a post related to my problem, but they are all about modal windows ( obviously not my case ). The point is a minor problem with datepicker position if it has this config:

  getSinglePickerConfig(additionalConfig: any = {}) {
    return {
      adaptivePosition: true,
      customTodayClass: 'custom-today-class',
      containerClass: 'theme-default',
      showTodayButton: true,
      todayPosition: 'right',
      showClearButton: true,
      selectFromOtherMonth: true,
      showWeekNumbers: false,
      ...additionalConfig
    }
  }

and has a parent with overflow: auto/scroll like this:

<div class="container position-relative">
    <div class="flex-form">
      <div class="wr-select wr-special">
        <select [(ngModel)]="selectedOption" (change)="onOptionChanged()"
                class="select ag-wrapper ag-picker-field-wrapper form-control form-control-styled">
          <option value="equals">Equals</option>
          <option value="greaterThan">Greater Than</option>
          <option value="lessThan">Less Than</option>
          <option value="notEqual">Not Equal</option>
          <option value="inRange">In range</option>
          <option value="blank">Blank</option>
          <option value="notBlank">Not Blank</option>
        </select>
      </div>
    </div>
    <ng-container [formGroup]="form">
      <input type="text"
             *ngIf="!hideDatepicker && !rangePicker"
             placeholder="{{placeholder}}"
             class="'form-control form-control-styled single-datepicker'"
             formControlName="date"
             readonly
             [bsConfig]="bsProps"
             #ngxDatepicker
             bsDatepicker>
      <input type="text"
             *ngIf="rangePicker"
             placeholder="{{placeholder}}"
             class="'form-control form-control-styled range-datepicker'"
             formControlName="date"
             readonly
             [bsConfig]="bsDaterangeProps"
             #ngxDatepicker
             bsDaterangepicker>
    </ng-container>
  </div>

My css:

.container {
  outline-style: none;
  outline-width: 0px;
  padding-bottom: 12px;
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 12px;
  text-align: start;
  cursor: default;
  direction: ltr;
  display: flex;
  flex-direction: column;
  font-size: 14px;
  font-weight: 400;
  line-height: normal;
  min-width: 223px;
  max-height: 200px;
  overflow: auto;
}

How it looks WITH adaptivePosition: true and WITHOUT it ( first and second pics ) I noticed that there is no mention of this in the docs here How to make it look nice ( correct position ) inside overflow parent and adaptivePosition: true? Or there is no way to do it ( i do not thinks so, it is more of my blindness ). Thank you in advance i would really appreciate any help ( a link to an article or something ). Pics: ,

I tried to disable adaptivePosition by setting it to adaptivePosition: false and using the placement property, it helped me, but this is not it (not enough flexibility when resizing a window or scrolling a container or page)