@charset "utf-8";
/**
 * custom.css —— 二次开发的样式主战场
 *
 * 这个文件被 _dev/apply.mjs 注入到全站 219 个页面的 </head> 之前，
 * 加载顺序在所有站点 CSS 之后，所以同等选择器可以直接覆盖；
 * 遇到内联 style 或高权重选择器，按需加 !important。
 *
 * 改完刷新页面即可（serve.mjs 有热刷新）。上线前记得：
 *   node _dev/apply.mjs --version <新的数字>
 */

/* ============================================================
 * 1. 设计变量：想换品牌色/圆角/间距，优先改这里
 * ============================================================ */
:root {
  --dk-primary: #5A57FD;          /* 站点主色，原值 #5A57FD */
  --dk-primary-dark: #4a47e8;
  --dk-text: #191919;
  --dk-text-sub: #666666;
  --dk-radius: .08rem;
  --dk-gap: .24rem;
  --dk-fab-size: 56px;
}

/* ============================================================
 * 2. 品牌色落地（改 --dk-primary 后这些组件自动跟随）
 *    custom.js 的 retheme 会做全站 CSS 规则级替换，
 *    这里补的是 retheme 覆盖不到的高权重选择器
 * ============================================================ */
.header-right a.login-btn {
  border-color: var(--dk-primary);
  color: var(--dk-primary);
}
.header-right a.login-btn:hover {
  background: var(--dk-primary);
  border-color: var(--dk-primary);
  color: #fff;
}
.header-right .get-quote,
.header-right .blog-header {
  background: var(--dk-primary);
  border-color: var(--dk-primary);
}
.header-right .el-input__inner:focus {
  border-color: var(--dk-primary);
}
.footer-center dl dd a,
.footer-center dl dd a:hover {
  background: var(--dk-primary);
}
.el-button--primary {
  background-color: var(--dk-primary);
  border-color: var(--dk-primary);
}
.el-button--primary:hover,
.el-button--primary:focus {
  background-color: var(--dk-primary-dark);
  border-color: var(--dk-primary-dark);
}

/* ============================================================
 * 3. 悬浮 CTA + 回到顶部（由 custom.js 动态创建，样式在这里）
 * ============================================================ */
#dk-fab {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 9998;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none;
}
#dk-fab > * {
  pointer-events: auto;
}
.dk-fab-cta {
  display: inline-flex;
  align-items: center;
  height: 44px;
  padding: 0 20px;
  border-radius: 22px;
  background: var(--dk-primary);
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(90, 87, 253, .35);
  transition: transform .15s ease, box-shadow .15s ease;
}
.dk-fab-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(90, 87, 253, .45);
}
.dk-fab-top {
  width: 40px;
  height: 40px;
  border: 1px solid #e5e5e5;
  border-radius: 50%;
  background: #fff;
  color: #333;
  font-size: 16px;
  line-height: 38px;
  text-align: center;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .08);
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
}
.dk-fab-top.dk-show {
  opacity: 1;
  visibility: visible;
}
@media screen and (max-width: 750px) {
  #dk-fab {
    right: 14px;
    bottom: 18px;
  }
  .dk-fab-cta {
    height: 40px;
    padding: 0 16px;
    font-size: 14px;
  }
}

/* ============================================================
 * 4. header 追加项（features.extraNav 打开后由 custom.js 插入）
 * ============================================================ */
.header-menu .dk-extra-nav > a.header-link {
  padding: 0 .18rem;
}
.dk-nav-badge {
  display: inline-block;
  margin-left: 4px;
  padding: 0 5px;
  border-radius: 6px;
  background: #ff4d4f;
  color: #fff;
  font-size: 10px;
  line-height: 16px;
  vertical-align: middle;
}

/* ============================================================
 * 5. 页脚补充信息
 * ============================================================ */
.dk-footer-note {
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.7;
  color: #8a8a8a;
}
.dk-footer-note a {
  color: var(--dk-primary);
  text-decoration: none;
}

/* ============================================================
 * 6. 常用改法示例（默认不生效，用的时候把注释去掉）
 * ============================================================ */

/* 隐藏首页某个区块
.home-banner { display: none !important; }
*/

/* 让内容区更宽
.container { max-width: 14rem; }
*/

/* 移动端隐藏搜索框
@media screen and (max-width: 750px) {
  .header-search { display: none !important; }
}
*/

/* 表格/文章正文排版微调
.blogdetail-container p { line-height: 1.9; }
*/

/* ============================================================
 * 7. 调试用：给所有图片加描边，确认哪些是懒加载失效
 * ============================================================ */
/*
img { outline: 1px solid rgba(255, 0, 0, .4); }
*/

/* ============================================================
 * 8. 登录页账号封禁提示（后端返回 code:-4 / result:'banned' 时出现）
 *    红字标题 + 黑字说明，位置在密码输入框正下方
 * ============================================================ */
.ban-tip {
  margin: .08rem 0 .02rem;
  padding: .1rem .14rem;
  border: 1px solid #F3C3C3;
  border-radius: .08rem;
  background: #FFF4F4;
  text-align: left;
}
.ban-tip .ban-title {
  margin: 0;
  color: #D20000;
  font-size: .17rem;
  font-weight: bold;
  line-height: 1.5;
  font-family: AliBold, -apple-system, "Microsoft YaHei", sans-serif;
}
.ban-tip .ban-desc {
  margin: .02rem 0 0;
  color: #1A1A1A;
  font-size: .15rem;
  line-height: 1.6;
}
@media screen and (max-width: 750px) {
  .ban-tip { padding: .16rem .2rem; }
  .ban-tip .ban-title { font-size: .34rem; }
  .ban-tip .ban-desc { font-size: .3rem; }
}