:root {
  --haitaii-ink: #10252e;
  --haitaii-muted: #61727a;
  --haitaii-paper: #f2f7f6;
  --haitaii-card: #ffffff;
  --haitaii-teal: #007b82;
  --haitaii-teal-dark: #07545c;
  --haitaii-gold: #c28a32;
  --haitaii-line: #d9e4e3;
}

.woocommerce-account .site-main {
  overflow: visible;
}

.woocommerce-account .entry-content {
  color: var(--haitaii-ink);
}

.woocommerce-account .entry-header {
  display: none;
}

.haitaii-account-hero {
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 32px;
  align-items: center;
  overflow: hidden;
  margin: 0 0 30px;
  padding: clamp(28px, 5vw, 54px);
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 82% 14%, rgba(53, 194, 193, .3), transparent 18rem),
    linear-gradient(125deg, #10252e, #07545c 72%, #08777b);
  box-shadow: 0 24px 70px rgba(12, 48, 56, .16);
}

.haitaii-account-hero::after {
  content: "";
  position: absolute;
  right: -80px;
  bottom: -130px;
  width: 310px;
  height: 310px;
  border: 1px solid rgba(255, 255, 255, .16);
  transform: rotate(36deg);
  box-shadow: inset 0 0 0 52px rgba(255, 255, 255, .025), inset 0 0 0 104px rgba(255, 255, 255, .025);
}

.haitaii-account-hero > * {
  position: relative;
  z-index: 1;
}

.haitaii-account-eyebrow {
  margin: 0 0 8px;
  color: #e8c273;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .17em;
}

.haitaii-account-hero h1 {
  margin: 0 0 10px;
  color: #fff;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.12;
}

.haitaii-account-hero p:last-child {
  max-width: 640px;
  margin: 0;
  color: rgba(255, 255, 255, .72);
}

.haitaii-account-status {
  display: grid;
  grid-template-columns: 12px auto auto;
  gap: 13px;
  align-items: center;
  min-width: 290px;
  padding: 18px 20px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 14px;
  background: rgba(255, 255, 255, .09);
  backdrop-filter: blur(8px);
}

.haitaii-account-status small,
.haitaii-account-status strong {
  display: block;
}

.haitaii-account-status small {
  color: rgba(255, 255, 255, .62);
  font-size: 11px;
}

.haitaii-account-status strong {
  color: #fff;
  font-size: 15px;
}

.haitaii-status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #b8c4c8;
  box-shadow: 0 0 0 5px rgba(184, 196, 200, .15);
}

.haitaii-status-verified {
  background: #66d9ad;
  box-shadow: 0 0 0 5px rgba(102, 217, 173, .16);
}

.haitaii-status-pending {
  background: #f1bd62;
  box-shadow: 0 0 0 5px rgba(241, 189, 98, .16);
}

.haitaii-profile-score {
  padding-left: 18px;
  border-left: 1px solid rgba(255, 255, 255, .17);
}

.woocommerce-account .woocommerce-MyAccount-navigation {
  width: 25%;
}

.woocommerce-account .woocommerce-MyAccount-content {
  width: 71%;
}

.woocommerce-MyAccount-navigation ul {
  overflow: hidden;
  margin: 0;
  padding: 8px;
  border: 1px solid var(--haitaii-line);
  border-radius: 15px;
  background: var(--haitaii-card);
  box-shadow: 0 13px 36px rgba(24, 65, 71, .07);
}

.woocommerce-MyAccount-navigation li {
  margin: 0 !important;
  list-style: none;
  border: 0 !important;
}

.woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 11px 13px;
  border-radius: 9px;
  color: #324a52;
  font-size: 14px;
  font-weight: 650;
  text-decoration: none;
}

.woocommerce-MyAccount-navigation li.haitaii-menu-locked a {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  color: #718086;
  background: #f7f9f8;
}

