/* Shared list macro contract. This layer is authoritative for migrated list toolbars. */
.list-filter-panel,
.list-page-tabs,
.list-result-summary {
  min-width: 0;
}

.list-filter-panel {
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}
.list-filter-panel__content { padding: 1rem; }

/* Optional secondary filter drawer. The main search/summary remains in the
   page flow; this surface is only used for larger filter sets. */
.filter-drawer[hidden] { display: none; }
.filter-drawer { position: fixed; inset: 0; z-index: 60; }
.filter-drawer__backdrop { position: absolute; inset: 0; background: rgb(15 23 42 / .48); }
.filter-drawer__panel { position: absolute; top: 0; right: 0; display: flex; height: 100%; width: min(27rem, 100%); flex-direction: column; overflow: hidden; background: var(--color-surface); box-shadow: -12px 0 32px rgb(15 23 42 / .18); }
.filter-drawer__header { display: flex; min-height: 4rem; align-items: center; justify-content: space-between; gap: .75rem; border-bottom: 1px solid var(--color-border); padding: 1rem 1.25rem; }
.filter-drawer__header h2 { margin: 0; color: var(--color-text-primary); font-size: 1rem; font-weight: 700; }
.filter-drawer__close { display: inline-flex; min-width: 2.75rem; min-height: 2.75rem; align-items: center; justify-content: center; border-radius: var(--ui-radius); color: var(--color-text-secondary); font-size: 1.5rem; line-height: 1; }
.filter-drawer__close:hover { background: var(--color-surface-muted); color: var(--color-text-primary); }
.filter-drawer__close:focus-visible { outline: none; box-shadow: var(--ui-focus); }
.filter-drawer__count { margin: .75rem 1.25rem 0; color: var(--color-text-secondary); font-size: .75rem; font-weight: 600; }
.filter-drawer__body { min-height: 0; flex: 1; overflow-y: auto; padding: 1.25rem; }
.filter-drawer__footer { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; border-top: 1px solid var(--color-border); padding: .875rem 1.25rem calc(.875rem + env(safe-area-inset-bottom)); }
.filter-drawer__footer .btn { min-height: 2.75rem; justify-content: center; }
body.filter-drawer-open { overflow: hidden; }
html.dark .filter-drawer__backdrop { background: rgb(2 6 23 / .68); }
@media (min-width: 1024px) { .filter-drawer { display: none; } }
@media (max-width: 479px) {
  .filter-drawer__panel { width: 100%; }
  .filter-drawer__header { min-height: 3.5rem; padding-inline: 1rem; }
  .filter-drawer__body { padding: 1rem; }
  .filter-drawer__footer { padding-inline: 1rem; }
}

/* Legacy collapsible panel styles retained for compatibility; migrated lists
   use filter-drawer.js and keep search in the page toolbar. */
