/* OngVietPOS Fix158 - prevent header/summary content from being overlapped by tables. */

/* Invoice list: Fix157 added a status summary between module head and table.
   Base sales-screen CSS still assumes only two rows, so explicitly allocate 3 rows. */
.sales-screen > .module-panel:has(.ov-invoice-status-summary) {
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  align-content: stretch !important;
  gap: 10px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.sales-screen > .module-panel:has(.ov-invoice-status-summary) > .ov-invoice-status-summary {
  position: relative !important;
  z-index: 2 !important;
  min-height: 54px !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
}
.sales-screen > .module-panel:has(.ov-invoice-status-summary) > .data-table-wrap {
  position: relative !important;
  z-index: 1 !important;
  grid-row: 3 !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: auto !important;
}

/* Completed orders / report page: DOM has 4 blocks:
   header, scan basket, table, filter. Base CSS only allocates 3 grid rows. */
.legacy-report-page:has(> .report-scan-basket) {
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  align-content: stretch !important;
  gap: 8px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
.legacy-report-page > .legacy-report-head,
.legacy-report-page > .report-scan-basket,
.legacy-report-page > .legacy-report-filter {
  position: relative !important;
  z-index: 2 !important;
  min-height: 0 !important;
}
.legacy-report-page > .report-scan-basket {
  height: auto !important;
  overflow: visible !important;
}
.legacy-report-page > .legacy-table-wrap.report-order-table {
  position: relative !important;
  z-index: 1 !important;
  grid-row: 3 !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: auto !important;
}
.legacy-report-page > .legacy-report-filter {
  grid-row: 4 !important;
}

/* Small screens: allow natural page flow instead of clipping. */
@media (max-width: 1179px) {
  .sales-screen > .module-panel:has(.ov-invoice-status-summary),
  .legacy-report-page:has(> .report-scan-basket) {
    height: auto !important;
    overflow: visible !important;
  }
  .sales-screen > .module-panel:has(.ov-invoice-status-summary) > .data-table-wrap,
  .legacy-report-page > .legacy-table-wrap.report-order-table {
    height: auto !important;
    max-height: 70vh !important;
  }
}