/* The users/projects workbench alone owns the remaining screen height. */
body:has(.customer-viewport-screen),
body:has(.customer-viewport-screen) #app,
body:has(.customer-viewport-screen) .app-shell {
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
}
body[data-theme] .main.screen-main:has(.customer-viewport-screen) {
  display: flex !important;
  flex-direction: column;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
body[data-theme] .main:has(.customer-viewport-screen) > .tech-topbar {
  flex: 0 0 auto;
}
body[data-theme] .customer-workbench.customer-viewport-screen {
  --customer-row-min-height: 64px;
  display: flex !important;
  flex-direction: column;
  flex: 1 1 0;
  height: auto !important;
  min-height: 0 !important;
  min-width: 0;
  gap: 10px;
  overflow: hidden;
}
body[data-theme] .customer-viewport-screen[data-customer-tab="users"] {
  --customer-row-min-height: 52px;
}
.customer-viewport-screen > .customer-workbench-head,
.customer-viewport-screen > .customer-stat-strip {
  flex: 0 0 auto;
}
body[data-theme] .customer-viewport-screen > .customer-list-panel {
  display: flex !important;
  flex-direction: column;
  align-self: stretch;
  flex: 1 1 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
}
.customer-viewport-screen .customer-list-toolbar,
.customer-viewport-screen .customer-list-footer {
  flex: 0 0 auto;
}
body[data-theme] .customer-viewport-screen .customer-table-wrap {
  flex: 1 1 0;
  min-height: 0;
  max-height: none;
  overflow-x: auto;
  overflow-y: hidden;
}
.customer-viewport-screen .customer-table {
  border-collapse: separate;
  border-spacing: 0;
  height: auto;
}
body[data-theme] .customer-viewport-screen .customer-table td {
  height: var(--customer-screen-row-height, var(--customer-row-min-height));
  box-sizing: border-box;
  padding: 7px 9px;
  line-height: 16px;
  white-space: nowrap;
}
.customer-viewport-screen .customer-table td > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 14px;
}
.customer-viewport-screen .customer-table th {
  box-sizing: border-box;
  height: 32px;
  white-space: nowrap;
}
/* Theme-wide button minimums must not enlarge a table row beyond its measured track. */
body[data-theme] .customer-viewport-screen .customer-table button {
  min-height: 28px;
  height: auto;
  padding: 4px 7px;
  font-size: 10px;
  line-height: 16px;
  white-space: nowrap;
}
body[data-theme] .customer-viewport-screen .customer-table button.compact-button {
  min-height: 29px;
}
body[data-theme] .customer-viewport-screen .customer-table button.text-link {
  min-height: 26px;
  padding: 2px;
}
body[data-theme] .customer-viewport-screen .customer-table :is(.stage-pill, .delivery-countdown) {
  box-sizing: border-box;
  min-height: 0;
  height: 26px;
  padding: 4px 9px;
  line-height: 16px;
}
/* Geometry changes are discrete; animating sizes would make the measured capacity oscillate. */
.customer-viewport-screen,
.customer-viewport-screen .customer-list-panel,
.customer-viewport-screen .customer-table-wrap,
.customer-viewport-screen .customer-table,
.customer-viewport-screen .customer-table :is(thead, tbody, tr, th, td) {
  transition-property: none !important;
}
@media (max-height: 800px) {
  body[data-theme] .customer-workbench.customer-viewport-screen { gap: 7px; }
  body[data-theme] .customer-viewport-screen[data-customer-tab="projects"] { --customer-row-min-height: 60px; }
  .customer-viewport-screen .customer-stat-strip > :is(button, div) { min-height: 48px; padding-block: 6px; }
}
@media (max-width: 1300px) {
  body[data-theme] .customer-viewport-screen[data-customer-tab="users"] { --customer-row-min-height: 45px; }
  body[data-theme] .customer-viewport-screen .user-workbench-table td { padding: 6px 7px; }
  .customer-viewport-screen .user-workbench-table td > small { line-height: 12px; }
}
@media (max-height: 560px) {
  .customer-viewport-screen .customer-workbench-head { min-height: 40px; }
  .customer-viewport-screen .customer-workbench-head :is(.eyebrow, p) { display: none; }
  .customer-viewport-screen .customer-stat-strip > :is(button, div) { min-height: 38px; padding-block: 3px; }
  .customer-viewport-screen .customer-stat-strip i { width: 26px; height: 26px; }
  .customer-viewport-screen .customer-stat-strip strong { font-size: 16px; }
  .customer-viewport-screen .customer-stat-strip small { margin-top: 2px; }
}
@media (max-width: 700px) {
  .customer-viewport-screen .customer-workbench-head { flex-direction: column; align-items: stretch; gap: 6px; }
  .customer-viewport-screen .customer-head-actions { justify-content: flex-start; overflow-x: auto; }
  .customer-viewport-screen .customer-head-actions button { flex: 0 0 auto; white-space: nowrap; }
  .customer-viewport-screen .customer-stat-strip { gap: 4px; }
  .customer-viewport-screen .customer-stat-strip > :is(button, div) { padding-inline: 6px; gap: 5px; }
  .customer-viewport-screen .customer-stat-strip i { display: none; }
  .customer-viewport-screen .customer-list-toolbar { flex-wrap: wrap; gap: 6px; }
  .customer-viewport-screen .customer-filters { width: 100%; }
  .customer-viewport-screen .customer-filters :is(input, select) { min-width: 0; flex: 1; width: 0; }
}