.woocommerce-MyAccount-navigation li.haitaii-menu-locked a::after {
  content: "";
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  background-color: #8b9699;
  -webkit-mask: url("data:image/svg+xml,%3Csvg height='512' viewBox='0 0 24 24' width='512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12 13a1.49 1.49 0 0 0 -1 2.61v1.39a1 1 0 0 0 2 0v-1.39a1.49 1.49 0 0 0 -1-2.61zm5-4v-2a5 5 0 0 0 -10 0v2a3 3 0 0 0 -3 3v7a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-7a3 3 0 0 0 -3-3zm-8-2a3 3 0 0 1 6 0v2h-6zm9 12a1 1 0 0 1 -1 1h-10a1 1 0 0 1 -1-1v-7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg height='512' viewBox='0 0 24 24' width='512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m12 13a1.49 1.49 0 0 0 -1 2.61v1.39a1 1 0 0 0 2 0v-1.39a1.49 1.49 0 0 0 -1-2.61zm5-4v-2a5 5 0 0 0 -10 0v2a3 3 0 0 0 -3 3v7a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-7a3 3 0 0 0 -3-3zm-8-2a3 3 0 0 1 6 0v2h-6zm9 12a1 1 0 0 1 -1 1h-10a1 1 0 0 1 -1-1v-7a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover {
  color: var(--haitaii-teal-dark);
  background: #e9f4f2;
}

.haitaii-dashboard-intro {
  margin-bottom: 22px;
}

.haitaii-dashboard-intro h2,
.haitaii-profile-heading h2,
.haitaii-profile-state h2 {
  margin: 0 0 8px;
  font-size: clamp(27px, 3vw, 38px);
}

.haitaii-dashboard-intro p,
.haitaii-profile-heading p,
.haitaii-profile-state p {
  margin: 0;
  color: var(--haitaii-muted);
}

.haitaii-account-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.haitaii-account-card {
  position: relative;
  min-height: 210px;
  overflow: hidden;
  padding: 25px;
  border: 1px solid var(--haitaii-line);
  border-radius: 15px;
  background: var(--haitaii-card);
  box-shadow: 0 14px 34px rgba(23, 69, 74, .06);
}

.haitaii-card-mark {
  display: block;
  width: 42px;
  height: 7px;
  margin-bottom: 23px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--haitaii-gold), #e4bc71);
}

.haitaii-account-card h3 {
  margin: 0 0 8px;
  font-size: 20px;
}

.haitaii-account-card p {
  margin: 0 0 22px;
  color: var(--haitaii-muted);
  font-size: 14px;
}

.haitaii-account-card a {
  position: absolute;
  right: 24px;
  bottom: 22px;
  color: var(--haitaii-teal-dark);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.haitaii-account-card a span {
  margin-left: 7px;
}

.haitaii-account-card.is-locked {
  border-color: #d7dddc;
  background: #f1f3f3;
  box-shadow: none;
}

.haitaii-account-card.is-locked .haitaii-card-mark {
  background: #c4ccca;
}

.haitaii-account-card.is-locked h3 {
  color: #6f7b7f;
}

.haitaii-account-card.is-locked p {
  color: #929c9f;
}

.haitaii-account-card.is-locked a {
  color: #7f8b8e;
}

.haitaii-card-lock {
  position: absolute;
  top: 22px;
  right: 22px;
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid #cbd2d1;
  border-radius: 50%;
  background: #e7eae9;
}

.haitaii-card-lock svg {
  width: 16px;
  height: 16px;
  fill: #879295;
}

.haitaii-profile-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 25px;
}

.haitaii-profile-badge {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-radius: 99px;
  color: #176047;
  background: #e5f5ed;
  font-size: 12px;
  font-weight: 800;
}

.haitaii-profile-state {
  padding: clamp(28px, 5vw, 52px);
  border: 1px solid var(--haitaii-line);
  border-radius: 18px;
  background: linear-gradient(135deg, #fff, #f2f8f7);
}

.haitaii-profile-state .button {
  margin-top: 24px;
}

.haitaii-lock-notice {
  display: flex;
  gap: 6px 16px;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 24px;
  padding: 14px 16px;
  border: 1px solid #ead6aa;
  border-radius: 10px;
  color: #6d5327;
  background: #fff8e8;
  font-size: 13px;
}

.haitaii-lock-notice strong,
.haitaii-lock-notice span {
  display: block;
}

/* 两列几何刻意照抄 WooCommerce 原生表单，好让认证专区的字段和上面
   Woo 自己的字段左右边缘对齐 —— 它们现在同处一页，对不齐一眼就看出来。
   原生的做法是 .form-row{padding:3px} + first/last 各 47% 左右浮动，
   于是两列中间空出 6%（实测 60px）。我们原来是 1fr + 18px gap，
   列更宽、沟更窄，分栏线跟原生差着一截（实测：我们 516/1400、沟 18px；
   原生 519/1397、沟 60px）。下面这组值实测后与原生逐边重合。 */
.haitaii-profile-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 47%));
  justify-content: space-between;
  gap: 20px 0;
}

