.account-tabs {
    margin-bottom: 15px;
}

.account-tabs a {
    display: inline-block;
    padding: 8px 12px;
    margin-right: 5px;
    border: 1px solid #ccc;
    text-decoration: none;
    border-radius: 5px;
}

.account-tabs a.active {
    background: var(--headerGradH);
    color: #fff;
}

.account-content {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

/* New */
/* ===== Account header (Welcome / Email / Go Out) ===== */
.form-box > h2,
.form-box > p {
  margin: 0;
}

/* 1) Делаем “Welcome” + “Email” + “Go Out” компактным блоком сверху */
.form-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* 2) Переупорядочим первые элементы (на случай если темы добавляют свои отступы) */
.form-box > h2 {
  font-size: 28px;
  line-height: 1.15;
}

.form-box > p:nth-of-type(1) { /* Email: ... */
  opacity: .9;
}

/* “Go Out” (ссылка) — пусть будет аккуратно под Email */
.form-box > p a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 10px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(0,0,0,.18);
}

.form-box > p a:hover {
  background: rgba(0,0,0,.28);
}


/* ===== Tabs layout ===== */

/* Весь блок табов — сразу под хедером */
#nl-tabs.nl-tabs {
  margin: 10px 0 0 !important;
}

/* Навигация табов: горизонтально, в одну линию (и перенос на мобиле) */
#nl-tabs .nl-tabs__nav {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;     /* на узких экранах перенос */
  gap: 10px !important;
  align-items: center !important;

  /* убираем “полоску снизу”, если не нужна */
  border-bottom: none !important;

  /* чтобы панель была под контент, а не "где-то" */
  margin: 0 0 12px 0 !important;
  padding: 0 !important;
}

/* Кнопки табов — одинаковой высоты и ширины по контенту */
#nl-tabs .nl-tabs__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 10px 16px !important;
  border-radius: 14px !important;

  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(0,0,0,.22) !important;
  color: #fff !important;

  /* убираем “tab-style” где кнопка поднята вверх */
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  top: 0 !important;

  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

/* Hover */
#nl-tabs .nl-tabs__btn:hover {
  background: rgba(0,0,0,.32) !important;
}

/* Активная вкладка */
#nl-tabs .nl-tabs__btn[aria-selected="true"] {
  background: var(--headerGrad, linear-gradient(90deg,#7fe6ff,#ff7a00)) !important;
  border-color: rgba(255,255,255,.20) !important;
}

/* Панель контента — под табами, без “ступеньки” */
#nl-tabs .nl-tabs__panel {
  border-radius: 16px !important;
  padding: 16px !important;

  background: rgba(0,0,0,.32) !important;

  border: 1px solid rgba(255,255,255,.18) !important;
}

/* Скрытые панели */
#nl-tabs .nl-hidden {
  display: none !important;
}


/* ===== Optional: на широких экранах можно сделать табы “как кнопки” в один ряд ===== */
@media (min-width: 900px) {
  #nl-tabs .nl-tabs__nav {
    flex-wrap: nowrap !important;
  }
}