@charset "utf-8";
/* ============================================================
   知识付费 · 品牌视觉系统（叠加在 style.css / member.css 之后加载）
   设计要点：珊瑚橙红主色 + 金色 ¥ 徽标 / 圆润大圆角 / 柔和投影 /
             聚焦发光 / 悬停浮起反馈 / 移动端自适应
   ============================================================ */

:root{
  --kb-p1:#FF7A45;          /* 主色·浅 */
  --kb-p2:#FF4D4F;          /* 主色·深 */
  --kb-grad:linear-gradient(135deg,#FF7A45 0%,#FF4D4F 100%);
  --kb-grad-soft:linear-gradient(135deg,rgba(255,122,69,.10) 0%,rgba(255,77,79,.10) 100%);
  --kb-gold:#FFD54F;        /* ¥ 徽标金 */
  --kb-ink:#0F172A;         /* 主文字 */
  --kb-ink2:#5B6478;        /* 次文字 */
  --kb-ink3:#98A2B3;        /* 弱文字 */
  --kb-line:#E9EDF3;        /* 描边 */
  --kb-bg:#F5F7FB;          /* 页面底色 */
  --kb-card:#FFFFFF;
  --kb-r:20px;              /* 大圆角 */
  --kb-rs:12px;             /* 小圆角 */
  --kb-sh:0 10px 30px rgba(15,23,42,.07);
  --kb-sh-h:0 18px 44px rgba(255,77,79,.18);
  --kb-ease:cubic-bezier(.22,.8,.28,1);
}

*{ box-sizing:border-box; }
body{
  background:var(--kb-bg);
  color:var(--kb-ink);
  font-family:"Microsoft Yahei","PingFang SC","Hiragino Sans GB","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ transition:color .2s var(--kb-ease); }

/* ============ 通用按钮 ============ */
.kb-btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:46px; padding:0 34px; border:0; border-radius:999px;
  background:var(--kb-grad); color:#fff !important;
  font-size:16px; font-weight:700; letter-spacing:1px; cursor:pointer;
  box-shadow:0 8px 20px rgba(255,77,79,.28);
  transition:transform .2s var(--kb-ease), box-shadow .2s var(--kb-ease), filter .2s var(--kb-ease);
}
.kb-btn:hover{ transform:translateY(-2px); box-shadow:var(--kb-sh-h); filter:saturate(1.06); }
.kb-btn:active{ transform:translateY(0); box-shadow:0 4px 12px rgba(255,77,79,.26); }
.kb-btn.ghost{
  background:#fff; color:var(--kb-p2) !important; border:1.5px solid rgba(255,122,69,.45);
  box-shadow:none;
}
.kb-btn.ghost:hover{ background:var(--kb-grad-soft); border-color:var(--kb-p2); }

/* ============ 登录 / 注册：两栏布局 ============ */
.kb-auth{
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  padding:40px 24px;
  background:
    radial-gradient(900px 480px at 12% -10%,rgba(255,122,69,.16),transparent 60%),
    radial-gradient(760px 420px at 92% 110%,rgba(255,213,79,.16),transparent 62%),
    var(--kb-bg);
}
.kb-auth .loginbg{ width:100%; height:auto; }

/* 左侧品牌区 */
.kb-brand{
  width:460px; flex:0 0 460px;
  padding:46px 42px;
  background:var(--kb-grad);
  border-radius:var(--kb-r) 0 0 var(--kb-r);
  color:#fff; position:relative; overflow-x:hidden; overflow-y:auto; max-height:94vh;
  box-shadow:var(--kb-sh);
}
.kb-brand::after{
  content:""; position:absolute; right:-70px; bottom:-90px;
  width:260px; height:260px; border-radius:50%;
  background:rgba(255,255,255,.10);
}
.kb-brand::before{
  content:""; position:absolute; left:-50px; top:-60px;
  width:180px; height:180px; border-radius:50%;
  background:rgba(255,255,255,.07);
}
.kb-brand .kb-logo-lg{
  display:block; height:60px; width:auto; margin-bottom:18px;
}
.kb-brandname{
  font-size:25px; font-weight:800; letter-spacing:3px; color:#fff; margin:0 0 20px;
}
.kb-slogan{ font-size:29px; font-weight:800; line-height:1.45; letter-spacing:1px; margin:0 0 12px; }
.kb-sub{ font-size:15px; line-height:1.85; color:rgba(255,255,255,.88); margin:0 0 28px; }
.kb-feats{ list-style:none; }
.kb-feats li{ padding:12px 0; border-top:1px solid rgba(255,255,255,.20); }
.kb-feats li:first-child{ border-top:0; }
.kb-feats b{ display:block; font-size:16px; font-weight:700; margin-bottom:3px; }
.kb-feats span{ font-size:13px; color:rgba(255,255,255,.80); }
.kb-brandfoot{
  margin-top:30px; font-size:12px; letter-spacing:2px;
  color:rgba(255,255,255,.62);
}

/* 右侧表单区 */
.kb-panel{ flex:1 1 auto; display:flex; justify-content:center; }
.kb-card{
  width:100%; max-width:520px; padding:46px 48px;
  background:var(--kb-card); border-radius:0 var(--kb-r) var(--kb-r) 0;
  box-shadow:var(--kb-sh);
}
.kb-h2{
  font-size:26px; font-weight:800; color:var(--kb-ink);
  text-align:center; margin:0 0 6px; letter-spacing:1px;
}
.kb-hint{ text-align:center; color:var(--kb-ink3); font-size:14px; margin:0 0 28px; }

/* 覆盖老样式：标题与表单容器 */
.kb-card .login{ width:auto; height:auto; margin:0 0 4px; }
.kb-card .login p{ padding:0; color:var(--kb-ink); font-size:26px; font-weight:800; text-align:center; }
.kb-card .loginBOX{ width:auto; margin:0; }
.kb-card .m_Bleft{ width:auto; padding-bottom:0; margin:0; }
.kb-card .m_Bleft ul{ width:100%; margin:0; }
.kb-card .m_Bleft ul li{
  width:100%; height:52px; line-height:52px; margin:0 0 14px;
  padding:0 16px; border-radius:var(--kb-rs);
  background:#F6F8FB; border:1.5px solid transparent;
  transition:border-color .2s var(--kb-ease), box-shadow .2s var(--kb-ease), background .2s var(--kb-ease);
}
.kb-card .m_Bleft ul li:hover{ background:#fff; border-color:rgba(255,122,69,.35); }
.kb-card .m_Bleft ul li:focus-within{
  background:#fff; border-color:var(--kb-p1);
  box-shadow:0 0 0 4px rgba(255,122,69,.13);
}
.kb-card .m_Bleft ul li i{
  width:34px; height:22px; margin-right:14px; padding:0;
  border-right:0; text-align:left; float:left; opacity:.75;
}
.kb-card .m_Bleft ul li i img{ width:20px; height:20px; }
.kb-card .m_Bleft ul li input{
  float:left; height:50px; width:calc(100% - 48px); padding-left:0;
  line-height:50px; border:0; background:none; font-size:15px; color:var(--kb-ink);
  font-weight:600;
}
.kb-card .m_Bleft ul li input::placeholder{ color:#A9B2C1; font-weight:400; }
.kb-card .m_Bleft ul li input:focus{ outline:none; }
.kb-card .m_Bleft span{ height:auto; margin:6px 0 0; text-align:center; }
.kb-card .m_Bleft span input[type="submit"]{
  width:100%; height:48px; line-height:48px; border-radius:999px;
  background:var(--kb-grad); color:#fff; font-size:16px; font-weight:700; letter-spacing:2px;
  border:0; cursor:pointer;
  box-shadow:0 8px 20px rgba(255,77,79,.28);
  transition:transform .2s var(--kb-ease), box-shadow .2s var(--kb-ease);
}
.kb-card .m_Bleft span input[type="submit"]:hover{ transform:translateY(-2px); box-shadow:var(--kb-sh-h); }
.kb-card .m_Bleft span input[type="submit"]:active{ transform:translateY(0); }
.kb-card .m_Bleft span a,
.kb-card .m_Bleft span font{ color:var(--kb-p2) !important; font-weight:700; }
.kb-card .m_Bleft span a:hover{ color:var(--kb-p1); }
.kb-card #yhm_a{ font-size:13px !important; font-weight:600; }

/* ============ 会员中心顶栏 ============ */
.kb-topbar{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--kb-line);
  box-shadow:0 4px 18px rgba(15,23,42,.05);
}
.kb-topbar-inner{
  max-width:1240px; margin:0 auto; padding:0 24px;
  height:76px; display:flex; align-items:center; gap:18px;
}
.kb-topbar .kb-logo{ height:38px; width:auto; display:block; }
.kb-topbar .kb-meta{ flex:1 1 auto; }
.kb-topbar .kb-meta .kb-contact{ font-size:13px; color:var(--kb-ink3); line-height:1.6; }
.kb-topbar .kb-meta .kb-contact b{ color:var(--kb-p2); font-weight:700; }
.kb-topbar .kb-user{
  display:flex; align-items:center; gap:10px;
  padding:7px 16px; border-radius:999px; background:var(--kb-grad-soft);
  font-size:14px; font-weight:700; color:var(--kb-ink);
}
.kb-topbar .kb-user .kb-avatar{
  width:30px; height:30px; border-radius:50%; background:var(--kb-grad);
  color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:800; box-shadow:0 4px 10px rgba(255,77,79,.28);
}
.kb-topbar .kb-logout{
  padding:8px 18px; border-radius:999px; background:#fff;
  border:1.5px solid var(--kb-line); color:var(--kb-ink2) !important;
  font-size:13px; font-weight:700;
  transition:all .2s var(--kb-ease);
}
.kb-topbar .kb-logout:hover{ border-color:var(--kb-p2); color:var(--kb-p2) !important; transform:translateY(-1px); }

/* ============ 内容容器 / 卡片 ============ */
.kb-container{ max-width:1240px; margin:0 auto; padding:28px 24px 60px; }
.kb-panel-card{
  background:var(--kb-card); border-radius:var(--kb-r); box-shadow:var(--kb-sh);
  padding:26px 28px; margin-bottom:22px; border:1px solid rgba(233,237,243,.8);
}
.kb-panel-card h3{
  margin:0 0 16px; font-size:19px; font-weight:800; color:var(--kb-ink);
  padding-left:12px; border-left:4px solid var(--kb-p2); line-height:1.2;
}
.kb-panel-card table{ width:100%; border-collapse:collapse; }
.kb-panel-card table th{
  text-align:left; font-size:13px; font-weight:700; color:var(--kb-ink2);
  padding:12px 14px; background:#F7F9FC; border-bottom:1px solid var(--kb-line);
}
.kb-panel-card table td{ padding:13px 14px; font-size:14px; border-bottom:1px solid #F1F4F8; }
.kb-panel-card table tr:hover td{ background:#FBFCFE; }

/* 按钮与链接 */
.kb-panel-card a{ color:var(--kb-p2); font-weight:600; }
.kb-panel-card a:hover{ color:var(--kb-p1); }
.kb-panel-card input[type="submit"], .kb-panel-card .btn{
  height:38px; line-height:38px; padding:0 22px; border:0; border-radius:999px;
  background:var(--kb-grad); color:#fff !important; font-size:14px; font-weight:700; cursor:pointer;
  box-shadow:0 6px 16px rgba(255,77,79,.24);
  transition:transform .2s var(--kb-ease), box-shadow .2s var(--kb-ease);
}
.kb-panel-card input[type="submit"]:hover, .kb-panel-card .btn:hover{ transform:translateY(-2px); box-shadow:var(--kb-sh-h); }

/* ============ 提示页 ============ */
.kb-msg{
  max-width:520px; margin:80px auto; padding:44px 40px;
  background:#fff; border-radius:var(--kb-r); box-shadow:var(--kb-sh); text-align:center;
}
.kb-msg .kb-emoji{
  width:88px; height:88px; margin:0 auto 22px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:42px; font-weight:800; color:#fff; background:var(--kb-grad);
  box-shadow:0 12px 28px rgba(255,77,79,.30);
}
.kb-msg .kb-emoji.err{ background:linear-gradient(135deg,#FFA751 0%,#FF5F5F 100%); }
.kb-msg h1{ font-size:22px; font-weight:800; color:var(--kb-ink); margin:0 0 10px; line-height:1.5; }
.kb-msg .kb-tip{ font-size:14px; color:var(--kb-ink3); margin:0 0 26px; }
.kb-msg .kb-tip b{ color:var(--kb-p2); font-weight:700; }

/* ============ 移动端 ============ */
@media (max-width:900px){
  .kb-auth{ padding:20px 14px; }
  .kb-brand{ display:none; }
  .kb-card{ max-width:520px; border-radius:var(--kb-r); padding:34px 26px; }
  .kb-topbar-inner{ height:auto; padding:14px 16px; flex-wrap:wrap; }
  .kb-container{ padding:18px 14px 40px; }
}
@media (min-width:901px){
  #divMobile{ display:none !important; }
}

/* ============ 登录左侧：演示视频 + 赚钱四步 ============ */
.kb-video{ margin:18px 0 16px; }
.kb-video video{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:14px; background:#15151a; display:block; box-shadow:0 12px 26px rgba(0,0,0,.20); }
.kb-earn{ margin:4px 0 16px; }
.kb-earn-h{ font-size:16px; font-weight:800; margin:0 0 10px; }
.kb-earn-steps{ list-style:none; margin:0; padding:0; }
.kb-earn-steps li{ display:flex; gap:10px; align-items:flex-start; padding:8px 0; border-top:1px solid rgba(255,255,255,.16); }
.kb-earn-steps li:first-child{ border-top:0; }
.kb-step{ flex:0 0 22px; height:22px; border-radius:50%; background:rgba(255,255,255,.20); color:#fff; font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; margin-top:1px; }
.kb-earn-steps b{ font-size:14px; }
.kb-earn-steps li > div{ font-size:13px; color:rgba(255,255,255,.88); line-height:1.5; }
.kb-earn-note{ font-size:12.5px; color:rgba(255,255,255,.80); margin:10px 0 0; line-height:1.6; }

/* 移动端登录：演示视频与引导 */
.m-video{ margin:0 0 14px; }
.m-video video{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:14px; background:#15151a; display:block; }
.m-lead{ text-align:center; font-size:16px; font-weight:800; color:var(--kb-ink); margin:0 0 18px; letter-spacing:1px; }

/* ============================================================
   卖家内部后台（个人中心 / 修改资料 / 图片管理 / 上传 / 文件管理 / 推广 / 改密）
   覆盖原 #left(黑边) / #right / .menu(红字) / .table 的粗糙样式，统一品牌语言
   ============================================================ */

/* 两栏布局 */
#left{
  float:left; width:212px;
  background:var(--kb-card); border:1px solid rgba(233,237,243,.85);
  border-radius:var(--kb-r); box-shadow:var(--kb-sh);
  padding:16px 12px; margin:24px 0 24px;
}
#right{ margin:24px 0 0 236px; }

/* 左侧菜单 */
.menu{ list-style:none; margin:0; padding:0; line-height:1.6; }
.menu a{
  display:block; padding:11px 16px; margin:3px 0;
  border-radius:var(--kb-rs); color:var(--kb-ink2);
  font-size:15px; font-weight:600; text-decoration:none;
  transition:background .2s var(--kb-ease), color .2s var(--kb-ease), transform .2s var(--kb-ease);
}
.menu a:hover{ background:var(--kb-grad-soft); color:var(--kb-p2); transform:translateX(2px); }
.menu a.show{
  background:var(--kb-grad); color:#fff !important;
  box-shadow:0 8px 18px rgba(255,77,79,.26);
}
.menu a.show:hover{ color:#fff !important; }
#downmenu1{ padding-left:6px; }
#downmenu1 a{ font-size:14px; padding:9px 14px; margin:2px 0; }

/* 右侧内容：表格卡片化 */
#right table{
  width:100%; max-width:100%; border-collapse:separate; border-spacing:0;
  background:var(--kb-card); border:1px solid rgba(233,237,243,.85);
  border-radius:var(--kb-r); box-shadow:var(--kb-sh); overflow:hidden;
}
#right table th, #right table td{
  padding:13px 16px; font-size:14px; color:var(--kb-ink); vertical-align:middle;
  border-bottom:1px solid #F1F4F8;
}
#right table tr:last-child td{ border-bottom:0; }
#right table th{ text-align:left; background:#F7F9FC; color:var(--kb-ink2); font-weight:700; font-size:13px; }
#right table tbody tr:hover td{ background:#FBFCFE; }
#right table caption{ padding:0 0 12px; color:var(--kb-ink); }

/* 表单元素 */
#right label{ font-weight:600; color:var(--kb-ink2); }
#right .input_text{ color:var(--kb-ink); }
#right input[type=text], #right input[type=file], #right select, #right .form-control{
  display:inline-block; border:1.5px solid var(--kb-line); border-radius:var(--kb-rs);
  padding:8px 12px; font-size:14px; color:var(--kb-ink); background:#fff;
  transition:border-color .2s var(--kb-ease), box-shadow .2s var(--kb-ease);
}
#right input:focus, #right select:focus, #right .form-control:focus{
  border-color:var(--kb-p1); box-shadow:0 0 0 4px rgba(255,122,69,.13); outline:none;
}

/* 按钮统一（覆盖 bootstrap btn-primary / btn-info 与裸 button） */
#right .btn-primary, #right button{
  background:var(--kb-grad); border:0; border-radius:999px; color:#fff !important;
  font-size:14px; font-weight:700; padding:10px 22px; cursor:pointer;
  box-shadow:0 6px 16px rgba(255,77,79,.24);
  transition:transform .2s var(--kb-ease), box-shadow .2s var(--kb-ease);
}
#right .btn-primary:hover, #right button:hover{ transform:translateY(-2px); box-shadow:var(--kb-sh-h); color:#fff !important; }
#right .btn-info{
  background:#fff; border:1.5px solid rgba(255,122,69,.45); color:var(--kb-p2) !important;
  border-radius:999px; font-weight:700;
  transition:all .2s var(--kb-ease);
}
#right .btn-info:hover{ background:var(--kb-grad-soft); border-color:var(--kb-p2); color:var(--kb-p2) !important; }

/* 操作徽标（查看 / 删除 / 状态 等） */
#right .label{ display:inline-block; padding:4px 12px; border-radius:999px; font-size:12px; font-weight:600; }
#right .label-success{ background:rgba(255,122,69,.14); color:var(--kb-p2); }
#right .label-primary{ background:#EEF2FB; color:#3B6FE0; }
#right .label-default{ background:#F1F4F8; color:var(--kb-ink2); }
#right .label-warning{ background:#FFF3E0; color:#C77700; }

/* 分页 */
#right .pagination{ margin:18px 0 0; list-style:none; padding:0; }
#right .pagination li{ display:inline-block; margin:0 3px; }
#right .pagination li a, #right .pagination li span{
  display:inline-block; min-width:34px; padding:7px 10px; text-align:center;
  border-radius:10px; color:var(--kb-ink2); text-decoration:none; font-size:13px;
  border:1px solid var(--kb-line); transition:all .2s var(--kb-ease);
}
#right .pagination li a:hover{ border-color:var(--kb-p1); color:var(--kb-p2); }
#right .pagination li.active a, #right .pagination li.active span{
  background:var(--kb-grad); color:#fff; border-color:transparent;
}

/* ============ 登录/注册：内容可见模式展示（对齐小次方） ============ */
.kb-modes{ display:flex; flex-wrap:wrap; gap:8px; margin:14px 0 4px; }
.kb-mode{
  font-size:13px; font-weight:700; color:#fff; padding:6px 13px;
  border-radius:999px; background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.32);
}

