/* FRA Prop HQ v7.8.3 — account header separation and members scrolling */

/* Keep the Accounts Overview labels clearly separated from live account rows. */
#view-dashboard .accounts-panel .data-table thead,
#view-dashboard .accounts-panel .data-table thead tr {
  background: var(--panel-2) !important;
}

#view-dashboard .accounts-panel .data-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 12 !important;
  background: var(--panel-2) !important;
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border-strong) !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .22) !important;
}

/* Preserve the same clear table-header treatment on the full Accounts page. */
#view-accounts .data-table thead,
#view-accounts .data-table thead tr,
#view-accounts .data-table thead th {
  background: var(--panel-2) !important;
}

#view-accounts .data-table thead th {
  position: sticky;
  top: 0;
  z-index: 6;
  border-bottom-color: var(--border-strong) !important;
}

/* The owner Members directory now stays inside a fixed, independently scrollable box. */
#view-adminusers .admin-members-table-wrap {
  height: clamp(380px, 58vh, 620px) !important;
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: scroll !important;
  scrollbar-gutter: stable both-edges;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) var(--panel);
}

#view-adminusers .admin-members-table-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

#view-adminusers .admin-members-table-wrap::-webkit-scrollbar-track {
  background: var(--panel);
  border-left: 1px solid var(--border);
}

#view-adminusers .admin-members-table-wrap::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border: 2px solid var(--panel);
  border-radius: 999px;
}

#view-adminusers .admin-members-table-wrap::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--muted) 70%, var(--border-strong));
}

#view-adminusers .admin-members-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 8 !important;
  background: var(--panel-2) !important;
  border-bottom-color: var(--border-strong) !important;
  box-shadow: 0 6px 14px rgba(0, 0, 0, .18) !important;
}

@media (max-width: 720px) {
  #view-adminusers .admin-members-table-wrap {
    height: clamp(340px, 54vh, 540px) !important;
  }
}