fix(pivot): Fix horizontal scrolling overflow issue

Author: mddragnev

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-header-row.component.html

@@ -72,7 +72,7 @@
             <div #pivotContainer class="igx-grid__tr-action" [style.min-width.px]="grid.pivotRowWidths"
                 (igxDragEnter)="onAreaDragEnter($event, rowArea, 0)" (igxDragLeave)="onAreaDragLeave($event, rowArea)"
                 igxDrop (dropped)="onDimDrop($event, rowArea, 0)" (pointerdown)="$event.preventDefault()"
-                style='display: flex; align-items: flex-end;'>
+                style='display: flex; align-items: flex-end; z-index: 4; background: inherit;'>
 
                 <div *ngIf="grid.rowDimensions.length === 0">
                     <span class='igx-pivot__emptyChipArea'>Drop Row Fields here.</span>
@@ -131,4 +131,4 @@
 </div>
 <!-- Header thumb area -->
 <div *ngIf="!row" class="igx-grid-thead__thumb" [hidden]="!grid.hasVerticalScroll()" [style.width.px]="grid.scrollSize">
-</div>
+</div>