/* ADMIN sections (tabs with waiting counts), FEEDBACK, and the admin settings checks. */
.admin-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.admin-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border: 1px solid var(--c-grey-444);
  border-radius: 14px;
  color: var(--c-grey-aaa);
  font-size: 0.78rem;
  text-decoration: none;
  white-space: nowrap;
}

.admin-tab--active {
  border-color: var(--c-red);
  color: var(--c-red);
  font-weight: bold;
}

.admin-badge {
  min-width: 1.2em;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--c-red);
  color: var(--c-grey-050505);
  font-size: 0.68rem;
  font-weight: bold;
  text-align: center;
}

/* The plan picker on each account row: free or supporter, saved the moment it changes. */
.admin-plan {
  display: inline-block;
}

.admin-plan-select {
  height: 26px;
  padding: 2px 4px;
  border: 1px solid var(--c-grey-444);
  border-radius: 4px;
  background: var(--c-grey-050505);
  color: var(--c-white);
  font-family: inherit;
  font-size: 0.72rem;
  cursor: pointer;
}

/* Where an admin has got to with a piece of feedback, and their own notes on it. */
.admin-feedback-status {
  font-weight: bold;
}

.admin-feedback-status--in_progress {
  color: var(--c-amber);
}

.admin-feedback-status--done {
  color: var(--c-green);
}

.admin-feedback-notes {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--c-grey-333);
}

.admin-feedback-notes .alerts-field {
  margin-bottom: 6px;
}

.admin-feedback-meta,
.admin-feedback-device {
  color: var(--c-grey-aaa);
  font-size: 0.75rem;
}

.admin-feedback-meta strong {
  color: inherit;
}

.admin-feedback-message {
  margin: 6px 0;
  font-size: 0.9rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.admin-feedback-message p {
  margin: 0 0 6px;
}

.admin-feedback-device {
  margin-bottom: 8px;
  font-size: 0.62rem;
  overflow-wrap: anywhere;
}

.admin-feedback--done {
  opacity: 0.65;
}

.admin-checks {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  font-size: 0.85rem;
  line-height: 1.5;
}

.admin-check + .admin-check {
  margin-top: 4px;
}

.admin-check--fix {
  color: var(--c-amber);
}

.feedback-kinds {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin: 8px 0 10px;
  padding: 0;
  border: 0;
}

.feedback-kinds legend {
  width: 100%;
  margin-bottom: 4px;
}

.feedback-kind {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.85rem;
  cursor: pointer;
}

.feedback-message {
  box-sizing: border-box;
  width: 100%;
  min-height: 7rem;
  resize: vertical;
}

.feedback-error {
  color: var(--c-red);
}