.list-filter-panel--collapsible { display: block; }
.list-filter-panel--collapsible .list-filter-panel__toggle {
  display: flex;
  width: 100%;
  min-height: var(--ui-control-height);
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .75rem 1rem;
  border: 0;
  background: transparent;
  color: var(--color-text-primary);
  font-size: .875rem;
  font-weight: 600;
  text-align: left;
}
.list-filter-panel--collapsible:not(.is-open) .list-filter-panel__content { display: none; }
.list-filter-panel--collapsible.is-open .list-filter-panel__content { display: block; }
.list-filter-panel--collapsible .list-filter-panel__summary-icon {
  width: .55rem;
  height: .55rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform .15s ease;
}
.list-filter-panel--collapsible.is-open .list-filter-panel__summary-icon { transform: rotate(225deg); }
.list-filter-panel__toggle:focus-visible { outline: none; box-shadow: var(--ui-focus); }
.list-filter-panel--collapsible > .list-filter-panel__content { padding: 1rem; }
.list-filter-row {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.75rem;
}
.list-filter-row--history { grid-template-columns: minmax(0, 1.8fr) minmax(0, 1.15fr) minmax(11.5rem, auto); }
.list-filter-row--lead-filters { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(11.5rem, auto); }
.list-filter-row--workspace-history { grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)) minmax(11.5rem, auto); }
.list-filter-row--notifications,
.list-filter-row--conversation { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.list-filter-row--responses { grid-template-columns: minmax(0, 1.55fr) minmax(9rem, 1fr) minmax(0, 1.6fr) minmax(11.5rem, auto); }
.list-filter-field { min-width: 0; }
.list-filter-field .form-label { margin: 0 0 0.35rem; }
.list-filter-actions { min-width: 0; overflow: visible; }
.list-filter-actions > .form-label { display: none; }
.list-filter-actions__buttons { display: flex; gap: 0.5rem; }
.list-filter-actions .btn { min-height: 2.75rem; white-space: nowrap; }
.list-filter-actions__buttons .btn { min-width: 5.5rem; flex: 0 0 auto; }
.list-filter-actions__buttons { width: 100%; }
.list-filter-row--admin { grid-template-columns: minmax(0, 1.7fr) repeat(2, minmax(0, 1fr)) minmax(11.5rem, auto); }
.list-filter-row--admin-compact { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 1fr) minmax(11.5rem, auto); }
.list-filter-row--admin-jobs { grid-template-columns: minmax(0, 1.7fr) repeat(5, minmax(0, 1fr)) minmax(11.5rem, auto); }
.customer-page .list-filter-row--history { grid-template-columns: minmax(0, 1.8fr) minmax(0, 1.15fr) minmax(11.5rem, auto); }
.plumber-page .list-filter-row--lead-filters { grid-template-columns: minmax(14rem, 2fr) minmax(10rem, 1.15fr) minmax(10rem, 1.15fr) minmax(11.5rem, auto); }
.list-filter-field .form-select,
.list-filter-field .plumber-work-area-trigger { width: 100%; }
.list-search-field { position: relative; width: 100%; min-width: 0; }
.list-search-field__input { display: block; min-width: 0; width: 100%; }
.list-search-field__icon {
  position: absolute;
  left: .9rem;
  top: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  pointer-events: none;
}
.list-search-field__input { padding-left: 2.55rem; }
.list-filter-field--sort .form-select { min-width: 0; }
.list-mobile-sort { display: none; }
.customer-responses-sort { min-height: var(--ui-control-height); padding-right: 2.5rem !important; }
.list-filter-row--lead-filters .form-label { display: block; }
.list-filter-row--lead-filters .plumber-work-area-trigger {
  min-height: var(--ui-control-height);
  border: 1px solid #cbd5e1;
  border-radius: var(--ui-radius);
  background: #fff;
  box-shadow: none;
  color: #0f172a;
}
.list-filter-row--lead-filters .plumber-work-area-trigger:focus-visible { outline: none; box-shadow: var(--ui-focus); border-color: #3b82f6; }
.list-filter-actions__buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* The filter surface is one shared component across customer, plumber, and
   admin pages. Keep panel, fields, triggers, and actions on one radius scale. */
.list-filter-panel,
.portal-page--admin .list-filter-panel { border-radius: .75rem !important; }
.list-filter-panel { padding: 0 !important; }
.list-filter-panel .form-input,
.list-filter-panel .form-select,
.list-filter-panel .plumber-work-area-trigger,
.list-filter-panel .btn { border-radius: var(--ui-radius) !important; }
.list-filter-panel .customer-responses-filter-form { display: block; padding: 0; }
.list-filter-panel .customer-responses-filter-form select { width: 100%; max-width: none; height: auto; }
.list-filter-panel .plumber-inbox-filter-form { width: 100%; }
.list-filter-panel .plumber-inbox-chipbar { padding: 0; }
.list-filter-panel .customer-responses-filter-chips { padding: 0; }
.customer-responses-filter-form .form-select,
.customer-responses-search { border-radius: var(--ui-radius) !important; }
.list-result-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.15rem 0;
}
.list-result-summary__side, .list-result-summary__actions { min-width: 0; }
.list-inline-sort { display: flex; align-items: center; gap: 0.55rem; }
.list-inline-sort__label { white-space: nowrap; }
.list-inline-sort .form-select { min-width: 8.5rem; min-height: 2.45rem; padding-top: .45rem; padding-bottom: .45rem; font-size: .8rem; }

