/* Profile & Settings pane — red/black theme, matches .t21-pane pattern. */

#pane-settings { padding-bottom: 40px; }

.set-card {
  background: #141417;
  border: 1px solid #232327;
  border-radius: 14px;
  padding: 16px;
  margin: 12px 0 16px;
}

.set-title {
  margin: 0 0 10px;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.2px;
}

.set-label {
  display: block;
  margin: 12px 0 6px;
  color: #d7d7dc;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.set-input {
  width: 100%;
  box-sizing: border-box;
  background: #0d0d0f;
  border: 1px solid #26262b;
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  padding: 12px 14px;
}

.set-input:focus {
  outline: none;
  border-color: var(--red, #e11d2e);
}

.set-btn {
  width: 100%;
  margin-top: 14px;
  border: 0;
  border-radius: 12px;
  padding: 13px 10px;
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
}

.set-btn:disabled { opacity: 0.55; }

.set-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.set-row b {
  display: block;
  color: #fff;
  font-size: 15px;
}

.set-row small, .set-hint {
  display: block;
  color: var(--muted, #9a9aa3);
  font-size: 13px;
  line-height: 1.45;
  margin-top: 4px;
}

.set-hint { margin: 10px 0 0; }

.set-switch {
  flex: 0 0 auto;
  width: 52px;
  height: 30px;
  border-radius: 30px;
  border: 1px solid #2c2c31;
  background: #1c1c20;
  position: relative;
  cursor: pointer;
  padding: 0;
}

.set-knob {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #6d6d75;
  transition: left 0.18s ease, background 0.18s ease;
}

.set-switch[aria-checked="true"] { background: #2a1416; border-color: var(--red, #e11d2e); }
.set-switch[aria-checked="true"] .set-knob { left: 25px; background: var(--red, #e11d2e); }

.set-danger { border-color: #4a1a1d; }

.set-delete {
  background: transparent;
  border: 1px solid var(--red, #e11d2e);
  color: var(--red, #e11d2e);
}

.set-delete:active { background: rgba(225, 29, 46, 0.12); }

/* Profile header — who you are + membership at a glance. */
.set-profile {
  display: flex; align-items: center; gap: 14px;
  background: #141417; border: 1px solid #232327;
  border-radius: 14px; padding: 16px; margin: 12px 0 4px;
}
.set-avatar {
  width: 52px; height: 52px; border-radius: 50%; flex: 0 0 52px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #e10600, #7a0300);
  color: #fff; font-size: 22px; font-weight: 800;
}
.set-id { flex: 1; min-width: 0; }
.set-id b { display: block; color: #fff; font-size: 17px; font-weight: 800; }
.set-id small { display: block; color: #9a9aa2; font-size: 13px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.set-mbadge {
  flex: 0 0 auto; font-size: 10px; font-weight: 800; letter-spacing: 1px;
  padding: 6px 10px; border-radius: 999px;
  background: rgba(255,255,255,0.06); color: #9a9aa2; border: 1px solid #2a2a2e;
}
.set-mbadge.pro { background: rgba(225,6,0,0.15); color: #ff6b62; border-color: #e10600; }
.set-mbadge.trial { background: rgba(34,197,94,0.12); color: #4ade80; border-color: #22c55e; }