/* ============================================================
   主题皮肤 theme.css  v2 (2026-10-31)
   纯视觉层覆盖：不改业务逻辑 / 接口 / DOM。
   回滚：去掉 index.html 里 theme.css 的 <link>。
   ============================================================ */

:root {
  --brand: #00cb6a;
  --brand-deep: #009e53;
  --brand-grad: linear-gradient(135deg, #00d97c 0%, #00b862 100%);
  --brand-soft: rgba(0, 203, 106, 0.14);
  --bg-page: #f3f7f4;
  --text-1: #182420;
  --text-2: #5f7168;
  --text-3: #94a59c;
  --line: rgba(24, 60, 40, 0.10);
  --danger: #ff5b5b;
  --radius-card: 16px;
  --radius-input: 12px;
  --shadow-card: 0 6px 24px rgba(20, 70, 45, 0.08), 0 1px 3px rgba(20, 70, 45, 0.05);
  --shadow-btn: 0 6px 16px rgba(0, 203, 106, 0.32);
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
}

/* ---------- 全局 ---------- */
body {
  font-family: var(--font-ui);
  color: var(--text-1);
  background: linear-gradient(180deg, #edf6f0 0%, var(--bg-page) 260px) fixed;
  -webkit-font-smoothing: antialiased;
}
#app { min-height: 100vh; overflow-x: hidden; }
* { -webkit-tap-highlight-color: transparent; }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: rgba(24, 60, 40, 0.18); border-radius: 3px; }

/* ---------- Vant 组件 ---------- */
.van-field {
  background: #f5f8f6;
  border-radius: var(--radius-input);
  transition: box-shadow 0.2s ease, background 0.2s ease;
}
.van-field:focus-within {
  background: #fff;
  box-shadow: 0 0 0 3px var(--brand-soft);
}
.van-field__control { color: var(--text-1); font-variant-numeric: tabular-nums; }
.van-field__control::placeholder { color: var(--text-3); }
.van-field__label { color: var(--text-2); }

.van-button { border-radius: var(--radius-btn, 12px); font-weight: 600; }
.van-button--info,
.van-button--primary {
  background: var(--brand-grad);
  border: none;
  color: #fff;
  box-shadow: var(--shadow-btn);
}
.van-button--danger { background: var(--danger); border: none; }
.van-button:active { transform: scale(0.98); }

.van-cell::after { border-bottom-color: var(--line); }

.van-dialog {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(10, 40, 25, 0.22);
}
.van-dialog__header { font-weight: 700; color: var(--text-1); }
.van-dialog__message { color: var(--text-2); }
.van-dialog__confirm { color: var(--brand-deep); font-weight: 700; }

.van-tab { color: var(--text-2); font-weight: 500; }
.van-tab--active { color: var(--brand-deep); font-weight: 700; }
.van-tabs__line {
  background: var(--brand-grad) !important;
  border-radius: 3px;
  height: 4px !important;
}

.van-switch--on { background: var(--brand); }
.van-radio__icon--checked,
.van-checkbox__icon--checked { color: var(--brand); border-color: var(--brand); }

.van-toast { border-radius: 12px; }
.van-calendar { border-radius: 18px 18px 0 0; }
.van-calendar__selected-day { background: var(--brand-grad) !important; border-radius: 10px; }
.van-picker__confirm, .van-picker__cancel { color: var(--brand-deep); }

/* ---------- 登录页 (be5659ca) ----------
   group_3 = logo 图、text-wrapper_1 = 标题：保持原样不动。
   只精修输入框、验证码、登录按钮与页面背景。 */
[data-v-be5659ca] .text-wrapper_2,
[data-v-be5659ca] .text-wrapper_3 {
  border-radius: var(--radius-input) !important;
  border-color: rgba(24, 60, 40, 0.16) !important;
  box-shadow: 0 2px 10px rgba(20, 70, 45, 0.05) !important;
}
[data-v-be5659ca] .text-wrapper_2:focus-within,
[data-v-be5659ca] .text-wrapper_3:focus-within {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px var(--brand-soft) !important;
}

[data-v-be5659ca] .text-wrapper_4 {
  background-image: linear-gradient(135deg, #00d97c 0%, #00b862 100%) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-btn) !important;
}
[data-v-be5659ca] .text-wrapper_4:hover {
  background-image: linear-gradient(135deg, #00c96f 0%, #00a854 100%) !important;
}

[data-v-be5659ca] .captcha-container { box-sizing: border-box; max-width: 100%; }
[data-v-be5659ca] .captcha-image { flex: 0 0 auto; max-width: 38%; background: #fbfdfb; }
[data-v-be5659ca] .text-wrapper_captcha { flex: 1 1 0; min-width: 0; }

[data-v-be5659ca] .text_6,
[data-v-be5659ca] .text_7 { color: var(--brand-deep) !important; font-weight: 600; }

/* 桌面端登录页：整卡化 */
.desktop-login[data-v-be5659ca] .group_1,
.desktop-login[data-v-be5659ca] .group_6 { display: contents; }

/* ---------- 首页 (30cd4cd7) ---------- */
[data-v-30cd4cd7].page { padding-bottom: 40px; overflow-x: hidden; }

/* 用户信息条：白卡 + 品牌描边 */
[data-v-30cd4cd7] .section_2 {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-card) !important;
  box-shadow: var(--shadow-card) !important;
}
[data-v-30cd4cd7] .kefu_area {
  background: var(--brand-soft) !important;
  border-radius: 999px !important;
  padding: 6px 12px !important;
}
[data-v-30cd4cd7] .kefu_area .text_4 { color: var(--brand-deep) !important; font-weight: 600; }

/* 添加账号双按钮行（已内联样式，无需覆盖） */

/* 统计 chip / 提示 chip：原本无样式，补成卡片 */
[data-v-30cd4cd7] .added-count,
[data-v-30cd4cd7] .multi-gxy-tip {
  margin: 12px 16px 0 !important;
  padding: 12px 16px !important;
  background: #fff !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-card) !important;
  border: 1px solid var(--line) !important;
  box-sizing: border-box;
}
[data-v-30cd4cd7] .added-count-label { color: var(--text-2) !important; }
[data-v-30cd4cd7] .multi-gxy-tip strong { color: var(--text-1) !important; }
[data-v-30cd4cd7] .multi-gxy-tip span { color: var(--text-2) !important; }

/* 论文卡片微调 */
[data-v-30cd4cd7] .wechat-article-card { border: 1px solid var(--line) !important; }

/* ---------- 添加账号页 (2d73003e) ---------- */
[data-v-2d73003e] .h5-page {
  background:
    radial-gradient(120vw 46vh at 50% -6vh, rgba(0, 203, 106, 0.12), transparent 55%),
    var(--bg-page);
  min-height: 100vh;
}
[data-v-2d73003e] .form {
  background: #fff !important;
  border-radius: var(--radius-card) !important;
  box-shadow: var(--shadow-card) !important;
  border: 1px solid var(--line) !important;
}
[data-v-2d73003e] .field,
[data-v-2d73003e] .input,
[data-v-2d73003e] .select {
  background: #f5f8f6 !important;
  border-radius: var(--radius-input) !important;
  border: 1px solid transparent !important;
}
[data-v-2d73003e] .field:focus-within,
[data-v-2d73003e] .input:focus,
[data-v-2d73003e] .select:focus {
  background: #fff !important;
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px var(--brand-soft);
}
[data-v-2d73003e] .primary {
  background-image: var(--brand-grad) !important;
  color: #fff !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-btn) !important;
  border: none !important;
  font-weight: 700;
}
[data-v-2d73003e] .notice {
  background: rgba(0, 203, 106, 0.07) !important;
  border-radius: 14px !important;
  border: 1px dashed rgba(0, 168, 90, 0.35) !important;
  color: var(--text-2) !important;
}
[data-v-2d73003e] .notice-promo { color: var(--brand-deep) !important; font-weight: 700; }

/* ---------- 账号管理 (f96294d0) ---------- */
[data-v-f96294d0].page { background: transparent; padding-bottom: 48px; }

[data-v-f96294d0] .search-input,
[data-v-f96294d0] .search-button { border-radius: 12px !important; box-shadow: var(--shadow-card); }
[data-v-f96294d0] .search-button {
  background: var(--brand-grad) !important;
  color: #fff !important;
  border: none !important;
  font-weight: 600;
}

[data-v-f96294d0] .tab-container {
  background: #fff !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-card);
  padding: 4px !important;
  display: flex;
}
[data-v-f96294d0] .tab-item { border-radius: 10px !important; transition: all 0.2s ease; }
[data-v-f96294d0] .tab-item.active {
  background: var(--brand-grad) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(0, 203, 106, 0.3);
}

[data-v-f96294d0] .account-item {
  background: #fff !important;
  border-radius: var(--radius-card) !important;
  box-shadow: var(--shadow-card) !important;
  border: 1px solid var(--line) !important;
}
[data-v-f96294d0] .account-name { color: var(--text-1) !important; font-weight: 700; }
[data-v-f96294d0] .account-phone,
[data-v-f96294d0] .account-class,
[data-v-f96294d0] .account-plan { color: var(--text-2) !important; }

[data-v-f96294d0] .status-tag {
  border-radius: 999px !important;
  padding: 3px 10px !important;
  font-weight: 600;
}
[data-v-f96294d0] .status-active,
[data-v-f96294d0] .auth-status-ok {
  background: var(--brand-soft) !important;
  color: var(--brand-deep) !important;
}
[data-v-f96294d0] .status-expired,
[data-v-f96294d0] .renew-expired {
  background: rgba(255, 91, 91, 0.10) !important;
  color: var(--danger) !important;
}
[data-v-f96294d0] .remaining-days-tag {
  background: rgba(10, 110, 209, 0.08) !important;
  color: #0a6ed1 !important;
  border-radius: 999px !important;
  font-variant-numeric: tabular-nums;
}

[data-v-f96294d0] .action-btn { border-radius: 10px !important; font-weight: 600; }
[data-v-f96294d0] .action-btn.danger {
  background: rgba(255, 91, 91, 0.10) !important;
  color: var(--danger) !important;
}
[data-v-f96294d0] .submit-btn,
[data-v-f96294d0] .makeup-sign-button {
  background: var(--brand-grad) !important;
  color: #fff !important;
  border-radius: 12px !important;
  border: none !important;
  font-weight: 700 !important;
  box-shadow: var(--shadow-btn) !important;
}
[data-v-f96294d0] .submit-btn:disabled,
[data-v-f96294d0] .makeup-sign-button:disabled {
  background: #c9d4cd !important;
  box-shadow: none !important;
}
[data-v-f96294d0] .delete-confirm { background: var(--danger) !important; color: #fff !important; }

[data-v-f96294d0] .section-title,
[data-v-f96294d0] .section-header { color: var(--text-1) !important; font-weight: 700; }
[data-v-f96294d0] .form-section,
[data-v-f96294d0] .config-section,
[data-v-f96294d0] .report-container,
[data-v-f96294d0] .sign-config {
  background: #fff !important;
  border-radius: var(--radius-card) !important;
  box-shadow: var(--shadow-card) !important;
  border: 1px solid var(--line) !important;
}
[data-v-f96294d0] .calendar-day.selected {
  background: var(--brand-grad) !important;
  color: #fff !important;
  border-radius: 10px;
}
[data-v-f96294d0] .calendar-day.has-record .record-indicator { background: var(--brand) !important; }
[data-v-f96294d0] .plan-item { border-radius: 12px !important; border: 1px solid var(--line) !important; }
[data-v-f96294d0] .plan-item.checked {
  border-color: var(--brand) !important;
  background: var(--brand-soft) !important;
}
[data-v-f96294d0] .record-item {
  border-radius: 10px !important;
  background: #f7faf8 !important;
}
[data-v-f96294d0] .record-time .time { font-variant-numeric: tabular-nums; font-weight: 600; }
[data-v-f96294d0] .record-time .start { color: var(--brand-deep) !important; font-weight: 600; }
[data-v-f96294d0] .record-time .end { color: #e8890c !important; font-weight: 600; }
[data-v-f96294d0] .warning-message {
  background: rgba(232, 137, 12, 0.08) !important;
  border-radius: 10px !important;
  color: #b26a00 !important;
}
[data-v-f96294d0] .content-textarea,
[data-v-f96294d0] .textarea,
[data-v-f96294d0] .content-area {
  background: #f5f8f6 !important;
  border-radius: 12px !important;
}
[data-v-f96294d0] .content-textarea:focus,
[data-v-f96294d0] .textarea:focus,
[data-v-f96294d0] .content-area:focus {
  background: #fff !important;
  border-color: var(--brand) !important;
}

/* ---------- 通用 ---------- */
[class*="van-hairline--top"]::after { border-color: var(--line); }

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* ---------- 移动端布局修正 (2026-10-31) ---------- */
/* 登录页验证码行：窄屏下验证码图会溢出视口，这里强制收进容器 */
@media (max-width: 767px) {
  [data-v-be5659ca] .captcha-container {
    width: calc(100% - 32px) !important;
    max-width: 420px;
    margin: 14px auto 0 !important;
    box-sizing: border-box;
  }
  [data-v-be5659ca] .captcha-image {
    flex: 0 0 112px;
    width: 112px !important;
    height: 44px !important;
  }
  /* 登录页顶部横幅图在小屏的高度 */
  [data-v-be5659ca] .group_1 { height: min(96vw, 420px) !important; }
}

/* ---------- 全站横向溢出兜底 (2026-11-02) ---------- */
html, body { overflow-x: hidden !important; max-width: 100%; }
body { position: relative; }
#app, .page { max-width: 100vw; overflow-x: hidden; }
img, video, canvas, svg { max-width: 100%; }