/* ============================================================
   KPOP.WANG 内页浅色主题层  (CMS inner pages light theme)
   ------------------------------------------------------------
   背景：内页模板经 comm/head.html 引入 skin/css/style.css —— 那是一整套
         「暗黑金」皮肤（:root --bg:#07080C / --gold:#F5B041）。首页、
         客户中心、联系页、会员页都已浅色化，唯独 aboutus / news /
         product / case / job / gbook / search 等内页仍是黑金，与白底
         品牌蓝导航割裂。

   策略：本文件是**纯主题覆盖层**，只改颜色/边框/阴影，不改任何布局尺寸。
        - 只被 comm/head.html 引入 → 天然只作用于 CMS 内页，不牵连
          首页(index.html)、client/craft 物理静态页、操作台(design-editor)。
        - 放在 news-style.css 之后引入 → 同特异性后者胜，可安全压过
          style.css 的 !important 与 news-style.css 的文章排版。

   配色（与全站统一规范一致）
        底       #F7F8FA      面/卡片 #FFFFFF
        主文字   #1D2129      次文字 #4E5969      弱文字 #86909C
        边框     #E5E6EB      浅填充 #F2F3F5
        品牌蓝   #1677FF  →  #0958D9（渐变）
   ------------------------------------------------------------
   更新：2026-09-14 首版（内页黑金 → 白底品牌蓝）
   ============================================================ */