.haitaii-profile-field {
  min-width: 0;
  padding: 0 3px;   /* 对应原生 .form-row 的 3px */
}

.haitaii-profile-field.is-wide {
  grid-column: 1 / -1;
}

.haitaii-field-label {
  display: block;
  margin-bottom: 8px;
  color: #233b43;
  font-size: 13px;
  font-weight: 750;
}

.haitaii-field-label span {
  color: #b65a41;
}

.haitaii-profile-form input[type="text"],
.haitaii-profile-form input[type="tel"],
.haitaii-profile-form input[type="file"],
.haitaii-profile-form select,
.haitaii-profile-form textarea {
  width: 100%;
  min-height: 48px;
  padding: 10px 13px;
  border: 1px solid #cddcda;
  border-radius: 9px;
  color: var(--haitaii-ink);
  background: #fff;
}

.haitaii-profile-form textarea {
  min-height: 125px;
  resize: vertical;
}

.haitaii-profile-form input:focus,
.haitaii-profile-form select:focus,
.haitaii-profile-form textarea:focus {
  border-color: var(--haitaii-teal);
  outline: 3px solid rgba(0, 123, 130, .1);
}

.haitaii-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.haitaii-choice-grid label {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid var(--haitaii-line);
  border-radius: 9px;
  background: #f8fbfa;
  cursor: pointer;
}

.haitaii-choice-grid input {
  flex: 0 0 auto;
  margin-top: 4px;
}

.haitaii-choice-grid span {
  color: #344d54;
  font-size: 13px;
}

.haitaii-current-file {
  margin-bottom: 9px;
  padding: 10px 12px;
  border-radius: 8px;
  color: #38575d;
  background: #edf6f4;
  font-size: 13px;
}

.haitaii-profile-submit {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid var(--haitaii-line);
}

.haitaii-profile-submit span {
  color: var(--haitaii-muted);
  font-size: 12px;
}

@media (max-width: 900px) {
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content {
    float: none;
    width: 100%;
  }

  .woocommerce-account .woocommerce-MyAccount-navigation {
    margin-bottom: 24px;
  }

  .woocommerce-MyAccount-navigation ul {
    display: flex;
    overflow-x: auto;
    gap: 4px;
    padding: 6px;
    scrollbar-width: thin;
  }

  .woocommerce-MyAccount-navigation li {
    flex: 0 0 auto;
  }

  .woocommerce-MyAccount-navigation li a {
    white-space: nowrap;
  }
}

@media (max-width: 680px) {
  .haitaii-account-hero {
    display: block;
    padding: 28px 22px;
    border-radius: 15px;
  }

  .haitaii-account-status {
    grid-template-columns: 12px 1fr auto;
    min-width: 0;
    margin-top: 22px;
    padding: 14px;
  }

  .haitaii-account-grid,
  .haitaii-profile-fields,
  .haitaii-choice-grid {
    grid-template-columns: 1fr;
  }

  .haitaii-account-card {
    min-height: 190px;
  }

  .haitaii-profile-heading,
  .haitaii-profile-submit,
  .haitaii-lock-notice {
    display: block;
  }

  .haitaii-lock-notice span {
    margin-top: 4px;
  }

  .haitaii-profile-badge {
    display: inline-block;
    margin-top: 16px;
  }

  .haitaii-profile-submit span {
    display: block;
    margin-top: 12px;
  }
}

/* ── 「基本资料」页底部的认证资料专区 ──────────────────────────────
   内容原本是独立的「批发资料」页，现并入本页；靠一条分隔线 + 标题与
   WooCommerce 原生字段区隔开，字段网格复用上面的 .haitaii-profile-fields。 */
.haitaii-account-verification {
  margin: 34px 0 4px;
  padding-top: 28px;
  border-top: 2px solid var(--haitaii-line);
}

.haitaii-verification-heading h3 {
  margin: 0 0 6px;
  color: var(--haitaii-ink);
  font-size: 19px;
  line-height: 1.4;
}

.haitaii-verification-heading p {
  margin: 0 0 20px;
  color: var(--haitaii-muted);
  font-size: 13.5px;
  line-height: 1.7;
}