/* Workspace adds a sort field to the normal lead filters. Give the shared
   row a fifth track only when that field exists so Leads keeps its four-field
   layout and Workspace no longer wraps the action buttons. */
@media (min-width: 1024px) {
  .list-filter-row--admin-jobs {
    grid-template-columns: minmax(8rem, 1.45fr) repeat(5, minmax(4.5rem, 1fr)) minmax(8.5rem, auto);
    gap: .4rem;
  }
  .list-filter-row--lead-filters:has(.list-filter-field--sort) {
    grid-template-columns: minmax(12rem, 1.55fr) repeat(3, minmax(7rem, 1fr)) auto;
    gap: .6rem;
  }

  .list-filter-row--lead-filters:has(.list-filter-field--sort) .list-filter-actions__buttons {
    width: auto;
    grid-template-columns: repeat(2, minmax(0, auto));
  }
}

@media (min-width: 1200px) {
  .list-filter-row--admin-jobs {
    grid-template-columns: minmax(11rem, 1.7fr) repeat(5, minmax(6rem, 1fr)) minmax(10rem, auto);
    gap: .5rem;
  }
}

@media (max-width: 1023px) {
  .list-filter-row--lead-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .list-filter-row--workspace-history { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .list-filter-row--admin, .list-filter-row--admin-compact, .list-filter-row--admin-jobs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .list-filter-row--admin .list-filter-field--search { grid-column: 1 / -1; }
  .list-filter-row--admin-compact .list-filter-field--search { grid-column: 1 / -1; }
  .list-filter-row--admin-jobs .list-filter-field--search { grid-column: 1 / -1; }
  .list-filter-row--lead-filters .list-filter-field--search { grid-column: 1 / -1; }
  .list-filter-row--lead-filters .list-filter-actions { grid-column: 1 / -1; }
}

@media (min-width: 1024px) {
  .list-filter-panel--collapsible .list-filter-panel__toggle { display: none; }
  .list-filter-panel--collapsible .list-filter-panel__content { display: block; }
}

@media (max-width: 1023px) {
  .list-filter-panel { border-radius: 0.75rem; }
  .list-filter-panel__content, .list-filter-panel--collapsible > .list-filter-panel__content { padding: 0.85rem; }
  .list-filter-row, .list-filter-row--history, .list-filter-row--lead-filters, .list-filter-row--workspace-history, .list-filter-row--admin, .list-filter-row--admin-compact, .list-filter-row--admin-jobs, .list-filter-row--notifications, .list-filter-row--conversation, .list-filter-row--responses { grid-template-columns: minmax(0, 1fr); gap: 0.65rem; }
  .customer-page .list-filter-row--history, .plumber-page .list-filter-row--lead-filters { grid-template-columns: minmax(0, 1fr); }
  .list-filter-row--lead-filters .list-filter-field--search, .list-filter-row--lead-filters .list-filter-actions { grid-column: auto; }
  .list-filter-actions { min-width: 0; }
  .list-filter-actions__buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
  .list-filter-actions__buttons .btn { width: 100%; min-height: 2.75rem; }
  .list-result-summary { align-items: stretch; flex-direction: column; gap: 0.75rem; }
  .list-result-summary__side, .list-result-summary__actions { width: 100%; }
  .list-inline-sort { display: grid; grid-template-columns: auto minmax(0, 1fr); width: 100%; }
  .list-inline-sort .form-select { min-width: 0; width: 100%; }
  /* Legacy/workspace mobile sort forms stay compact when they are rendered
     alongside the results summary. Reference list pages use the same shape
     at every viewport. */
  .list-mobile-sort {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem;
    min-width: 0;
    margin-top: .75rem;
  }
  .list-mobile-sort__label { flex: 0 0 auto; color: var(--color-text-secondary); font-size: .75rem; font-weight: 600; }
  .list-mobile-sort .form-select { width: auto; min-width: 9.5rem; min-height: 2.5rem; padding-top: .5rem; padding-bottom: .5rem; }

  /* The shared table macros become labelled list cards instead of an overflowed grid. */
  .table-container { overflow: visible; background: transparent; border: 0; }
  .table-mobile { width: 100%; }
  .table-mobile tr { box-shadow: var(--shadow-sm); }
  .table-mobile tr:last-child { margin-bottom: 0; }
  .table-mobile td { overflow-wrap: anywhere; }
  .table-mobile td .btn, .table-mobile .table-actions .btn { min-height: 2.75rem; }
}

@media (max-width: 639px) {
  /* Every compact filter uses the control itself as the mobile label. Search
     placeholders and select first options retain the field title without a
     second vertical label row. */
  .list-filter-panel .list-filter-field > .form-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .list-filter-panel .list-filter-field .form-input,
  .list-filter-panel .list-filter-field .form-select,
  .list-filter-panel .list-filter-field .plumber-work-area-trigger,
  .list-filter-panel .list-filter-field--chips .plumber-inbox-chipbar { min-height: 2.75rem; }
  .list-filter-panel .list-filter-field .form-input,
  .list-filter-panel .list-filter-field .form-select,
  .list-filter-panel .list-filter-field .plumber-work-area-trigger { font-size: .75rem; }
  .list-filter-row--notifications,
  .list-filter-row--conversation { grid-template-columns: minmax(0, 1fr); }
  .list-filter-row--history,
  .list-filter-row--workspace-history,
  .list-filter-row--admin,
  .list-filter-row--admin-compact,
  .list-filter-row--admin-jobs,
  .list-filter-row--responses { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
  .list-filter-row--history .list-filter-field--search,
  .list-filter-row--workspace-history .list-filter-field--search,
  .list-filter-row--admin .list-filter-field--search,
  .list-filter-row--admin-compact .list-filter-field--search,
  .list-filter-row--admin-jobs .list-filter-field--search,
  .list-filter-row--responses .list-filter-field--search,
  .list-filter-row--history .list-filter-actions,
  .list-filter-row--workspace-history .list-filter-actions,
  .list-filter-row--admin .list-filter-actions,
  .list-filter-row--admin-compact .list-filter-actions,
  .list-filter-row--admin-jobs .list-filter-actions,
  .list-filter-row--responses .list-filter-actions { grid-column: 1 / -1; }
  .list-filter-field--chips .plumber-inbox-chipbar { align-items: stretch; overflow-x: auto; flex-wrap: nowrap; }
  .list-filter-field--chips .plumber-inbox-chip { flex: 0 0 auto; }
  .list-filter-actions__buttons { grid-template-columns: minmax(0, 1fr) minmax(4.5rem, auto); }

  .list-result-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .65rem;
  }

  .list-result-summary__copy { min-width: 0; }
  .list-result-summary__copy strong,
  .list-result-summary__copy span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* Compact app-like lead filters: search full width, paired quick filters,
     sort, and actions stay inside the same surface without overflow. */
  .plumber-page .list-filter-row--lead-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
  }
  .plumber-page .list-filter-row--lead-filters .list-filter-field--search {
    grid-column: 1 / -1;
  }
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control--workarea {
    grid-column: 1;
  }
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control:not(.plumber-leads-filter-control--search):not(.plumber-leads-filter-control--workarea),
  .plumber-page .list-filter-row--lead-filters .list-filter-field:not(.list-filter-field--search):not(.plumber-leads-filter-control--workarea):not(.list-filter-field--sort):not(.list-filter-actions) {
    grid-column: 2;
  }
  .plumber-page .list-filter-row--lead-filters .list-filter-actions {
    grid-column: 1 / -1;
  }
  .plumber-page .list-filter-row--lead-filters .form-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .plumber-page .list-filter-row--lead-filters .form-input,
  .plumber-page .list-filter-row--lead-filters .form-select,
  .plumber-page .list-filter-row--lead-filters .plumber-work-area-trigger { min-height: 2.75rem; font-size: .75rem; }
  .plumber-page .list-filter-row--lead-filters .plumber-work-area-trigger span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .plumber-page .list-filter-row--lead-filters .list-filter-actions__buttons { grid-template-columns: minmax(0, 1fr) minmax(4.5rem, auto); }
  .list-mobile-sort { justify-content: flex-end; margin-top: .6rem; margin-left: auto; }
  .list-mobile-sort { margin-top: 0; }
  .list-mobile-sort__label { display: none; }
  .list-mobile-sort .form-select { flex: 0 1 8.5rem; width: 8.5rem; min-width: 0; min-height: 2.45rem; padding-inline: .65rem 1.9rem; font-size: .76rem; }

  .list-result-summary__side,
  .list-result-summary__actions,
  .customer-page .list-result-summary__side,
  .portal-page--admin .list-result-summary__side {
    width: auto;
    max-width: 100%;
    align-self: center;
    margin-left: 0;
  }

  .list-result-summary__actions .list-mobile-sort { width: auto; }
}