/* ============================================================
   卖家内部后台 · 布局升级（第二版）
   目标：侧栏常驻可滚动、内容区有呼吸感、信息展示从"表格当布局"改为卡片网格
   ============================================================ */

/* 侧栏：粘性定位，长列表滚动时菜单始终可见 */
#left{
  position:sticky; top:88px;
  max-height:calc(100vh - 116px); overflow-y:auto; overflow-x:hidden;
  padding:18px 12px; margin:22px 0 22px;
  scrollbar-width:thin; scrollbar-color:#D8DEE9 transparent;
}
#left::-webkit-scrollbar{ width:6px; }
#left::-webkit-scrollbar-thumb{ background:#D8DEE9; border-radius:6px; }
#left::-webkit-scrollbar-thumb:hover{ background:#C2CAD8; }

/* 内容区：放宽最大宽度 + 底部留白 */
#right{
  margin:22px 0 0 246px;
  max-width:1280px; padding-bottom:52px;
}

/* 侧栏分组标题 */
.menu-title{
  margin:16px 0 6px; padding:0 16px;
  font-size:11.5px; font-weight:800; letter-spacing:2px;
  color:var(--kb-ink3); text-transform:uppercase;
}
.menu-title:first-child{ margin-top:2px; }

/* 内容区页头（标题 + 说明） */
.kb-pagehead{
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px;
  margin:22px 0 18px; padding-bottom:14px; border-bottom:1px solid var(--kb-line);
}
.kb-pagehead h2{
  margin:0; font-size:22px; font-weight:800; color:var(--lp-ink, var(--kb-ink)); letter-spacing:.5px;
}
.kb-pagehead p{ margin:4px 0 0; font-size:13.5px; color:var(--kb-ink3); }
.kb-pagehead .kb-ph-act{ flex:0 0 auto; display:flex; gap:10px; }

