/* ============================================================
   快来接单台 · 深色紫主题覆盖层（叠加在原样式之后）
   覆盖 :root 设计令牌 + 少量硬编码白色背景组件
   回滚方式：删除 index.html 中对本文件的引用即可
   ============================================================ */

:root{
  /* 品牌色：蓝 → 紫 */
  --brand:#a855f7;
  --brand-600:#7c3aed;
  --brand-700:#6d28d9;
  --brand-50:rgba(168,85,247,.13);
  --brand-100:rgba(168,85,247,.24);

  /* 背景 / 面板：浅色 → 深色 */
  --bg:#0b0d14;
  --panel:#161b2a;
  --panel-soft:#121622;

  /* 边框 */
  --line:#232a3e;
  --line-2:#1c2233;
  --line-strong:#2e3652;

  /* 文字 */
  --t1:#e8ebf5;
  --t2:#a7afc4;
  --t3:#6f7890;

  /* 语义色（适配深色底） */
  --ok:#34d399;          --ok-50:rgba(52,211,153,.14);   --ok-600:#6ee7b7;
  --warn:#fbbf24;        --warn-50:rgba(251,191,36,.14); --warn-600:#fcd34d;
  --danger:#ff5f6d;      --danger-50:rgba(255,95,109,.15);--danger-600:#ff8a94;
  --purple-50:rgba(168,85,247,.14);
  --purple-600:#c084fc;

  /* 阴影加深 */
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 4px 16px rgba(0,0,0,.45);
  --sh-3:0 18px 48px rgba(0,0,0,.55);

  /* 侧栏：纯深 + 紫色激活 */
  --side:#0d1019;
  --side-soft:rgba(168,85,247,.13);
  --side-hover:rgba(255,255,255,.06);
  --side-active:linear-gradient(135deg,#8b5cf6,#e879f9);
  --side-text:rgba(255,255,255,.64);
  --side-dim:rgba(255,255,255,.38);
}

/* ---------- 硬编码白色背景组件 ---------- */

input,select,textarea{
  background:#121622 !important;
  color:var(--t1) !important;
  border-color:var(--line-strong) !important;
}
input::placeholder{color:var(--t3)}
select option{background:#161b2a;color:var(--t1)}

button:not(.primary):not([class*="primary"]){
  background:#1a2032;
  color:var(--t1);
  border-color:var(--line-strong);
}

.empty{background:#121622 !important;color:var(--t3)}

/* 右侧抽屉 / 详情面板 */
[style*="width: 520px"],.drawer,[class*="drawer"]{
  background:#121622 !important;
}

/* 顶栏 */
.topbar{background:#0e111a !important;border-bottom:1px solid var(--line-2) !important}

/* 用户下拉 */
.user-drop-inner{background:#161b2a !important;border:1px solid var(--line)}

/* 快捷入口按钮 */
.quick button{background:#1a2032 !important;border-color:var(--line-strong) !important;color:var(--t1) !important}

/* 登录页 */
.login-box{background:#161b2a !important;border:1px solid var(--line);box-shadow:0 24px 60px rgba(0,0,0,.5)}
.login-brand{background:
  radial-gradient(600px 300px at 20% 10%,rgba(168,85,247,.28),transparent 60%),
  radial-gradient(500px 300px at 85% 85%,rgba(124,58,237,.22),transparent 60%),
  linear-gradient(135deg,#140f24,#0d1019) !important}
.login-brand:after{background:linear-gradient(135deg,rgba(20,15,36,.92),rgba(124,58,237,5.50)) !important}
.login-brand .lb-logo{background:#161b2a !important}
.logo img,.sidebar .logo img{background:transparent !important}

/* 主按钮悬停提亮 */
button.primary:hover,[class*="primary"]:hover{filter:brightness(1.12)}

/* 表格行悬停 */
tr:hover td{background:rgba(255,255,255,.06) !important}
tr:hover{background:rgba(255,255,255,.06) !important}

/* 滚动条 */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:8px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.22);background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}

/* 弹窗遮罩 */
[class*="mask"],[class*="overlay"]{background:rgba(5,7,12,.6) !important}

/* ---------- 顶部导航移入左侧栏后的样式 ---------- */
.sidebar .nb-tabs{display:flex;flex-direction:column;gap:3px;padding:4px 8px 10px;border-bottom:1px solid var(--line-2);margin-bottom:4px;flex-shrink:0}
.sidebar .nb-tab{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;color:var(--side-text);padding:10px 12px;border-radius:8px;cursor:pointer;font-size:14px;transition:.15s;text-align:left}
.sidebar .nb-tab:hover{background:var(--side-hover);color:#fff}
.sidebar .nb-tab.active{background:var(--side-active);color:#fff;font-weight:500;box-shadow:0 4px 14px rgba(139,92,246,.4)}
.sidebar .nb-tab svg{flex-shrink:0}
body.nav-moved header.navbar{padding-left:20px}

/* ---------- 顶栏品牌区胶囊图标组（管理端/开放平台/首页） ---------- */
.brand-pills{display:flex !important;align-items:center !important;gap:2px !important;background:rgba(255,255,255,.05) !important;border:1px solid var(--line) !important;border-radius:999px !important;padding:4px !important}
.brand-pills .bp-item{display:flex !important;align-items:center !important;gap:4px !important;background:transparent !important;border:0 !important;color:var(--side-text) !important;height:32px !important;padding:6px 16px !important;border-radius:999px !important;font-size:13px !important;font-weight:500 !important;cursor:pointer !important;transition:.15s !important;white-space:nowrap !important}
.brand-pills .bp-item svg{width:12px !important;height:12px !important;stroke-width:1.5}
.brand-pills .bp-item:hover{color:var(--t1) !important}
.brand-pills .bp-item.active{background:var(--side-active) !important;color:#fff !important;font-weight:600 !important;box-shadow:0 10px 24px rgba(79,140,255,.32),inset 0 1px 0 rgba(255,255,255,.22) !important}

/* ============================================================
   与快来开放框架 UI 布局对齐
   ============================================================ */

/* 1) 极光光晕背景（框架同款） */
body{background:transparent !important;position:relative}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:
  radial-gradient(1200px 640px at 6% -8%,rgba(168,85,247,.20),transparent 62%),
  radial-gradient(980px 600px at 98% 2%,rgba(124,58,237,.16),transparent 62%),
  radial-gradient(820px 540px at 62% 112%,rgba(168,85,247,.10),transparent 60%),
  linear-gradient(180deg,#0b0d14 0%,#0e1119 55%,#0b0d14 100%)}

/* 2) 顶栏：毛玻璃 + 底部渐变光线（框架同款） */
.topbar,header.navbar{background:rgba(9,13,20,.72) !important;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);position:sticky;top:0;z-index:100}
.topbar::after,header.navbar::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--brand) 65%,transparent),color-mix(in srgb,var(--brand) 50%,transparent),transparent)}

/* 3) 侧栏：完整规格见下方「侧栏：完整对齐快来开放框架」专用区块 */

/* 4) 卡片/面板：大圆角 + 半透明悬浮面（框架 16px 圆角风格） */
.card,.panel,[class*="card-"],.stat,[class*="block"],[class*="panel"]{
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02)) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  border-radius:16px !important;
}
.card:hover,[class*="card-"]:hover{border-color:var(--brand-100) !important}

/* 5) 主按钮：紫色渐变胶囊 + 发光（框架 .btn.pri 同款） */
button.primary,[class*="btn-pri"],.btn-primary{
  background:var(--side-active) !important;border:0 !important;
  border-radius:999px !important;font-weight:600;
  box-shadow:0 8px 22px rgba(139,92,246,.32) !important;
}
button.primary:hover{filter:brightness(1.08)}

/* 6) 表格：表头悬浮面 + 行悬停紫调 */
th{background:rgba(255,255,255,.04) !important}
tbody tr:hover td{background:rgba(255,255,255,.06) !important}
tbody tr:hover{background:rgba(255,255,255,.06) !important}

/* 7) 输入框聚焦紫色光圈 */
input:focus,select:focus,textarea:focus{
  border-color:var(--brand) !important;
  box-shadow:0 0 0 3px var(--brand-50) !important;
}

/* ============================================================
   侧栏：完整对齐快来开放框架（aside / .grp / a / .on / .bdg / .back / .fold / light）
   映射：React class         → 框架 class
     aside.sidebar           → aside
     .nav-item / .nb-tab     → aside a
     .nav-item.active        → aside a.on
     .nav-icon               → aside a svg
     .nav-group              → aside .grp
     .bdg                    → aside a .bdg
   ============================================================ */

/* 容器：框架 222px + 半透明毛玻璃，透出 aurora 光晕 */
aside.sidebar,.sidebar{
  width:222px !important;flex-shrink:0 !important;
  padding:18px 14px 12px !important;
  background:linear-gradient(180deg,rgba(13,18,27,.62),rgba(8,12,18,.42)) !important;
  backdrop-filter:blur(16px) !important;-webkit-backdrop-filter:blur(16px) !important;
  border-right:1px solid rgba(255,255,255,.09) !important;
  display:flex !important;flex-direction:column !important;
}

/* 品牌区（站点名 / 副标题） */
.sidebar .brand .name{color:#e9eff7 !important;font-size:15px}
.sidebar .brand .sub{color:#8b98ab !important;font-size:11.5px}

/* 分组标题（概览 / 主导航 等小标题，框架 .grp） */
.sidebar .nav-group,.sidebar .grp{
  display:flex !important;align-items:center !important;gap:8px !important;
  color:#8b98ab !important;font-size:10.5px !important;
  padding:11px 12px 9px !important;letter-spacing:2px !important;text-transform:uppercase !important;
  background:none !important;border:0 !important;margin:0 !important;
}
/* 分组编辑图标（框架 .grp-ic） */
.sidebar .grp-ic{width:22px;height:22px;margin-left:-4px;border-radius:7px;
  display:flex !important;align-items:center;justify-content:center;
  cursor:pointer;color:#8b98ab;opacity:.75;transition:.16s;flex-shrink:0}
.sidebar .grp-ic svg{width:13px;height:13px}
.sidebar .grp-ic:hover{color:#fff;opacity:1;background:rgba(255,255,255,.09)}

/* 导航项（框架 aside a / nb-tab → a） */
.sidebar .nav-item,.sidebar .nb-tab{
  position:relative !important;display:flex !important;align-items:center !important;gap:10px !important;
  padding:10px 12px !important;border-radius:11px !important;
  color:#8b98ab !important;background:transparent !important;border:0 !important;
  font-size:13.5px !important;font-weight:400 !important;line-height:1.4 !important;
  cursor:pointer !important;text-decoration:none !important;
  transition:background-color .2s,color .2s,transform .2s !important;margin-bottom:2px !important;width:100% !important;text-align:left !important;
  white-space:nowrap !important;flex-shrink:0 !important;
}
.sidebar .nav-item:hover,.sidebar .nb-tab:hover{color:#fff !important;background:rgba(255,255,255,.06) !important;transform:translateX(2px) !important}

/* 激活项（框架 aside a.on → 紫色渐变 + 发光） */
.sidebar .nav-item.active,.sidebar .nb-tab.active{
  color:#fff !important;background:var(--side-active) !important;
  box-shadow:0 10px 24px rgba(79,140,255,.32),inset 0 1px 0 rgba(255,255,255,.22) !important;
  font-weight:400 !important;
}
.sidebar .nav-item.active:hover,.sidebar .nb-tab.active:hover{transform:none !important;background:var(--side-active) !important}

/* 图标（框架 aside a svg → .nav-icon） */
.sidebar .nav-item .nav-icon,.sidebar .nb-tab .nav-icon{width:16px !important;height:16px !important;flex-shrink:0 !important;opacity:.85 !important;transition:.2s !important}
.sidebar .nav-item:hover .nav-icon,.sidebar .nb-tab:hover .nav-icon,
.sidebar .nav-item.active .nav-icon,.sidebar .nb-tab.active .nav-icon{opacity:1 !important}

/* 徽标（框架 aside a .bdg → 红橙渐变角标） */
.sidebar .nav-item .bdg,.sidebar .nb-tab .bdg,.sidebar .bdg{
  margin-left:auto !important;background:linear-gradient(135deg,#ff5f6d,#ff8a5b) !important;
  color:#fff !important;font-size:10px !important;border-radius:999px !important;
  padding:0 7px !important;line-height:17px !important;font-weight:700 !important;
  box-shadow:0 4px 12px rgba(255,95,109,.35) !important;
}

/* 返回链接（框架 aside a.back，若 React 存在则同款浅紫） */
.sidebar a.back{color:var(--brand) !important;background:var(--brand-50) !important;margin-top:4px !important}
.sidebar a.back:hover{color:#fff !important;background:var(--brand-100) !important;transform:none !important}

/* 导航编辑入口（框架 .navedit，若 React 存在） */
.sidebar .navedit{margin-top:14px;border-top:1px dashed rgba(255,255,255,.09) !important;padding-top:12px !important;
  color:#8b98ab !important;font-size:12px !important;display:flex !important;align-items:center !important;gap:6px !important;
  cursor:pointer;padding-left:12px;transition:.18s}
.sidebar .navedit:hover{color:#fff;transform:translateX(2px)}

/* 主导航与二级菜单之间的虚线分隔（React 结构专用：nb-tabs 之后） */
.sidebar .nb-tabs{flex:0 0 auto !important;height:auto !important;max-height:none !important;overflow:visible !important;
  display:flex !important;flex-direction:column !important;gap:2px !important;
  padding:2px 0 10px !important;margin:4px 0 8px !important;border-bottom:1px dashed rgba(255,255,255,.09) !important;align-content:flex-start !important}
.sidebar nav.nav{flex:0 0 auto !important;height:auto !important;display:flex !important;flex-direction:column !important}

/* 折叠态（框架 .fold，66px） */
aside.sidebar.fold,.sidebar.fold{width:66px !important;padding:18px 8px !important}
.sidebar.fold .nav-item,.sidebar.fold .nb-tab{justify-content:center !important;padding:11px 0 !important;gap:0 !important}
.sidebar.fold .nav-item span,.sidebar.fold .nb-tab span,.sidebar.fold .bdg,.sidebar.fold .navedit{display:none !important}
.sidebar.fold .nav-group{font-size:0 !important;padding:6px 0 !important;text-align:center}

/* 浅色主题（框架 html.light） */
html.light aside.sidebar,html.light .sidebar{background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(244,247,252,.86)) !important;border-right:1px solid rgba(15,23,42,.08) !important}
html.light .sidebar .nav-item:hover,html.light .sidebar .nb-tab:hover{color:#101828 !important;background:rgba(15,23,42,.06) !important}
html.light .sidebar .grp-ic:hover{color:#101828;background:rgba(15,23,42,.07)}
html.light .sidebar .navedit:hover{color:#101828}

/* ============================================================
   侧栏扁平化：与框架单列导航完全一致（用户对比截图反馈）
   框架侧栏 = 纯一列导航项：无品牌区 / 无分组标题 / 无分隔线 /
             无底部信息 / 同屏只有一个紫色激活项
   ============================================================ */
.sidebar .brand,.sidebar .brand .name,.sidebar .brand .sub{display:none !important}
.sidebar .nav-group{display:none !important}
.sidebar .foot,.sidebar .foot-legal,.sidebar .foot a{display:none !important}
.sidebar .nb-tabs{gap:0 !important;border-bottom:0 !important;padding:0 !important;margin:0 !important}
.sidebar nav.nav{gap:0 !important;padding:0 !important;margin:0 !important}

/* ---------- v7：激活项纯紫投影（去白色内描边），清除底部残条 ---------- */
.sidebar .nb-tab.active,.sidebar .nav-item.active{box-shadow:0 10px 24px rgba(79,140,255,.32),inset 0 1px 0 rgba(255,255,255,.22) !important}
.sidebar .nb-tab.active::after,.sidebar .nav-item.active::after{display:none !important}

/* ---------- v8：主区二级顶栏压扁，呈细分割线而非宽横带 ---------- */
.app-shell .main .topbar{padding:8px 20px 9px !important;margin-bottom:12px !important}
.app-shell .main .topbar h1{font-size:15px !important;margin:0 !important}

/* ---------- v9：主顶栏下拉菜单不被主区二级顶栏遮挡 ---------- */
.app-shell{height:100vh !important;overflow:hidden !important}
.app-shell .shell-body{height:calc(100vh - 62px) !important}
header.navbar{z-index:300 !important}
header.navbar .user-menu,header.navbar .nb-right,header.navbar .nb-sub{z-index:400 !important}

/* ---------- v10：主区二级顶栏只留分割线 ---------- */
.app-shell .main .topbar{height:0 !important;min-height:0 !important;padding:0 !important;margin:0 0 10px !important;overflow:hidden !important;background:transparent !important;border-bottom:1px solid var(--line-2) !important}
.app-shell .main .topbar *{display:none !important}
.app-shell .main .topbar::after{display:none !important}

/* ---------- 顶栏尺寸对齐框架（height 62 / padding 0 28 / 胶囊贴排） ---------- */
header.navbar{height:62px !important;min-height:62px !important;padding:0 28px !important}
.brand-pills{gap:0 !important}
header.navbar{margin-bottom:0 !important}

/* ---------- 字体栈对齐框架（含 Inter） ---------- */
body,button,input,select,textarea,aside,.sidebar,header.navbar{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,"PingFang SC","Microsoft YaHei",sans-serif !important;
}