/* Page width + section rhythm (precedent: .person-form-page/.tree-page) */
.settings-page section {
  margin-block: var(--space-6);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-ivory);
}

.settings-page section h2 {
  margin-top: 0;
  color: var(--color-burgundy);
  font-family: var(--font-serif);
}

/* Badges — text labels, never color-only (owner vs editor must remain readable without color) */
.settings-badge {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  margin-inline-start: var(--space-2);
  border: 1px solid var(--color-wood-mid);
  border-radius: var(--radius-sm);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--color-wood-mid);
}

.settings-badge-owner {
  border-color: var(--color-burgundy);
  color: var(--color-burgundy);
}

.person-profile-permission-badge {
  display: inline-block;
  margin-block: var(--space-2);
  padding: 0.3rem 0.75rem;
  border: 1px solid var(--color-burgundy);
  border-radius: var(--radius-sm);
  color: var(--color-burgundy);
  font-weight: 700;
  font-size: 0.875rem;
}

/* Owned-people list (card-based, no table, mobile-first — precedent: .people-grid) */
.settings-owned-people-list {
  display: grid;
  gap: var(--space-4);
  margin: var(--space-4) 0 0;
  padding: 0;
  list-style: none;
}

.settings-owned-person-card {
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: white;
}

.settings-owned-person-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.settings-owned-person-header a {
  color: var(--color-burgundy);
  font-weight: 700;
  text-decoration: none;
}
.settings-owned-person-header a:hover {
  text-decoration: underline;
}

.settings-owned-person-header button {
  margin-inline-start: auto;
}

/* Editors panel */
.settings-editors-panel {
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.settings-editors-list {
  display: grid;
  gap: var(--space-3);
  margin: 0 0 var(--space-4);
  padding: 0;
  list-style: none;
}

.settings-editor-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) 0;
}

.settings-editor-identity {
  display: flex;
  flex-direction: column;
  margin-inline-end: auto;
}

.settings-editor-name {
  font-weight: 700;
}

.settings-editor-email {
  color: var(--color-wood-mid);
  font-size: 0.875rem;
}

.settings-editors-empty {
  color: var(--color-wood-mid);
}

.settings-revoke-confirm {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

/* Grant form */
.settings-grant-form {
  display: grid;
  gap: 0.4rem;
  max-width: 24rem;
}

.settings-grant-form input {
  min-height: 44px;
  width: 100%;
  padding: 0.7rem;
  border: 1px solid var(--color-wood-mid);
  border-radius: var(--radius-sm);
  background: white;
  color: inherit;
  font: inherit;
}