/* 信息卡片网格（个人中心等） */
.kb-info-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:18px;
}
.kb-info{
  background:var(--kb-card); border:1px solid rgba(233,237,243,.85);
  border-radius:var(--kb-rs); padding:15px 18px; box-shadow:0 4px 14px rgba(15,23,42,.045);
  transition:transform .2s var(--kb-ease), box-shadow .2s var(--kb-ease);
}
.kb-info:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(15,23,42,.08); }
.kb-info .k{ font-size:12.5px; color:var(--kb-ink3); font-weight:600; margin-bottom:6px; }
.kb-info .v{ font-size:15.5px; color:var(--kb-ink); font-weight:700; word-break:break-all; }
.kb-info .v.muted{ color:var(--kb-ink3); font-weight:500; font-size:13.5px; }
.kb-info.hl{ background:var(--kb-grad-soft); border-color:rgba(255,122,69,.28); }
.kb-info.hl .v{ color:var(--kb-p2); font-size:20px; }
.kb-info .v small{ font-size:12.5px; font-weight:600; color:var(--kb-ink3); margin-left:4px; }

/* 区块小标题 */
.kb-subtitle{
  margin:0 0 12px; font-size:15px; font-weight:800; color:var(--kb-ink);
  padding-left:10px; border-left:3px solid var(--kb-p2); line-height:1.3;
}

/* 表格上方的工具条 */
.kb-toolbar{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-bottom:12px; flex-wrap:wrap;
}
.kb-toolbar .kb-tb-t{ font-size:15px; font-weight:800; color:var(--kb-ink); }
.kb-toolbar .kb-tb-s{ font-size:12.5px; color:var(--kb-ink3); }

@media (max-width:1100px){
  .kb-info-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:760px){
  #left{ position:static; max-height:none; width:auto; float:none; margin:16px 0; }
  #right{ margin-left:0; }
  .kb-info-grid{ grid-template-columns:1fr; }
}
