/**
 * 全站 PC / 移动端无缝自适应（断点与 breakpoints.css、td-viewport.js 一致：≤900 / ≥901）
 * 加载于 footer-theme 之后，用于统一留白、页脚栅格与浮动按钮避让。
 */
:root {
  --td-content-max: var(--td-bp-content-max, var(--content-max, 1200px));
}

/* 覆盖 style.css 1024px 两列页脚：平板与手机保持三列 */
@media (min-width: 561px) {
  .site-footer .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
  }
}

/* —— 移动端 ≤900px —— */
@media (max-width: 900px) {
  :root {
    --content-gutter: clamp(10px, 3.2vw, 18px);
    --hero-img-h: clamp(200px, 42vw, 380px);
    --section-gap: clamp(12px, 2.8vw, 18px);
  }

  .layout > .main,
  .layout .main {
    padding-bottom: max(76px, calc(var(--safe-bottom) + 60px)) !important;
  }

  .layout .main:has(> .home-three-rows-wrap:first-child),
  .layout .main:has(> .products-page-wrap:first-child) {
    padding-bottom: max(76px, calc(var(--safe-bottom) + 60px)) !important;
  }

  .site-footer-main {
    padding-left: max(var(--content-gutter), var(--safe-left));
    padding-right: max(var(--content-gutter), var(--safe-right));
    padding-bottom: max(20px, var(--safe-bottom));
  }

  .site-footer-bar {
    padding-left: max(var(--content-gutter), var(--safe-left));
    padding-right: max(var(--content-gutter), var(--safe-right));
    padding-bottom: max(14px, calc(var(--safe-bottom) + 8px));
    text-align: center;
  }

  .site-footer-bar .footer-bar-line1,
  .site-footer-bar .footer-bar-line2 {
    font-size: clamp(10px, 2.6vw, 12px);
    line-height: 1.45;
    word-break: break-word;
  }

  .site-footer .footer-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px clamp(6px, 2vw, 12px);
  }

  .site-footer .footer-col-title {
    margin-bottom: 6px;
    font-size: clamp(0.58rem, 2.4vw, 0.64rem);
    letter-spacing: 0.06em;
    line-height: 1.25;
  }

  .site-footer .footer-links {
    gap: 4px;
  }

  .site-footer .footer-links a {
    font-size: clamp(10px, 2.5vw, 11px);
    line-height: 1.32;
  }

  .home-section-heading,
  .home-three-rows-inner > .product-grid,
  .home-three-rows-inner > .home-load-more-wrap,
  .products-page-inner > .page-hero,
  .products-page-inner > .product-cat-nav,
  .products-page-inner > .product-grid,
  .products-page-inner > .home-load-more-wrap,
  .page-hero,
  .products-section-label,
  .product-cat-nav,
  .main > .product-grid,
  .home-load-more-wrap,
  .pd-breadcrumb,
  .pd-section,
  .pd-shop-card--ali .pd-buy-col,
  .pd-gallery-thumbs-bar {
    padding-left: max(var(--content-gutter), var(--safe-left)) !important;
    padding-right: max(var(--content-gutter), var(--safe-right)) !important;
  }

  .home-cat-nav .hcat-row {
    padding-left: var(--cat-nav-gutter, max(var(--content-gutter), var(--safe-left)));
    padding-right: max(var(--content-gutter), var(--safe-right));
    scroll-padding-inline: var(--cat-nav-gutter, max(var(--content-gutter), var(--safe-left)));
  }

  .site-footer-main .footer-grid,
  .site-footer-bar {
    padding-left: max(var(--content-gutter), var(--safe-left));
    padding-right: max(var(--content-gutter), var(--safe-right));
  }

  .footer-contact-block--lines {
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-size: clamp(10px, 2.6vw, 11px);
    line-height: 1.35;
  }

  .footer-contact-line {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 0 0.2em;
    min-width: 0;
  }

  .footer-contact-line__label {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .footer-contact-line__value {
    flex: 1 1 auto;
    min-width: 0;
    word-break: break-all;
    overflow-wrap: anywhere;
  }

  .footer-contact-line--address {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .footer-contact-line--address .footer-contact-line__value {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* 极窄屏：略收紧页脚字号，仍保持三列 */
@media (max-width: 400px) {
  .site-footer .footer-grid {
    gap: 8px 5px;
  }

  .site-footer .footer-links a {
    font-size: 10px;
  }

  .footer-contact-block--lines {
    font-size: 10px;
  }
}

/* —— 桌面端 ≥901px —— */
@media (min-width: 901px) {
  :root {
    --content-gutter: clamp(16px, 2.4vw, 32px);
    --hero-img-h: clamp(280px, 32vw, 560px);
    --page-pad: clamp(14px, 2vw, 24px);
    --section-gap: clamp(16px, 2.2vw, 24px);
  }

  .site-footer-main .footer-grid {
    max-width: var(--td-content-max);
    margin-inline: auto;
    gap: clamp(24px, 3vw, 32px) clamp(28px, 3.5vw, 40px);
  }

  .site-footer-bar {
    max-width: var(--td-content-max);
    margin-inline: auto;
    text-align: center;
  }

  .site-footer-main {
    padding-left: max(var(--content-gutter), var(--page-pad), var(--safe-left));
    padding-right: max(var(--content-gutter), var(--page-pad), var(--safe-right));
  }

  .site-footer-bar {
    padding-left: max(var(--content-gutter), var(--page-pad), var(--safe-left));
    padding-right: max(var(--content-gutter), var(--page-pad), var(--safe-right));
  }

  .home-section-heading {
    margin-top: var(--section-gap);
    padding-top: clamp(4px, 0.6vw, 8px);
  }

  .product-grid {
    gap: clamp(14px, 1.8vw, 20px);
  }
}

/* 内页（非首页/产品通栏/详情）桌面居中；左右留白仍由 public-fullbleed 子块 --content-gutter 负责 */
@media (min-width: 901px) {
  .layout .main:not(:has(> .home-three-rows-wrap:first-child)):not(:has(> .products-page-wrap:first-child)):not(:has(> #pd-root:first-child)) {
    max-width: var(--td-content-max) !important;
    margin-inline: auto;
    box-sizing: border-box;
  }
}

/* 我的账户：修改密码旁「忘记密码」 */
.account-info-line__value--pwd-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
}

.account-forgot-pwd-link {
  font-size: 13px;
  color: var(--accent2);
  text-decoration: none;
  line-height: 1.4;
}

.account-forgot-pwd-link:hover {
  text-decoration: underline;
}

.account-forgot-pwd-hint {
  margin: -2px 0 14px;
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
}

.account-forgot-pwd-hint a {
  color: var(--accent2);
  text-decoration: none;
  white-space: nowrap;
}

.account-forgot-pwd-hint a:hover {
  text-decoration: underline;
}

.forgot-from-account-note {
  margin: 0 0 14px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--muted);
  background: color-mix(in srgb, var(--accent2) 8%, var(--card));
  border: 1px solid color-mix(in srgb, var(--accent2) 22%, var(--border));
  border-radius: 8px;
}

.forgot-from-account-note a {
  color: var(--accent2);
  text-decoration: none;
}

.forgot-from-account-note a:hover {
  text-decoration: underline;
}

/* 登录页：分段切换（姓名 / 邮箱 / 手机） */
.auth-form-wrap--login {
  max-width: 420px;
}

.auth-login-mode-label {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.02em;
}

.auth-login-mode-row--segmented {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 16px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-sizing: border-box;
}

.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn,
.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn.btn,
.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn.btn-ghost {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 7px 2px !important;
  min-height: 34px !important;
  font-size: 12px !important;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-radius: 6px !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  opacity: 0.72;
  background: color-mix(in srgb, var(--border) 28%, transparent) !important;
  color: var(--muted) !important;
}

.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn--active,
.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn--active.btn,
.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn--active.btn-ghost {
  opacity: 1;
  background: color-mix(in srgb, var(--accent) 12%, var(--card)) !important;
  color: var(--accent) !important;
  border: none !important;
  box-shadow: none !important;
}

.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn:hover,
.auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn:focus-visible {
  border: none !important;
  box-shadow: none !important;
}

.auth-form-wrap--login .auth-login-block {
  margin-bottom: 2px;
}

.auth-form-wrap--login .form-row {
  margin-bottom: 14px;
}

.auth-form-wrap--login .btn-primary#btn-login {
  width: 100%;
  margin-top: 4px;
}

.auth-form-wrap--login .auth-form-links {
  text-align: center;
  margin-top: 16px;
  line-height: 1.5;
}

@media (max-width: 360px) {
  .auth-form-wrap--login .auth-login-mode-row--segmented .auth-login-mode-btn {
    font-size: 11px !important;
    padding: 6px 1px !important;
    min-height: 32px !important;
  }
}
