/* Detail panes sit above full-width list pages instead of taking table width. */
a[href$="scan.html"],
a[href="pages/scan.html"] {
  display: none !important;
}

.ops-split-layout,
.location-split-layout {
  display: block;
}

.ops-list-pane,
.location-list-pane {
  width: 100%;
  min-width: 0;
}

.ops-detail-pane,
.location-detail-pane {
  position: fixed;
  top: var(--wms-header-height, 62px);
  right: 0;
  bottom: 0;
  z-index: 1040;
  display: block;
  width: min(960px, calc(100vw - var(--wms-sidebar-width) - 18px));
  min-height: 0;
  margin: 0;
  overflow: auto;
  border: 0;
  border-left: 1px solid var(--wms-border);
  background: #fff;
  box-shadow: -18px 0 36px rgba(15, 23, 42, 0.18);
  transform: translateX(105%);
  transition: transform 0.18s ease;
  pointer-events: none;
}

.ops-detail-pane.active,
.location-detail-pane.active {
  transform: translateX(0);
  pointer-events: auto;
}

.ops-detail-header,
.location-detail-header {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #fff;
}

.ops-detail-empty,
.location-detail-empty {
  display: none;
}

.product-detail-pane {
  width: min(780px, calc(100vw - var(--wms-sidebar-width) - 18px));
}

.ops-table-wrap,
.location-table-wrap {
  width: 100%;
}

.table-row-detail-modal .detail-dl {
  margin-bottom: 0;
}

.table-row-detail-modal .detail-dl dt {
  color: var(--wms-muted);
  font-weight: 700;
}

.table-row-detail-modal .detail-dl dd {
  font-weight: 650;
}

@media (max-width: 991.98px) {
  .ops-detail-pane,
  .location-detail-pane {
    top: var(--wms-header-height, 62px);
    width: 100vw;
  }
}

@media (max-width: 575.98px) {
  .ops-detail-pane,
  .location-detail-pane {
    top: 0;
    bottom: calc(58px + env(safe-area-inset-bottom));
    width: 100vw;
  }
}