.haitaii-verification-note {
  margin: 18px 0 0;
  color: var(--haitaii-muted);
  font-size: 13px;
  line-height: 1.7;
}

/* ═══ 视觉统一：B2BKing 前台组件对齐站点主题 ═══════════════════════
   B2BKing 自带一套中性灰（按钮 #404040 / 表头 #646464 / 表体 #ebebeb），
   和本站青绿主题并排就像两个网站拼起来的。以下只在「我的账户」页覆盖
   它们的外观，不改 B2BKing 源码，插件升级不受影响。
   括号里是改之前用无头浏览器抓到的真实值。 */

/* 菜单项：原 padding 20px 上下 → 单项 68px、7 项撑到 494px，
   而右侧内容常常只有 240px 左右，左右严重失衡。收到约 52px。 */
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  padding: 13px 16px;
}

/* 空状态提示框：默认是 6px 近黑左边条（rgb(8,16,20)），在青绿页面里很扎眼。
   ⛔ 这里必须用 !important：GeneratePress 动态输出的内联样式写的是
   `border-left: 6px solid var(--contrast) !important`（文件里搜不到，是运行时生成的），
   不加同级 important 覆盖不掉。
   ⛔ 光加 important 还不够：GP 那条特异性与 `.woocommerce-account .woocommerce-info`
   相同，而它是内联样式、排在我们之后，同分时后者胜。所以这里再加一层
   容器选择器把特异性提到 (0,3,1)。两次实测才定位准，别退回两段式写法。 */
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
body.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-info,
body.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message {
  border-left-color: var(--haitaii-teal) !important;
}

/* B2BKing 区块标题：字号 30px、行高却只有 27px，中文上下会被压 */
.woocommerce-account #b2bking_myaccount_conversations_title,
.woocommerce-account #b2bking_myaccount_offers_title,
.woocommerce-account #b2bking_myaccount_bulkorder_title {
  line-height: 1.35;
}

/* 主按钮：发起新消息等（原 rgb(64,64,64) 深灰）。
   ⛔ 上一版这里用的是 --haitaii-teal(#007b82)，方向错了：那是本模块
   自己定义的变量，不是站点标准。站点按钮标准写在 GP 设置里 ——
   form_button_background_color = var(--accent)，hover = var(--accent-2)，
   文字 = var(--base-3)。Woo 原生按钮（保存更改 / 查看 / 再次下单）
   走的就是这一套，所以面板里的按钮一律向它对齐，青绿只留给装饰件。 */
.woocommerce-account button[id^="b2bking_myaccount"],
.woocommerce-account #b2bking_myaccount_make_inquiry_button,
.woocommerce-account .salesking_go_to_agent_dashboard_button {
  padding: 10px 20px;
  border-radius: 4px;
  background: var(--accent);
  color: var(--base-3);
  font-size: 15.3px;
  font-weight: 600;
  line-height: 1.1;
}

.woocommerce-account button[id^="b2bking_myaccount"]:hover,
.woocommerce-account #b2bking_myaccount_make_inquiry_button:hover,
.woocommerce-account .salesking_go_to_agent_dashboard_button:hover {
  background: var(--accent-2);
  color: var(--base-3);
}

/* 列表卡片：原 #ebebeb 灰底直角，与左栏白色圆角卡片不是一套 */
.woocommerce-account .b2bking_myaccount_individual_conversation_container,
.woocommerce-account .b2bking_myaccount_individual_offer_container {
  overflow: hidden;
  border: 1px solid var(--haitaii-line);
  border-radius: 12px;
  background: var(--haitaii-card);
}

/* 列表表头：原 rgb(100,100,100) 中灰 */
.woocommerce-account .b2bking_myaccount_individual_conversation_top,
.woocommerce-account .b2bking_myaccount_individual_offer_top {
  background: var(--haitaii-teal-dark);
}

/* 行内操作按钮：原 rgb(91,91,91)、圆角 3px、且 line-height 只有 8px
   （字号 15px 配 8px 行高，文字垂直方向被挤，这是 B2BKing 自己的问题） */
.woocommerce-account .b2bking_myaccount_individual_conversation_bottom a,
.woocommerce-account .b2bking_myaccount_individual_offer_bottom a {
  background: var(--accent);
  border-radius: 4px;
  color: var(--base-3);
  line-height: 1.6;
}