/* Admin operational tables keep their efficient desktop layout while
   becoming readable record cards on narrow screens. Existing cell content is
   allowed to wrap rather than widening the page. */
@media (max-width: 767px) {
  .portal-page--admin [data-responsive-table] { overflow: visible; }
  .portal-page--admin [data-responsive-table] .table-mobile,
  .portal-page--admin [data-responsive-table].table-mobile { display: block; min-width: 0 !important; }
  .portal-page--admin [data-responsive-table] .table-mobile thead,
  .portal-page--admin [data-responsive-table].table-mobile thead { display: none; }
  .portal-page--admin [data-responsive-table] .table-mobile tbody,
  .portal-page--admin [data-responsive-table] .table-mobile tr,
  .portal-page--admin [data-responsive-table] .table-mobile td,
  .portal-page--admin [data-responsive-table].table-mobile tbody,
  .portal-page--admin [data-responsive-table].table-mobile tr,
  .portal-page--admin [data-responsive-table].table-mobile td { display: block; width: 100%; }
  .portal-page--admin [data-responsive-table] .table-mobile tr,
  .portal-page--admin [data-responsive-table].table-mobile tr { margin-bottom: .75rem; border: 1px solid var(--color-border); border-radius: var(--ui-radius); background: var(--color-surface); padding: .75rem; box-shadow: var(--shadow-sm); }
  .portal-page--admin [data-responsive-table] .table-mobile td,
  .portal-page--admin [data-responsive-table].table-mobile td { border: 0; padding: .3rem 0; text-align: left; overflow-wrap: anywhere; }
  .portal-page--admin [data-responsive-table] .table-mobile td[data-label],
  .portal-page--admin [data-responsive-table].table-mobile td[data-label] { display: grid; grid-template-columns: minmax(6.5rem, 34%) minmax(0, 1fr); gap: .65rem; align-items: start; }
  .portal-page--admin [data-responsive-table] .table-mobile td[data-label]::before,
  .portal-page--admin [data-responsive-table].table-mobile td[data-label]::before { content: attr(data-label); color: var(--color-text-secondary); font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
  .portal-page--admin [data-responsive-table] .table-mobile td.text-right,
  .portal-page--admin [data-responsive-table].table-mobile td.text-right { text-align: left; }
  .portal-page--admin [data-responsive-table] .table-mobile td[colspan],
  .portal-page--admin [data-responsive-table].table-mobile td[colspan] { min-height: 10rem; text-align: center; }
  .portal-page--admin .list-filter-row--admin,
  .portal-page--admin .list-filter-row--admin-compact,
  .portal-page--admin .list-filter-row--admin-jobs { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .portal-page--admin .list-filter-row--admin-compact > * { min-width: 0 !important; width: 100%; }
}

@media (max-width: 1023px) {
  .list-filter-row--lead-filters .plumber-work-area-trigger { min-width: 0; }
  .list-filter-row--lead-filters .form-label { display: block; }
}

html.dark .list-filter-row--lead-filters .plumber-work-area-trigger {
  border-color: #475569;
  background: #1f2937;
  color: #f8fafc;
}

/* Final specificity guard: legacy plumber selectors must not change the
   shared toolbar layout or hide its labels/controls. */
.plumber-page .list-filter-panel--leads { padding: 0; }
.plumber-page .list-filter-panel--leads > .list-filter-panel__content { padding: 1rem; }
.plumber-page .list-filter-row--lead-filters .form-label { display: block; }
.plumber-page .list-filter-row--lead-filters .list-filter-actions__buttons .btn { min-width: 5.5rem; }

@media (max-width: 1023px) {
  .plumber-page .list-filter-panel--leads > .list-filter-panel__content { padding: .85rem; }
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control,
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control--search,
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control--workarea,
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control:not(.plumber-leads-filter-control--search):not(.plumber-leads-filter-control--workarea),
  .plumber-page .list-filter-row--lead-filters .list-filter-actions {
    grid-column: auto;
    grid-row: auto;
    width: auto;
  }
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control .form-input,
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control .form-select,
  .plumber-page .list-filter-row--lead-filters .plumber-work-area-trigger { min-height: var(--ui-control-height); }
}

/* Keep the compact phone layout last so it wins over legacy-specificity
   guards above. */
@media (max-width: 639px) {
  .plumber-page .list-filter-row--lead-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plumber-page .list-filter-row--lead-filters .list-filter-field--search,
  .plumber-page .list-filter-row--lead-filters .list-filter-actions { grid-column: 1 / -1; }
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control--workarea { grid-column: 1; }
  .plumber-page .list-filter-row--lead-filters .plumber-leads-filter-control:not(.plumber-leads-filter-control--search):not(.plumber-leads-filter-control--workarea) { grid-column: 2; }
  .plumber-page .list-filter-row--lead-filters .list-filter-field--sort { grid-column: 1 / -1; }
  .plumber-page .list-filter-row--lead-filters .form-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .plumber-page .list-filter-row--lead-filters .list-filter-actions__buttons { grid-template-columns: minmax(0, 1fr) minmax(4.5rem, auto); }
}

/* Keep the admin filter surface compact on tablet as well. The generic
   one-column fallback is useful for dense forms, but makes operational lists
   unnecessarily tall between phone and desktop widths. */
@media (min-width: 640px) and (max-width: 1023px) {
  .portal-page--admin .list-filter-row--admin,
  .portal-page--admin .list-filter-row--admin-compact,
  .portal-page--admin .list-filter-row--admin-jobs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
  }
  .portal-page--admin .list-filter-row--admin .list-filter-field--search,
  .portal-page--admin .list-filter-row--admin-compact .list-filter-field--search,
  .portal-page--admin .list-filter-row--admin-jobs .list-filter-field--search,
  .portal-page--admin .list-filter-row--admin .list-filter-actions,
  .portal-page--admin .list-filter-row--admin-compact .list-filter-actions,
  .portal-page--admin .list-filter-row--admin-jobs .list-filter-actions { grid-column: 1 / -1; }
}

/* Admin lists use the same compact mobile filter surface as the portals. */
@media (max-width: 639px) {
  .portal-page--admin .list-filter-panel__content { padding: .7rem; }
  .portal-page--admin .list-filter-row--admin,
  .portal-page--admin .list-filter-row--admin-compact,
  .portal-page--admin .list-filter-row--admin-jobs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
  }
  .portal-page--admin .list-filter-row--admin .list-filter-field--search,
  .portal-page--admin .list-filter-row--admin-compact .list-filter-field--search,
  .portal-page--admin .list-filter-row--admin-jobs .list-filter-field--search,
  .portal-page--admin .list-filter-row--admin .list-filter-actions,
  .portal-page--admin .list-filter-row--admin-compact .list-filter-actions,
  .portal-page--admin .list-filter-row--admin-jobs .list-filter-actions { grid-column: 1 / -1; }
  .portal-page--admin .list-filter-row--admin .form-label,
  .portal-page--admin .list-filter-row--admin-compact .form-label,
  .portal-page--admin .list-filter-row--admin-jobs .form-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .portal-page--admin .list-filter-row--admin .form-input,
  .portal-page--admin .list-filter-row--admin .form-select,
  .portal-page--admin .list-filter-row--admin-compact .form-input,
  .portal-page--admin .list-filter-row--admin-compact .form-select,
  .portal-page--admin .list-filter-row--admin-jobs .form-input,
  .portal-page--admin .list-filter-row--admin-jobs .form-select { min-height: 2.75rem; font-size: .75rem; }
  .portal-page--admin .list-filter-row--admin .list-filter-actions__buttons,
  .portal-page--admin .list-filter-row--admin-compact .list-filter-actions__buttons,
  .portal-page--admin .list-filter-row--admin-jobs .list-filter-actions__buttons { grid-template-columns: minmax(0, 1fr) minmax(4.5rem, auto); }
}

