/* 1. Ensure the container triggers a scrollable area */
.reports-table {
  overflow: auto;
  max-height: 75vh;
  /* Adjust this value to fit your dashboard's layout */
}

/* 2. Make all table headers sticky (scroll down) */
.reports-table table thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: #fff;
  box-shadow: inset 0 -1px 0 #dee2e6;
  /* Preserves the bottom border */
}

/* 3. Handle the top-left intersection cell (scroll both down and right) */
.reports-table table thead th:first-child {
  position: sticky;
  left: 0;
  z-index: 15;
  /* Highest z-index to stay above both header and first column */
  background-color: #fff;
  box-shadow: inset -1px -1px 0 #dee2e6;
}

/* Outer cell: Handles horizontal sticking (scroll right) */
.reports-table table tbody td:first-child {
  position: sticky;
  left: 0;
  z-index: 5;
  background-color: var(--bs-table-bg, #fff);
  box-shadow: inset -1px 0 0 #dee2e6;
  vertical-align: middle; /* Keeps layout stable */
  padding: 0 !important;  /* Move padding to the inner div to avoid jumpiness */
}

/* Inner wrapper: Handles vertical sticking and centering (scroll down) */
.reports-table .sticky-row-header {
  position: sticky;
  /* Adjust top offset to clear your sticky thead height (e.g., around 45px-55px depending on font/padding) */
  top: 110px; 
  
  /* Centering math */
  display: flex;
  flex-direction: column;
  justify-content: center;
  
  /* Re-apply the cell padding here so the hover/click targets stay large */
  padding: 1.5rem 1rem; 
  
  /* Ensure it fills the parent cell height so it has room to slide */
  height: 100%;
}

/* Maintain alternating background for striped tables */
.reports-table table.table-striped tbody tr:nth-of-type(odd) td:first-child {
  background-color: var(--bs-table-striped-bg, rgba(0, 0, 0, 0.05));
}

/* 6. Accommodate full-width section headers in the Insights report */
.reports-table table tbody tr td[colspan] {
  position: sticky;
  left: 0;
  z-index: 6;
}