/* ---------- 1. 页面底色与基础文字 ---------- */
html,body{ background:#F7F8FA!important; color:#1D2129!important; }
body#category,body#article{ background:#F7F8FA!important; }

/* 只对内容区链接着色：绝不写全局 a{!important}，
   否则会盖掉 #kpnav / .kpmw- 等组件内链接的颜色（白底白字事故） */
.pages a,.jumbotron a,.media a,.figure a,.card a{ color:#1677FF; }
.content a,.kn-article a{ color:#1677FF; border-bottom:1px solid rgba(22,119,255,.32); }
.content a:hover,.kn-article a:hover{ color:#0958D9; }

/* ---------- 2. 头部大屏 jumbotron（原黑金渐变+金字） ---------- */
.jumbotron.jumbotron-fluid{
  background:linear-gradient(135deg,#EAF2FF 0%,#F7FAFF 52%,#EAF2FF 100%)!important;
  border-bottom:1px solid #E5E6EB!important;
}
.jumbotron .container.text-light,.jumbotron .container{ color:#1D2129!important; }
.jumbotron h1{ color:#1D2129!important; font-weight:700; letter-spacing:.5px; }
.jumbotron p{ color:#4E5969!important; }

/* ---------- 3. 当前位置 / 分类导航 ---------- */
.text-right.position,.position{ color:#86909C!important; }
.text-right.position a,.position a{ color:#4E5969; }
.text-right.position a:hover,.position a:hover{ color:#1677FF; }

/* ---------- 4. 标题 ---------- */
.pages h2.text-center.fs-sm-28.fs-20,
.content h2.fs-sm-28.fs-20,
.fs-sm-28{ color:#1D2129!important; font-weight:700!important; }
.text-secondary{ color:#4E5969!important; }
.border-bottom{ border-bottom:1px solid #E5E6EB!important; }
.border-top{ border-top:1px solid #E5E6EB!important; }
.border-right{ border-right:1px solid #E5E6EB!important; }
.border-info{ border-color:rgba(22,119,255,.45)!important; }
.border-bottom-dashed{ border-bottom:1px dashed #E5E6EB!important; }
.text-light{ color:#1D2129!important; }

/* ---------- 5. 按钮 ---------- */
.btn-info,.btn-primary{
  background:linear-gradient(135deg,#1677FF,#0958D9)!important;
  color:#FFFFFF!important; border-color:transparent!important;
  box-shadow:0 2px 8px rgba(22,119,255,.22)!important;
}
.btn-info:hover,.btn-primary:hover{ filter:brightness(1.06); color:#FFFFFF!important; }
.btn-light,.btn-secondary{
  background:#FFFFFF!important; color:#4E5969!important; border:1px solid #E5E6EB!important;
}
.btn-light:hover,.btn-secondary:hover{
  background:#F2F3F5!important; color:#1D2129!important; border-color:#D8DCE3!important;
}
.btn-danger{ background:#FFF1F0!important; color:#F5222D!important; border-color:#FFCCC7!important; }
.btn-success{ background:#F6FFED!important; color:#389E0D!important; border-color:#B7EB8F!important; }
.btn-link{ color:#1677FF!important; }

/* ---------- 6. 徽章 ---------- */
.badge-danger{ background:#FFF1F0!important; color:#F5222D!important; }
.badge-warning{ background:#FFF7E6!important; color:#D46B08!important; }
.badge-info{ background:rgba(22,119,255,.10)!important; color:#1677FF!important; }
.badge-light{ background:#F2F3F5!important; color:#4E5969!important; border:1px solid #E5E6EB!important; }
.badge-secondary{ background:#F2F3F5!important; color:#86909C!important; }
.bg-info{ background:rgba(22,119,255,.08)!important; color:#1677FF!important; }

/* ---------- 7. 卡片 ---------- */
.card{
  background:#FFFFFF!important; border:1px solid #E5E6EB!important;
  box-shadow:0 2px 12px rgba(29,33,41,.06)!important;
}
.card:hover{ border-color:#91CAFF!important; box-shadow:0 10px 26px rgba(22,119,255,.14)!important; }
.card-header{ background:#F7F8FA!important; color:#1D2129!important; border-bottom:1px solid #E5E6EB!important; }
.card-footer{ background:#F7F8FA!important; border-top:1px solid #E5E6EB!important; color:#86909C!important; }
.card-title{ color:#1D2129!important; font-weight:700; }
.card-text{ color:#4E5969!important; }
.card-img-top,.card-img-150,.card-img-200{ border-bottom:1px solid #E5E6EB; }
/* joblist 用 .card.bg-light：浅灰卡落在浅灰底上会糊，统一成白卡 */
.card.bg-light{ background:#FFFFFF!important; }
.bg-light{ background:#FFFFFF!important; color:#1D2129!important; }
.bg-white{ background:#FFFFFF!important; }
.bg-light .card-header,.bg-light .card-footer{ background:#F7F8FA!important; }
.shadow-sm{ box-shadow:0 2px 12px rgba(29,33,41,.06)!important; }

/* ---------- 8. 列表条目（newslist / tags 的 ul>li） ---------- */
.pages>ul>li{ border-bottom:1px dashed #E5E6EB!important; }
.pages>ul>li:hover{ background:#F7F8FA; }
.pages>ul>li>a{ color:#1D2129!important; }
.pages>ul>li>a:hover{ color:#1677FF!important; }
.pages>ul>li .fa,.pages>ul>li i{ color:#1677FF; }
.pages>ul>li .float-right{ color:#86909C!important; }

/* ---------- 9. 正文（.content） ---------- */
.content{ color:#4E5969; }
.content h1,.content h2,.content h3,.content h4{ color:#1D2129; }
.content img{ box-shadow:0 4px 18px rgba(29,33,41,.10); }
.content blockquote{
  border-left:3px solid #1677FF; background:#F7F8FA; color:#4E5969;
}
.content table{ background:#FFFFFF; box-shadow:0 2px 12px rgba(29,33,41,.06); }
.content th,.content td{ border:1px solid #E5E6EB; color:#4E5969; }
.content th{ background:#F7F8FA; color:#1D2129; }
.content code{ background:#F2F3F5; color:#1677FF; }

/* ---------- 10. 文章排版层 news-style.css（.kn-* 原为暗色） ---------- */
.kn-article{ color:#4E5969; }
.kn-article strong{ color:#1D2129; }
.kn-article em{ color:#1677FF; }
.kn-article h1{ color:#1D2129; }
.kn-article h2{
  color:#1D2129; border-bottom:2px solid rgba(22,119,255,.22);
}
.kn-article h3{ color:#1D2129; }
.kn-article li::marker{ color:#1677FF; }
.kn-tip{ background:#F0F5FF; border-left-color:#1677FF; color:#4E5969; }
.kn-callout{ background:#F7F8FA; border-left-color:#1677FF; color:#4E5969; }
.kn-warn{ background:#FFF1F0; border-left-color:#F5222D; color:#A8071A; }
.kn-table{ box-shadow:0 2px 12px rgba(29,33,41,.06); }
.kn-table th{ background:#F7F8FA; color:#1D2129; border-bottom:1px solid #E5E6EB; }
.kn-table td{ color:#4E5969; border-bottom:1px solid #E5E6EB; }
.kn-table tr:nth-child(even) td{ background:#FAFBFC; }
.kn-cta{
  background:linear-gradient(135deg,#F0F5FF 0%,#FFFFFF 100%); color:#1D2129;
  border:1px solid rgba(22,119,255,.18); box-shadow:0 8px 24px rgba(22,119,255,.08);
}
.kn-cta h3{ color:#1D2129; }
.kn-cta p{ color:#4E5969; }
.kn-cta-btn{
  background:linear-gradient(135deg,#1677FF 0%,#0958D9 100%); color:#FFFFFF!important;
  box-shadow:0 4px 14px rgba(22,119,255,.28);
}
.kn-cta-foot{ color:#86909C; }
.kn-cta-foot a{ color:#1677FF; }
.kn-num{ background:#1677FF; color:#FFFFFF; }
blockquote{ border-left-color:#1677FF; background:#F7F8FA; color:#4E5969; }
.kn-divider{ color:#C9CDD4; }
.kp-art18 .kp18-badge{ background:#F0F5FF; color:#1677FF; border:1px solid rgba(22,119,255,.25); }
.kp-art18 .kp18-sub{ color:#86909C; border-bottom:1px dashed #E5E6EB; }
.kp-art18 .kp18-modeltitle{ color:#1D2129; }

/* ---------- 11. 表单 ---------- */
.form-control,.input-group-text{
  background:#FFFFFF!important; color:#1D2129!important;
  border:1px solid #E5E6EB!important;
}
.form-control:focus{
  border-color:#1677FF!important; box-shadow:0 0 0 3px rgba(22,119,255,.12)!important;
}
.form-control::placeholder{ color:#86909C; }
label{ color:#4E5969; }

/* ---------- 12. 表格 / 评论 ---------- */
.table{ color:#4E5969; background:#FFFFFF; }
.table td,.table th{ border-color:#E5E6EB!important; }
.table thead th{ color:#1D2129; border-bottom:1px solid #E5E6EB!important; }
.media{ border-bottom:1px solid #E5E6EB!important; }
.media h6{ color:#1D2129!important; }
.media h6 strong{ color:#1677FF; }
.media .badge-light{ background:#F2F3F5!important; color:#86909C!important; border:1px solid #E5E6EB!important; }

/* ---------- 13. 模态框 ---------- */
.modal-content{ background:#FFFFFF!important; border:1px solid #E5E6EB!important; }
.modal-header,.modal-footer{ border-color:#E5E6EB!important; }
.modal-title{ color:#1D2129!important; }
.modal .close{ color:#86909C!important; }
.modal .close:hover{ color:#1677FF!important; }

/* ---------- 14. 分页 ---------- */
.page-item.page-link,.pagination .page-link{
  background:#FFFFFF!important; color:#4E5969!important; border:1px solid #E5E6EB!important;
}
.page-item.page-link:hover,.pagination .page-link:hover{
  background:#F2F3F5!important; color:#1677FF!important; border-color:#1677FF!important;
}
.pagebar .page-item,.pagebar .page-link{
  background:#FFFFFF!important; color:#4E5969!important; border:1px solid #E5E6EB!important;
}
.pagebar .page-item:hover{ color:#1677FF!important; border-color:#1677FF!important; }

/* ---------- 15. 图集卡片（caselist） ---------- */
.figure-caption{ color:#4E5969!important; }
.figure .card-img-200{ background:#F7F8FA; }
.tac{ color:#86909C!important; }

/* ---------- 16. 遗留的深色移动底栏（.kp-tabbar） ----------
   说明：现网移动底栏由 kp-mobile-tab.js 注入 .kp-mtab（已是白底），
   style.css 里的 .kp-tabbar 属历史遗留；一并浅色化，避免尾部页面误用。 */
.kp-tabbar{
  background:rgba(255,255,255,.97)!important; border-top:1px solid #E5E6EB!important;
  box-shadow:0 -6px 20px rgba(0,0,0,.06)!important;
}
.kp-tabbar__item{ color:#86909C!important; }
.kp-tabbar__item.is-active{ color:#1677FF!important; }
.kp-tabbar__item.is-active i{ text-shadow:none!important; }
.kp-tabbar__item.is-active::before{
  background:linear-gradient(90deg,#1677FF,#4096FF)!important; box-shadow:none!important;
}

/* ---------- 17. 滚动条 ---------- */
::-webkit-scrollbar-track{ background:#F7F8FA; }
::-webkit-scrollbar-thumb{ background:#D8DCE3; }
::-webkit-scrollbar-thumb:hover{ background:#C9CDD4; }

/* ---------- 18. 移动端微调 ---------- */
@media (max-width:767px){
  .jumbotron.jumbotron-fluid{ padding:34px 0 30px!important; }
  .jumbotron h1{ font-size:1.4rem!important; }
  .pages{ padding:22px 14px 34px; }
}