/* ============================================================
   利刃 · 收尾层（布局 / 主题 / 分组面板）  kk-final.css
   前缀统一 body.kkf —— 不依赖 .kk-ready，避免路由重渲染时闪回旧布局
   ============================================================ */

/* ---------- 0. 变量：深色（默认） ---------- */
body.kkf{
  --kkf-bg:#161b22;   --kkf-bg-2:#0d1117;  --kkf-bg-3:#1c2128;
  --kkf-line:#30363d; --kkf-txt:#e6edf3;   --kkf-t2:#8b949e; --kkf-t3:#6e7681;
  --kkf-red:#e23e57;  --kkf-hover:#1c2128; --kkf-shadow:0 18px 44px rgba(0,0,0,.55);
}

/* ---------- 1. 侧栏滚动条彻底去掉（滚轮照旧可用） ---------- */
body.kkf.kkf [data-slot="sidebar-inner"],
body.kkf.kkf [data-slot="sidebar-content"],
body.kkf.kkf aside [class*="overflow-auto"]{
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
body.kkf.kkf [data-slot="sidebar-inner"]::-webkit-scrollbar,
body.kkf.kkf [data-slot="sidebar-content"]::-webkit-scrollbar,
body.kkf.kkf aside [class*="overflow-auto"]::-webkit-scrollbar{
  width:0 !important; height:0 !important; display:none !important;
}
li.kk-item-off{ display:none !important; }

/* ---------- 2. 工具栏：去掉网格/列表切换按钮组 ---------- */
body.kkf.kkf .kk-tool > div:has(> button > svg.lucide-layout-grid){ display:none !important; }

/* ---------- 3. 列表占满高度，分页紧跟最后一行 ---------- */
body.kkf.kkf main .flex.flex-1.flex-col.px-4:has(.kk-dev-card){
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:6px !important;
}
body.kkf.kkf main .flex.flex-col:has(> div > .grid > .kk-dev-card) > div.overflow-y-auto{
  flex:0 0 auto !important;
  overflow:visible !important;
  max-height:none !important;
}
body.kkf.kkf main .kk-pager{ margin-top:8px !important; margin-bottom:2px !important; }
body.kkf.kkf .kk-tool{ margin-bottom:5px !important; }

/* ---------- 4. 设备行：56 → 42（一屏更多台） ---------- */
body.kkf.kkf div[class*="grid"]:has(> .kk-dev-card){ gap:4px !important; }
body.kkf.kkf .kk-dev-card{
  height:42px !important; min-height:42px !important; max-height:42px !important;
  border-radius:7px !important;
}
body.kkf.kkf .kk-dev-card::before{ top:9px !important; bottom:9px !important; }
body.kkf.kkf .kk-dev-card:hover::before{ top:8px !important; bottom:8px !important; }
body.kkf.kkf .kk-dev-card [data-slot="card-content"]{ height:42px !important; }
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(1) > div:first-child > div{
  height:42px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(1) > div:first-child > div::after{
  top:8px !important; bottom:8px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(1) > div:first-child > div > div:first-child{
  top:4px !important; height:17px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(1) p{
  font-size:13px !important; line-height:17px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(1) > div:first-child > div > p{
  top:22px !important; height:13px !important;
  font-size:9px !important; line-height:13px !important; letter-spacing:.4px;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(2){
  top:4px !important; height:17px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="badge"]{
  height:15px !important; font-size:8.5px !important; line-height:13px !important; padding:0 5px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(3){
  top:22px !important; height:14px !important;
}
body.kkf.kkf .kk-dev-card .kk-lb{ font-size:9px !important; line-height:13px !important; }
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(3) > div > span:not(.kk-lb){
  font-size:10px !important; line-height:13px !important;
}
body.kkf.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(3) > div.kk-notewrap{
  top:-18px !important; height:16px !important; width:230px !important;
}
body.kkf.kkf .kk-dev-card textarea.kk-note-box{
  height:16px !important; min-height:16px !important; max-height:16px !important;
  font-size:11px !important; line-height:15px !important;
}
body.kkf.kkf .kk-dev-card .kk-go{ right:12px; width:14px; height:14px; margin-top:-7px; font-size:13px; }
body.kkf.kkf .kk-endline{ margin-top:4px !important; padding:1px 0 !important; }

/* ============================================================
   5. 亮色主题
   ============================================================ */

/* 分组面板:高度上限 + footer 固定 */
#kk-group-pop{ max-height:calc(100vh - 132px); display:flex; flex-direction:column; }
#kk-group-pop .kk-gp-list, #kk-group-pop #kk-gp-list{
  overflow-y:auto !important; overscroll-behavior:contain; flex:1 1 auto; min-height:0;
}
#kk-group-pop .kk-gp-list::-webkit-scrollbar{ width:6px; }
#kk-group-pop .kk-gp-list::-webkit-scrollbar-thumb{ background:var(--kkf-line); border-radius:3px; }
#kk-group-pop .kk-gp-foot{ flex:0 0 auto; }

/* 亮色:卡片第二行文字加深 */
html.kk-light body.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(3) > div > span:not(.kk-lb){
  color:#57606a !important;
}
html.kk-light body.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(3) > div.kk-notewrap textarea{
  color:#3d444d !important;
}

/* 5.0 主题变量（kk-theme.css 把整套 foreground/background 定在 html 上，这里整体翻成亮色） */
html.kk-light:not(:has(.login-split)){
  --background:#f2f4f7;
  --foreground:#0d1117;
  --card:#ffffff;
  --card-foreground:#0d1117;
  --popover:#ffffff;
  --popover-foreground:#0d1117;
  --secondary:#eef2f6;
  --secondary-foreground:#0d1117;
  --muted:#f2f5f8;
  --muted-foreground:#59636e;
  --accent:#e9eef3;
  --accent-foreground:#0d1117;
  --border:#dce2e8;
  --input:#dce2e8;
  --ring:#1a9ae6;
  --sidebar:#ffffff;
  --sidebar-foreground:#24292f;
  --sidebar-primary:#1a9ae6;
  --sidebar-primary-foreground:#ffffff;
  --sidebar-accent:#eef2f6;
  --sidebar-accent-foreground:#0d1117;
  --sidebar-border:#e3e8ee;
  --sidebar-background:0 0% 100%;
}
html.kk-light body.kkf .kk-brand b{ color:#0d1117 !important; }
html.kk-light body.kkf .kk-brand i{ color:#7d8794 !important; }
html.kk-light body.kkf .text-foreground{ color:#0d1117 !important; }
html.kk-light body.kkf .text-muted-foreground{ color:#59636e !important; }

html.kk-light body.kkf{
  --kk-line:#dde3e9; --kk-line-h:rgba(209,36,60,.5);
  --kk-t1:#0d1117; --kk-t2:#57606a; --kk-t3:#7d8794;
  --kkf-bg:#ffffff;  --kkf-bg-2:#eef1f5; --kkf-bg-3:#f6f8fa;
  --kkf-line:#d0d7de; --kkf-txt:#0d1117; --kkf-t2:#59636e; --kkf-t3:#6e7781;
  --kkf-red:#d1243c; --kkf-hover:#f1f4f8; --kkf-shadow:0 18px 44px rgba(31,45,61,.16);
}
html.kk-light body,
html.kk-light .group\/sidebar-wrapper{ background:#f2f4f7 !important; }
html.kk-light main{ background:#f2f4f7 !important; }
html.kk-light [data-slot="sidebar-inner"]{ background:#ffffff !important; }
html.kk-light main > header{ background:#ffffff !important; border-bottom:1px solid #e3e8ee !important; }

/* 设备卡（压在 v16 的深色渐变之上） */
html.kk-light body.kkf .kk-dev-card{
  background:linear-gradient(180deg,#ffffff 0%,#fbfcfd 100%) !important;
  border-color:#e1e7ed !important;
  box-shadow:0 1px 2px rgba(16,24,40,.04) !important;
}
html.kk-light body.kkf .kk-dev-card:hover{
  background:linear-gradient(180deg,#f8fafc 0%,#f3f6f9 100%) !important;
  border-color:#bcc7d1 !important;
}
html.kk-light body.kkf .kk-dev-card [data-slot="card-content"] > div:nth-child(1) > div:first-child > div > p{
  color:#7d8794 !important;
}
html.kk-light body.kkf .kk-dev-card .kk-lb{ color:#8c959f !important; }
html.kk-light body.kkf .kk-dev-card [data-slot="badge"]{
  background:rgba(13,17,23,.05) !important;
  border-color:#e2e8ee !important;
  color:#57606a !important;
}
html.kk-light body.kkf .kk-dev-card .kk-go{ color:#b3bcc5 !important; }
html.kk-light body.kkf .kk-dev-card textarea.kk-note-box{
  color:#24292f !important; border-bottom-color:#d8dee4 !important;
}
html.kk-light body.kkf .kk-dev-card textarea.kk-note-box:placeholder-shown{
  color:#8c959f !important; border-bottom-color:#dde3e9 !important;
}

/* Tailwind 硬编码深色 → 亮色 */
html.kk-light body.kkf [class~="bg-[#161b22]"]{ background-color:#ffffff !important; }
html.kk-light body.kkf [class~="bg-[#1c2128]"]{ background-color:#f6f8fa !important; }
html.kk-light body.kkf [class~="bg-[#0d1117]"]{ background-color:#eef1f5 !important; }
html.kk-light body.kkf [class~="bg-[#2d333b]"]{ background-color:#e9eef3 !important; }
html.kk-light body.kkf [class~="bg-[#30363d]"]{ background-color:#d6dde4 !important; }
html.kk-light body.kkf [class~="bg-[#0d1117]/80"]{ background-color:rgba(255,255,255,.92) !important; }
html.kk-light body.kkf [class~="bg-[#07111e]"]{ background-color:#f2f4f7 !important; }

html.kk-light body.kkf [class~="text-[#e6edf3]"]{ color:#0d1117 !important; }
html.kk-light body.kkf [class~="text-[#c9d1d9]"]{ color:#24292f !important; }
html.kk-light body.kkf [class~="text-[#8b949e]"]{ color:#59636e !important; }
html.kk-light body.kkf [class~="text-[#6e7681]"]{ color:#6e7781 !important; }
html.kk-light body.kkf [class~="text-[#484f58]"]{ color:#8c959f !important; }
html.kk-light body.kkf [class~="text-[#eef5ff]"]{ color:#0d1117 !important; }
html.kk-light body.kkf [class~="text-[#9aa7b4]"]{ color:#57606a !important; }

html.kk-light body.kkf [class~="border-[#30363d]"]{ border-color:#d0d7de !important; }
html.kk-light body.kkf [class~="border-[#21262d]"]{ border-color:#e6eaef !important; }
html.kk-light body.kkf [class~="border-[#161b22]"]{ border-color:#ffffff !important; }
html.kk-light body.kkf [class~="border-[#8b949e]/30"]{ border-color:rgba(89,99,110,.3) !important; }
html.kk-light body.kkf [class~="border-[#24303b]"]{ border-color:#e2e8ee !important; }

html.kk-light body.kkf [class~="hover:bg-[#1c2128]"]:hover{ background-color:#eef2f6 !important; }
html.kk-light body.kkf [class~="hover:text-[#e6edf3]"]:hover{ color:#0d1117 !important; }
html.kk-light body.kkf [class~="hover:border-[#484f58]"]:hover{ border-color:#b6c0c9 !important; }
html.kk-light body.kkf [class~="hover:border-[#30363d]"]:hover{ border-color:#c4ccd4 !important; }
html.kk-light body.kkf [class~="focus:bg-[#0d1117]"]:focus{ background-color:#ffffff !important; }

/* 侧栏 / 弹层 / 滚动条 */
html.kk-light body.kkf [data-slot="sidebar-menu-button"]:hover{ background:#eef2f6 !important; }
html.kk-light body.kkf [data-slot="sidebar-menu-button"][data-active="true"]{
  background:#e6ebf1 !important; color:#0d1117 !important;
}
html.kk-light body.kkf .kk-endline{ color:#98a2ad !important; }
html.kk-light body.kkf ::-webkit-scrollbar-track{ background:#eef1f5 !important; }
html.kk-light body.kkf ::-webkit-scrollbar-thumb{ background:#c6cfd8 !important; }
html.kk-light body.kkf ::-webkit-scrollbar-thumb:hover{ background:#a9b4bf !important; }
html.kk-light body.kkf .kk-menu{
  background:#ffffff !important; border-color:#dde3e9 !important;
  box-shadow:0 16px 38px -10px rgba(16,24,40,.28) !important;
}
html.kk-light body.kkf .kk-menu-item{ color:#24292f !important; }
html.kk-light body.kkf .kk-menu-item:hover{ background:#f1f4f8 !important; }

/* 登录页保持自身深色皮肤 */
html.kk-light body:has(.login-split){ background:#07111e !important; }

/* ============================================================
   6. 顶栏黑白切换按钮
   ============================================================ */
#kk-theme-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; margin-left:10px; flex:0 0 auto;
  border-radius:6px; cursor:pointer;
  border:1px solid var(--kkf-line);
  background:var(--kkf-bg-3);
  color:var(--kkf-t2);
  transition:background .14s, color .14s, border-color .14s;
}
#kk-theme-btn:hover{ background:var(--kkf-hover); color:var(--kkf-txt); border-color:#4a5560; }
html.kk-light #kk-theme-btn:hover{ border-color:#b6c0c9; }
#kk-theme-btn svg{ width:14px; height:14px; }
#kk-theme-btn .kk-sun{ display:none; }
html.kk-light #kk-theme-btn .kk-sun{ display:block; }
html.kk-light #kk-theme-btn .kk-moon{ display:none; }

/* ============================================================
   7. 分组面板
   ============================================================ */
#kk-group-pop{
  position:fixed; z-index:2147483000;
  width:268px; max-height:70vh; display:flex; flex-direction:column;
  background:var(--kkf-bg); color:var(--kkf-txt);
  border:1px solid var(--kkf-line); border-radius:10px;
  box-shadow:var(--kkf-shadow);
  font-size:12.5px; overflow:hidden;
}
#kk-group-pop .kk-gp-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 10px; border-bottom:1px solid var(--kkf-line);
  font-size:12px; font-weight:600; letter-spacing:.4px; color:var(--kkf-t2);
}
#kk-group-pop .kk-gp-head b{ cursor:pointer; font-size:15px; line-height:1; color:var(--kkf-t2); }
#kk-group-pop .kk-gp-list{ overflow-y:auto; padding:4px; }
#kk-group-pop .kk-gp-item{
  display:flex; align-items:center; gap:6px;
  padding:6px 8px; border-radius:6px; cursor:pointer; color:var(--kkf-txt);
}
#kk-group-pop .kk-gp-item:hover{ background:var(--kkf-hover); }
#kk-group-pop .kk-gp-item.on{ background:rgba(226,62,87,.12); }
#kk-group-pop .kk-gp-dot{ width:6px; height:6px; border-radius:50%; background:var(--kkf-t3); flex:0 0 auto; }
#kk-group-pop .kk-gp-item.on .kk-gp-dot{ background:var(--kkf-red); }
#kk-group-pop .kk-gp-name{ flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#kk-group-pop .kk-gp-num{ color:var(--kkf-t3); font-size:11px; flex:0 0 auto; }
#kk-group-pop .kk-gp-act{ display:flex; gap:2px; flex:0 0 auto; opacity:0; transition:opacity .12s; }
#kk-group-pop .kk-gp-item:hover .kk-gp-act{ opacity:1; }
#kk-group-pop .kk-gp-act button{
  width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:4px; background:transparent; border:0; cursor:pointer; color:var(--kkf-t2); font-size:11px;
}
#kk-group-pop .kk-gp-act button:hover{ background:rgba(255,255,255,.09); color:var(--kkf-txt); }
html.kk-light #kk-group-pop .kk-gp-act button:hover{ background:rgba(13,17,23,.08); }
#kk-group-pop .kk-gp-foot{ display:flex; gap:6px; padding:6px; border-top:1px solid var(--kkf-line); }
#kk-group-pop .kk-gp-foot button{
  flex:1 1 auto; height:26px; border-radius:6px; cursor:pointer;
  border:1px solid var(--kkf-line); background:var(--kkf-bg-3); color:var(--kkf-txt); font-size:12px;
}
#kk-group-pop .kk-gp-foot button:hover{ border-color:var(--kkf-red); color:var(--kkf-red); }
#kk-group-pop .kk-gp-empty{ padding:12px 8px; color:var(--kkf-t3); text-align:center; font-size:11.5px; }

/* 分组筛选提示条 */
#kk-filter-bar{ display:none; align-items:center; gap:8px; padding:0 0 5px; font-size:11.5px; color:var(--kkf-t2); }
body.kk-filtering #kk-filter-bar{ display:flex; }
#kk-filter-bar b{ color:var(--kkf-red); font-weight:600; }
#kk-filter-bar button{
  border:1px solid var(--kkf-line); background:transparent; color:var(--kkf-t2);
  height:19px; padding:0 7px; border-radius:4px; cursor:pointer; font-size:11px;
}
#kk-filter-bar button:hover{ color:var(--kkf-txt); border-color:var(--kkf-red); }

/* ============================================================
   9. 启动即深色（防刷新/切页时白底一闪）
   kk-theme.css 的深色变量挂在 html:not(:has(.login-split))，
   但面板自身会带 html.light，个别时机变量被顶回白色 —— 这里加固一层，
   只在没有 kk-light（用户手动切亮色）时生效。
   ============================================================ */
html:not(.kk-light){ background:#07111e !important; color-scheme:dark; }
html.light:not(.kk-light):not(:has(.login-split)){
  --background:#07111e; --foreground:#eef5ff;
  --card:#0f1a2d; --card-foreground:#eef5ff;
  --popover:#122033; --popover-foreground:#eef5ff;
  --secondary:#15263c; --secondary-foreground:#eef5ff;
  --muted:#122033; --muted-foreground:#8ea0b8;
  --accent:#16304c; --accent-foreground:#eef5ff;
  --border:#26364f; --input:#26364f;
  --sidebar:#050d1a; --sidebar-foreground:#eef5ff;
  --sidebar-accent:#12263d; --sidebar-accent-foreground:#eef5ff;
  --sidebar-border:#1c3048;
}
html.kk-light{ background:#f2f4f7 !important; color-scheme:light; }

/* ---------- 10. 分页条再压一档：26px 高、紧贴列表 ---------- */
body.kkf.kkf .kk-pager:not(:has(table)):not(:has([data-slot="card"])){ margin-top:3px !important; height:26px !important; min-height:26px !important; }
body.kkf.kkf .kk-pager:not(:has(table)):not(:has([data-slot="card"])) > div{ height:26px !important; }
body.kkf.kkf .kk-pager:not(:has(table)):not(:has([data-slot="card"])) nav{ height:26px !important; }
body.kkf.kkf .kk-pager nav a,
body.kkf.kkf .kk-pager nav button{
  height:24px !important; min-height:24px !important; width:24px !important;
  min-width:24px !important; font-size:11px !important; padding:0 !important; margin:0 1px !important;
}
body.kkf.kkf .kk-pager select,
body.kkf.kkf .kk-pager [role="combobox"],
body.kkf.kkf .kk-pager button[role="combobox"]{
  height:24px !important; min-height:24px !important; font-size:11px !important;
}
body.kkf.kkf .kk-pager span, body.kkf.kkf .kk-pager .text-sm{ font-size:11px !important; line-height:24px !important; }
body.kkf.kkf .kk-pager svg{ width:12px !important; height:12px !important; }