/* ziweiai.cn · 全站 UI 一致性与可用性收束 v1 · 2026-10-29
 * 加载在所有页面样式之后。保留品牌与业务布局，只修复确定性问题。
 */

/* 基础控件：统一字体、焦点和触控反馈 */
button, input, select, textarea { font-family: inherit; }
button, .btn, .pp-btn, .az-q-submit, .sa-chart-toggle { -webkit-tap-highlight-color: transparent; }
.btn { justify-content: center; line-height: 1.4; }
.btn-primary, .pp-btn, .az-q-submit { min-height: 46px; }
.prose, .card, .art-card, .info-card, .result-card, .six-tool-card { overflow-wrap: break-word; }

/* 截图回归：浅色深金按钮必须为浅字。新 URL 同时冲破旧 theme.css 缓存。 */
html[data-theme="light"] a.btn.btn-primary,
html[data-theme="light"] a.btn.btn-primary:hover,
html[data-theme="light"] a.btn.btn-primary:focus-visible,
html[data-theme="light"] .pp-btn,
html[data-theme="light"] .pp-btn:hover,
html[data-theme="light"] .pp-btn:focus-visible {
  color: #FDFBF5 !important;
}

/* 浅色卡片：边界清楚但不过重，避免深黑投影压脏宣纸底。 */
html[data-theme="light"] .pp-card { box-shadow: 0 18px 44px rgba(87, 66, 22, .10); }
html[data-theme="light"] .art-card {
  background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.08));
}
html[data-theme="light"] .six-tool-card,
html[data-theme="light"] .pp-card,
html[data-theme="light"] .az-question-card { border-color: rgba(110, 86, 34, .24); }

/* 结果页 nav 使用内联深色样式，必须用更高优先级完成浅色反转。 */
html[data-theme="light"] nav:not(.nav) {
  background: rgba(247, 243, 233, .96) !important;
  color: #3A2F73 !important;
  border-bottom: 1px solid rgba(58, 47, 115, .14) !important;
  box-shadow: 0 2px 14px rgba(58, 47, 115, .06) !important;
}
html[data-theme="light"] nav:not(.nav) a,
html[data-theme="light"] nav:not(.nav) span,
html[data-theme="light"] nav:not(.nav) div,
html[data-theme="light"] nav:not(.nav) button { color: #3A2F73 !important; }
html[data-theme="light"] nav:not(.nav) div[style*="rgba(255,255,255,.3)"] {
  border-color: rgba(58, 47, 115, .25) !important;
}
html[data-theme="light"] nav:not(.nav) #azBtn {
  color: #6B5320 !important;
  background: rgba(200, 162, 75, .14);
  border-color: rgba(160, 126, 45, .45);
}
html[data-theme="dark"] .error-card { background: #2A1B27; border-color: #A84C55; }
html[data-theme="dark"] .error-card h3 { color: #F09A9A; }

/* 表单与分段控件：统一 44px 触控目标。 */
.pp-card select, .pp-card input[type="text"], .pp-card input[type="number"] { min-height: 44px; }
.pp-seg label { min-height: 44px; display: flex; align-items: center; justify-content: center; }
.lang-menu .lang-item, .drop-menu a { min-height: 40px; }
.sa-chart-toggle { min-height: 40px; }

/* 登录/支付弹层：关闭按钮、输入框与长标题在手机上不互相挤压。 */
#azModal #azCard { max-height: min(86vh, 86dvh); border-radius: 20px; }
#azModal #azCard h3 { padding-right: 34px; }
#azModal #azCard .az-x {
  top: 4px; right: 6px; width: 40px; height: 40px; padding: 0;
  display: grid; place-items: center; border-radius: 50%;
}
#azModal #azCard .az-x:hover { background: rgba(127,127,127,.10); }

/* 文章页：sticky 导航已占文档流，不再重复计算一次导航高度。 */
.article { padding-top: 48px; }
.page-head { padding-top: 48px; }

/* 手机：标题之后立即出现表单，步骤说明移到表单之后。 */
@media (max-width: 940px) {
  .pp { padding-top: 40px; }
  .pp-grid { display: flex; flex-direction: column; gap: 0; }
  .pp-intro { display: contents; }
  .pp-intro > .eyebrow { order: 1; }
  .pp-intro > h1 { order: 2; }
  .pp-intro > .lead { order: 3; }
  .pp-card { order: 4; width: 100%; max-width: 560px; align-self: center; margin-top: 26px; padding: 22px 18px; }
  .pp-steps { order: 5; }
  .pp-note { order: 6; }
  .pp-card select, .pp-card input[type="text"], .pp-card input[type="number"],
  #azModal #azCard input, .az-question-card input, .az-question-card textarea {
    font-size: 16px; /* 防止 iOS 聚焦时自动放大 */
  }
  .theme-toggle { width: 40px; height: 40px; }
  .lang-btn { min-height: 40px; }
  .article { padding-top: 36px; }
  .page-head { padding-top: 36px; }
  .art-head { margin-bottom: 42px; }
  .info-card { padding: 20px 16px; }
  .zwc-tab { min-height: 36px; }
  .zwc-ln-it { min-height: 30px; display: inline-flex; align-items: center; justify-content: center; }
}

@media (max-width: 359px) {
  .hero-actions .btn { width: 100%; }
  .pp-card { padding-left: 14px; padding-right: 14px; }
}

/* 悬停位移只给真正支持悬停的设备，避免触屏粘滞。 */
@media (hover: none) {
  .card:hover, .art-card:hover, .six-tool-card:hover { transform: none; }
}

/* ============================================================
   移动端导航（2026-11-02 境内站新增）
   原模板在 960px 以下直接 .nav-links{display:none}，手机上点不到任何页面。
   这里改为两行：第一行品牌 + 主题按钮，第二行横向可滑动的链接。
   ============================================================ */
@media (max-width: 960px) {
  .nav { height: auto; }
  .nav .wrap {
    flex-wrap: wrap;
    row-gap: 8px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .nav-links {
    display: flex;
    order: 3;
    width: 100%;
    gap: 18px;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 2px;
  }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-links a {
    font-size: 13px;
    padding: 2px 0;
    flex: 0 0 auto;
  }
  .nav-links a[aria-current="page"] { color: var(--gold-400); }
}
