/* Compact admin layout. Add after the site's current stylesheets. */
.shell > main {
  max-width: none;
  padding: 20px 18px 28px;
}

.shell header {
  margin-bottom: 14px;
}

.shell > main > section,
.shell .admin-table {
  min-width: 0;
  max-width: 100%;
  padding: 14px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}

/* Override the older desktop overflow rule without changing button behavior. */
.shell > main > section.withdrawal-review {
  overflow-x: auto !important;
  overflow-y: auto !important;
}

.shell .toolbar {
  gap: 8px;
  margin-bottom: 12px;
}

.shell .toolbar input,
.shell .toolbar select,
.shell td input:not([type="checkbox"]):not([type="radio"]),
.shell td select {
  min-height: 34px;
  padding: 7px 8px;
}

.shell th,
.shell td {
  padding: 9px 7px;
  line-height: 1.45;
}

.shell .member-actions {
  flex-wrap: wrap;
}

@media (min-width: 901px) {
  .shell {
    grid-template-columns: 192px minmax(0, 1fr);
  }

  .shell > aside {
    padding: 18px 12px;
  }

  .shell > aside .brand {
    gap: 8px;
    margin: 0 2px 14px;
    font-size: 17px;
  }

  .shell > aside .brand::before {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    font-size: 17px;
  }

  .shell > aside button {
    min-height: 38px;
    margin: 2px 0;
    padding: 8px 12px;
  }
}

/* The merchant keyword placeholder is unique in the current server bundle.
   Scope by the toolbar so the same widths also apply to an empty result set. */
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table {
  width: 100%;
  min-width: 1280px;
  table-layout: fixed;
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th {
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  vertical-align: middle;
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(1) { width: 44px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(2) { width: 100px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(3) { width: 90px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(4) { width: 46px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(5) { width: 145px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(6) { width: 88px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(7) { width: 88px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(8) { width: 132px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(9) { width: 135px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(10) { width: 88px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(11) { width: 104px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(12) { width: 72px; }
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:nth-child(13) { width: 148px; }

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table td {
  overflow-wrap: anywhere;
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table td:is(:nth-child(1), :nth-child(4), :nth-child(12)) {
  white-space: nowrap;
  overflow-wrap: normal;
  font-variant-numeric: tabular-nums;
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table td input,
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table td select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table .muted {
  margin-top: 4px;
  line-height: 1.45;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Keep every permission control visible while the other columns scroll. */
.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table :is(th, td):last-child {
  position: sticky;
  right: 0;
  z-index: 1;
  background: #fff;
  box-shadow: -5px 0 7px -6px rgba(43, 32, 37, 0.35);
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) > table th:last-child {
  z-index: 2;
  background: var(--admin-soft, #fff4f5);
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) .op-buttons {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
}

.shell section:has(> .toolbar input[placeholder="搜索ID、昵称、手机号、邀请码、上级"]) .op-buttons button {
  width: 100%;
  min-height: 29px;
  margin: 0;
  padding: 5px 8px;
  line-height: 1.4;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .shell > main {
    padding: 74px 12px 24px;
  }

  .shell > main > section,
  .shell .admin-table {
    padding: 12px;
  }
}

@media (max-width: 600px) {
  .shell > main {
    padding-inline: 10px;
  }

  .shell > main > section,
  .shell .admin-table {
    padding: 10px;
  }
}