.woocommerce-account .b2bking_myaccount_individual_conversation_bottom a:hover,
.woocommerce-account .b2bking_myaccount_individual_offer_bottom a:hover {
  background: var(--accent-2);
}

/* ⛔ 这个 <a> 里还套了一个 <button>，button 自带 rgb(91,91,91) 灰底，
   会把外层 a 的主题色整个盖住 —— 只改 a 的话按钮看着还是灰的（实测踩过）。
   让它透明，由外层 a 出颜色。 */
.woocommerce-account .b2bking_myaccount_view_conversation_button,
.woocommerce-account .b2bking_myaccount_individual_conversation_bottom a > button,
.woocommerce-account .b2bking_myaccount_individual_offer_bottom a > button {
  padding: 0;          /* 外层 a 已经出内边距，这里再来一层会撑成双层按钮 */
  background: transparent;
  box-shadow: none;
  color: inherit;
}

/* 认证字段的输入控件对齐 WooCommerce 原生外观。
   原生：1px solid rgb(28,58,71) + 4px 圆角；我们原来是纯黑直角，
   下拉还带浏览器默认灰底 rgb(239,239,239)。
   两套样式原先分处两页看不出来，并进同一页后并排一比就很明显。 */
.woocommerce-account .haitaii-profile-field input[type="text"],
.woocommerce-account .haitaii-profile-field input[type="tel"],
.woocommerce-account .haitaii-profile-field input[type="email"],
.woocommerce-account .haitaii-profile-field input[type="number"],
.woocommerce-account .haitaii-profile-field input[type="date"],
.woocommerce-account .haitaii-profile-field input[type="file"],
.woocommerce-account .haitaii-profile-field select,
.woocommerce-account .haitaii-profile-field textarea {
  border-color: rgb(28, 58, 71);
  border-radius: 4px;
  background-color: #fff;
}

/* ⛔ 宽度也要跟上：Woo 原生字段有 .woocommerce-Input{width:100%}，
   我们这些没设 width，浏览器按默认字符数给了约 350px。两套字段原先
   分处两页看不出来，并进同一页后，「公司名称」这种整行字段的框只占
   左边四分之一、右边一大片空白，一眼就是没对齐。 */
.woocommerce-account .haitaii-profile-field input[type="text"],
.woocommerce-account .haitaii-profile-field input[type="tel"],
.woocommerce-account .haitaii-profile-field input[type="email"],
.woocommerce-account .haitaii-profile-field input[type="number"],
.woocommerce-account .haitaii-profile-field input[type="date"],
.woocommerce-account .haitaii-profile-field input[type="url"],
.woocommerce-account .haitaii-profile-field select,
.woocommerce-account .haitaii-profile-field textarea {
  width: 100%;
  max-width: 100%;
}

/* ═══ 间距统一 ═════════════════════════════════════════════════
   起因：用户指出「查看 / 再次下单」两个按钮贴在一起、代理按钮压着
   「采购工作台」标题。复查后发现不是孤立的两处 —— 整个面板缺一把
   统一的尺子，所以这里按页把相邻元素的间距逐对量过再定值。
   括号里是改之前用无头浏览器实测的数值。

   量法记录（别再用抽查代替）：先按 DOM 兄弟关系比一遍，再按屏幕上的
   视觉顺序比一遍。只比兄弟会漏掉跨容器插入的组件 —— 代理按钮那处
   就是 SalesKing 从另一个钩子插进来的，和标题不是兄弟，兄弟法测出来
   是「0 处异常」，视觉法才把它抓出来。
   ─────────────────────────────────────────────────────────── */

/* ── 订单表：操作列两个按钮之间实测 0.0px，看着像一个被切开的按钮 ──
   这里不用 flex：<td> 改成 flex 会脱离表格的列宽计算，把整张表的
   对齐搞乱。用 margin 最稳。 */
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button {
  margin: 3px 8px 3px 0;
}

.woocommerce-account .woocommerce-orders-table__cell-order-actions .button:last-child {
  margin-right: 0;
}

/* 划线原价与现价之间实测 3.4px，挤在一块不好认 */
.woocommerce-account .woocommerce-orders-table__cell-order-total del {
  margin-right: 7px;
}

