@@ -243,7 +243,7 @@ const TableWrapper = styled.div<{
243243 position: -webkit-sticky;
244244 // top:${ props . $fixedToolbar ?'47px' :'0' }
245245 top: 0;
246- z-index:99 ;
246+ z-index:2 ;
247247 `
248248}
249249 > tr {
@@ -256,7 +256,14 @@ const TableWrapper = styled.div<{
256256 color:${ ( props ) => props . $headerStyle . headerText }
257257 // border-inline-end:${ ( props ) => `${ props . $headerStyle . borderWidth } ${ props . $headerStyle . border } }
258258
259-
259+ /* Proper styling for fixed header cells */
260+ &.ant-table-cell-fix-left, &.ant-table-cell-fix-right {
261+ z-index: 1;
262+ background:${ ( props ) => props . $headerStyle . headerBackground }
263+ }
264+
265+
266+
260267 > div {
261268 margin:${ ( props ) => props . $headerStyle . margin }
262269
@@ -295,7 +302,27 @@ const TableWrapper = styled.div<{
295302
296303 td {
297304 padding: 0px 0px;
298- //${ ( props ) => props . $showHRowGridBorder ?'border-bottom: 1px solid #D7D9E0 !important;' :`border-bottom: 0px;` }
305+ //${ ( props ) => props . $showHRowGridBorder ?'border-bottom: 1px solid #D7D9E0 !important;' :`border-bottom: 0px;` }
306+
307+ /* Proper styling for Fixed columns in the table body */
308+ &.ant-table-cell-fix-left, &.ant-table-cell-fix-right {
309+ z-index: 1;
310+ background: inherit;
311+ background-color:${ ( props ) => props . $style . background }
312+ transition: background-color 0.3s;
313+ }
314+
315+ }
316+
317+ /* Fix for selected and hovered rows */
318+ tr.ant-table-row-selected td.ant-table-cell-fix-left,
319+ tr.ant-table-row-selected td.ant-table-cell-fix-right {
320+ background-color:${ ( props ) => props . $rowStyle ?. selectedRowBackground || '#e6f7ff' }
321+ }
322+
323+ tr.ant-table-row:hover td.ant-table-cell-fix-left,
324+ tr.ant-table-row:hover td.ant-table-cell-fix-right {
325+ background-color:${ ( props ) => props . $rowStyle ?. hoverRowBackground || '#f5f5f5' }
299326 }
300327
301328 thead > tr:first-child {
@@ -428,7 +455,7 @@ const TableTd = styled.td<{
428455 }
429456
430457 &:active {
431- color:${ ( props ) => props . $linkStyle ?. activeText } } ;
458+ color:${ ( props ) => props . $linkStyle ?. activeText }
432459 }
433460 }
434461 }