/* Trusted account lifecycle and responsive staff management. */

.admin-table-wrapper,
#playersTableWrapper {
  width: 100%;
  overflow-x: auto;
}

#playersTableWrapper .admin-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

#playersTableWrapper th,
#playersTableWrapper td {
  padding: 10px 8px;
  white-space: normal;
  overflow-wrap: anywhere;
  vertical-align: middle;
}

#playersTableWrapper th:nth-child(1),
#playersTableWrapper td:nth-child(1) {
  width: 18%;
}

#playersTableWrapper th:nth-child(2),
#playersTableWrapper td:nth-child(2) {
  width: 11%;
}

#playersTableWrapper th:nth-child(3),
#playersTableWrapper td:nth-child(3) {
  width: 8%;
}

#playersTableWrapper th:nth-child(4),
#playersTableWrapper td:nth-child(4),
#playersTableWrapper th:nth-child(5),
#playersTableWrapper td:nth-child(5) {
  width: 12%;
}

#playersTableWrapper th:nth-child(6),
#playersTableWrapper td:nth-child(6) {
  width: 9%;
}

#playersTableWrapper th:nth-child(7),
#playersTableWrapper td:nth-child(7) {
  width: 10%;
}

#playersTableWrapper th:nth-child(8),
#playersTableWrapper td:nth-child(8) {
  width: 8%;
}

#playersTableWrapper th:nth-child(9),
#playersTableWrapper td:nth-child(9) {
  width: 12%;
}

#playersTableWrapper td:last-child button {
  width: 100%;
  min-width: 0;
}

.account-lifecycle-grid {
  display: grid;
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(220px, 1fr)
    );
  gap: 16px;
}

.account-lifecycle-summary {
  display: grid;
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(160px, 1fr)
    );
  gap: 12px;
}

.account-lifecycle-summary article {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(233, 191, 92, .18);
  border-radius: 12px;
  background: rgba(7, 18, 38, .78);
}

.account-lifecycle-summary span {
  display: block;
  margin-bottom: 6px;
  color: rgba(229, 237, 247, .68);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.account-lifecycle-summary strong {
  display: block;
  color: #f7fbff;
  overflow-wrap: anywhere;
}

.account-lifecycle-warning {
  padding: 14px;
  border: 1px solid rgba(255, 178, 74, .48);
  border-radius: 12px;
  background: rgba(90, 48, 0, .22);
  color: #ffe1ad;
}

.account-lifecycle-danger {
  border-color: rgba(255, 95, 95, .54);
  background: rgba(83, 13, 25, .28);
  color: #ffc4cb;
}

.account-lifecycle-continue {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid rgba(83, 216, 255, .48);
  border-radius: 14px;
  background: rgba(7, 35, 57, .82);
}

.account-lifecycle-continue[hidden] {
  display: none;
}

.account-lifecycle-continue h3 {
  margin: 0 0 8px;
  color: #6ee7ff;
}

.account-lifecycle-continue p {
  margin: 0 0 14px;
}

#continueTrebleChasersButton {
  width: 100%;
}

@media (max-width: 1100px) {
  #playersTableWrapper .admin-table {
    font-size: .68rem;
  }

  #playersTableWrapper th,
  #playersTableWrapper td {
    padding: 8px 5px;
  }
}

@media (max-width: 760px) {
  #playersTableWrapper .admin-table {
    min-width: 860px;
  }

  .account-lifecycle-grid,
  .account-lifecycle-summary {
    grid-template-columns: 1fr;
  }
}

/* Focused protected Player deletion control. */

.account-delete-player-section {
  border-color: rgba(255, 105, 105, .42);
  background:
    linear-gradient(
      135deg,
      rgba(85, 15, 29, .22),
      rgba(7, 18, 38, .78)
    );
}

.account-delete-player-panel {
  display: grid;
  grid-template-columns:
    minmax(220px, .85fr)
    minmax(280px, 1.15fr);
  gap: 18px;
  align-items: start;
}

.account-delete-player-summary {
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(255, 105, 105, .38);
  border-radius: 13px;
  background: rgba(83, 13, 25, .26);
}

.account-delete-player-summary strong {
  display: block;
  margin-bottom: 7px;
  color: #ffc4cb;
  font-size: 1rem;
}

.account-delete-player-summary p,
.account-delete-player-actions p {
  margin: 0;
  color: rgba(237, 244, 252, .76);
  line-height: 1.45;
}

.account-delete-player-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 14px;
}

.account-delete-player-button {
  min-width: 170px;
  border-color: rgba(255, 105, 105, .72) !important;
  background: rgba(119, 20, 36, .76) !important;
  color: #fff !important;
}

.account-delete-player-button:not(:disabled):hover {
  background: rgba(155, 27, 48, .9) !important;
}

.account-delete-player-button:disabled {
  opacity: .48;
}

@media (max-width: 760px) {
  .account-delete-player-panel {
    grid-template-columns: 1fr;
  }

  .account-delete-player-actions {
    grid-column: auto;
    flex-direction: column;
    align-items: stretch;
  }

  .account-delete-player-button {
    width: 100%;
  }
}