/* Keep the result sort compact on phones. The result summary owns this
   control, so it should read as a small utility row rather than another full
   width form card. The select remains 44px high for reliable touch input. */
@media (max-width: 639px) {
  .list-result-summary__side,
  .list-result-summary__actions,
  .customer-page .list-result-summary__side,
  .portal-page--admin .list-result-summary__side {
    width: auto;
    max-width: 100%;
    align-self: flex-end;
    margin-left: auto;
  }

  .list-inline-sort,
  .customer-page .list-inline-sort {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    align-items: center;
    grid-template-columns: none;
  }

  .list-inline-sort .form-select,
  .customer-page .list-inline-sort .form-select,
  .portal-page--admin .list-inline-sort .form-select {
    width: auto;
    min-width: 8.5rem;
    max-width: 11rem;
    min-height: 2.75rem;
    font-size: .8125rem;
  }

  .list-inline-sort__label { white-space: nowrap; }
}

/* Keep portal filters paired at intermediate widths. These final scoped rules
   intentionally win over legacy page-specific one-column fallbacks while
   preserving the same full-width search and action lanes as the phone layout. */
@media (min-width: 640px) and (max-width: 1023px) {
  .customer-page .list-filter-row--history,
  .plumber-page .list-filter-row--lead-filters,
  .plumber-page .list-filter-row--workspace-history {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
  }
  .customer-page .list-filter-row--history .list-filter-field--search,
  .customer-page .list-filter-row--history .list-filter-field--customer-status,
  .customer-page .list-filter-row--history .list-filter-actions,
  .plumber-page .list-filter-row--lead-filters .list-filter-field--search,
  .plumber-page .list-filter-row--lead-filters .list-filter-actions,
  .plumber-page .list-filter-row--workspace-history .list-filter-field--search,
  .plumber-page .list-filter-row--workspace-history .list-filter-actions { grid-column: 1 / -1; }
}

@media (max-width: 639px) {
  .customer-page .list-filter-row--history,
  .plumber-page .list-filter-row--workspace-history {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
  }
  .customer-page .list-filter-row--history .list-filter-field--search,
  .customer-page .list-filter-row--history .list-filter-field--customer-status,
  .customer-page .list-filter-row--history .list-filter-actions,
  .plumber-page .list-filter-row--workspace-history .list-filter-field--search,
  .plumber-page .list-filter-row--workspace-history .list-filter-actions { grid-column: 1 / -1; }
  .customer-page .list-filter-row--history .form-label,
  .plumber-page .list-filter-row--workspace-history .form-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .customer-page .list-filter-row--history .form-input,
  .customer-page .list-filter-row--history .form-select,
  .plumber-page .list-filter-row--workspace-history .form-input,
  .plumber-page .list-filter-row--workspace-history .form-select {
    min-height: 2.75rem;
    font-size: .75rem;
  }
  .customer-page .list-filter-row--history .list-filter-actions__buttons,
  .plumber-page .list-filter-row--workspace-history .list-filter-actions__buttons {
    grid-template-columns: minmax(0, 1fr) minmax(4.5rem, auto);
  }
}
