.configuracoes-page {
  max-width: 56rem;
}

.configuracoes-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0 0 1rem;
}

.configuracoes-tab {
  border: 1px solid var(--df-border, #dce4dd);
  background: #fff;
  color: var(--df-ink, #1c2b26);
  border-radius: 0.4rem;
  padding: 0.4rem 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
}

.configuracoes-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--df-primary, #185e50) 12%, #fff);
  border-color: var(--df-primary, #185e50);
  color: var(--df-primary, #185e50);
}

.configuracoes-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75rem 0 0;
}

.configuracoes-table th,
.configuracoes-table td {
  padding: 0.55rem 0.45rem;
  border-bottom: 1px solid var(--df-border, #dce4dd);
  vertical-align: middle;
}

.configuracoes-table th {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--df-muted, #5b6d64);
}

.configuracoes-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.configuracoes-muted {
  color: var(--df-muted, #5b6d64);
  font-size: 0.875rem;
}

.configuracoes-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.configuracoes-return {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin: 0 0 1rem;
}

@media (max-width: 640px) {
  .configuracoes-row {
    grid-template-columns: 1fr;
  }
}