/* ── 通知条里的按钮（订单页顶部「确认电子邮件地址」）─────────────
   实测 padding:0 / 高 22px，深蓝底紧箍着文字。根因是两条规则打架：
   GP 的 woocommerce.min.css 写了
     div.woocommerce-info a.button { background:0 0; padding:0 }
   本意是把通知条里的按钮做成纯文字链接；但站点按钮色设置又把背景
   填回了 --accent，于是「背景回来了、内边距没回来」。补齐外观。 */
.woocommerce-account div.woocommerce-info a.button,
.woocommerce-account div.woocommerce-message a.button,
.woocommerce-account div.woocommerce-error a.button {
  padding: 8px 18px;
  border-radius: 4px;
  background: var(--accent);
  color: var(--base-3);
  font-size: 15.3px;
  line-height: 1.3;
}

.woocommerce-account div.woocommerce-info a.button:hover,
.woocommerce-account div.woocommerce-message a.button:hover,
.woocommerce-account div.woocommerce-error a.button:hover {
  background: var(--accent-2);
  color: var(--base-3);
}

/* 通知条与下方内容实测 62px，偏散 */
.woocommerce-account .woocommerce-MyAccount-content > .woocommerce-info,
.woocommerce-account .woocommerce-MyAccount-content > .woocommerce-message {
  margin-bottom: 28px;
}

/* ── 仪表盘：SalesKing 的「前往销售代理仪表板」按钮 margin-bottom 为 0，
   直接压在「采购工作台」标题上（实测 0.0px）。 */
.woocommerce-account .salesking_go_to_agent_dashboard_button {
  margin-bottom: 26px;
}

/* ── 「基本资料」表单 ──────────────────────────────────────────
   实测：行与行 6px、label 与输入框 0px、说明文字贴着框 0px，
   整页挤成一团。
   ⛔ 选择器一律限定在 .woocommerce-form-row 内：认证专区的字段也在
   同一个 <form> 里，若直接写 `form label{display:block}`，会把单选/
   复选那些选项块的 label 一起打散，布局当场崩。 */
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row {
  margin-bottom: 20px;
}

/* label 字号字重也要统一：这一页上半段是 Woo 原生字段（label 18px 常规、
   星号正红），下半段是认证字段（13px / 750 / 星号 #b65a41）。两段上下
   相邻，字号差 5px、字重差一档、星号还两个颜色，一眼就是拼的。
   统一到认证区那套 —— 字段数上它是多数（15 : 7），而且 18px 是正文
   字号，拿来当表单标签偏大。
   ⛔ 选择器锁死在「基本资料」这一页，结账页等其它 Woo 表单不受影响。 */
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row > label {
  display: block;
  margin-bottom: 8px;
  color: #233b43;
  font-size: 13px;
  font-weight: 750;
}

.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row > label .required {
  color: #b65a41;
  text-decoration: none;
}

.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row > span em,
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row > em {
  display: block;
  margin-top: 6px;
}

/* 「修改密码」是个 fieldset，原来 legend 混在正文里，看不出是一组。
   ⛔ 用 `>` 限定直接子元素：认证专区若以后也用 fieldset，不会被误伤。 */
.woocommerce-account .woocommerce-EditAccountForm > fieldset {
  margin: 30px 0 0;
  padding-top: 22px;
  border-top: 1px solid var(--haitaii-line);
}

.woocommerce-account .woocommerce-EditAccountForm > fieldset legend {
  margin-bottom: 16px;
  padding: 0;
  color: var(--haitaii-ink);
  font-size: 17px;
  font-weight: 600;
}

/* 保存按钮原来紧贴上方的「必填项标有 *」说明（实测 4px） */
.woocommerce-account .woocommerce-EditAccountForm > p:last-of-type {
  margin-top: 26px;
}

/* ── 地址页：「账单地址 / 编辑」标题与地址正文之间实测 0.0px ── */
.woocommerce-account .woocommerce-Address-title {
  margin-bottom: 12px;
}

/* ── 手机端：认证字段在 680px 以下已经收成单列，但 Woo 原生的
   first/last 仍按 47% 两列排，于是同一页上半段是两个窄框、下半段是
   整行框，接缝又出来了；而且 390px 屏上 47% 只剩约 160px，中文姓名
   都填不下。这里让原生行也收成单列。 */
@media (max-width: 680px) {
  .woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row--first,
  .woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row--last {
    float: none;
    width: 100%;
  }
}