/*! v7工作室AI版 · MK 皮肤层：设备卡片「紧凑版」（配合 mk-devcards.js）
 *  只作用于卡片视图（js 给设备表打 id=mkdc）；切回列表视图时 js 会撤销内联，零影响。
 *  图标素材：Lucide（lucide.dev，ISC 许可，可商用）→ 本地自托管 /panel/skin/assets/icons/*.svg
 *  卸载：删掉 index.html 里 mk-devcards.css / mk-devcards.js 两行即回退。
 */

/* 卡片栅格：更小更密（1700 宽 ≈ 4 列） */
#mkdc.mk-cards > tbody{grid-template-columns:repeat(auto-fill,minmax(330px,1fr)) !important;gap:12px !important}

/* 单卡：flex 自动换行 —— 顶栏一行 + 双列字段 */
#mkdc.mk-cards > tbody > tr{
  display:flex !important;flex-wrap:wrap !important;
  align-items:center !important;align-content:flex-start !important;
  column-gap:8px !important;row-gap:1px !important;
  padding:9px 11px 10px !important;
}
/* 壁纸列沿用皮肤决定：保持隐藏 */
#mkdc.mk-cards > tbody > tr > td:nth-child(3){display:none !important}

/* 单元格基线 */
#mkdc.mk-cards > tbody > tr > td{
  display:flex !important;align-items:center !important;gap:5px !important;
  min-width:0 !important;min-height:19px !important;padding:0 !important;border:0 !important;
  background:transparent !important;border-radius:0 !important;overflow:hidden !important;
  white-space:nowrap !important;text-align:left !important;
  font-size:11.5px !important;color:var(--mk-txt) !important;
}
#mkdc.mk-cards > tbody > tr > td > *{min-width:0}

/* 顶栏：勾选 · 在线药丸 · 设备号 …… 操作 */
#mkdc.mk-cards td:nth-child(1){flex:0 0 20px !important;margin-bottom:6px !important}
#mkdc.mk-cards td:nth-child(2){flex:0 1 auto !important;min-width:50px !important;margin-bottom:6px !important}
#mkdc.mk-cards td:nth-child(15){flex:0 0 auto !important;margin-bottom:6px !important;
  padding:2px 8px !important;border-radius:999px !important;
  border:1px solid rgba(146,178,224,.16) !important;background:rgba(255,255,255,.045) !important;
  font-size:11px !important;font-weight:600 !important;color:#b9cbe4 !important;
}
#mkdc.mk-cards td:nth-child(15):has(.status-dot.on){border-color:rgba(52,211,153,.34) !important;background:rgba(34,197,94,.12) !important;color:#86efac !important}
#mkdc.mk-cards td:nth-child(15):has(.status-dot.off){border-color:rgba(148,163,184,.26) !important;background:rgba(148,163,184,.10) !important;color:#a8b6c9 !important}
#mkdc.mk-cards td:nth-child(2) .dev-id-num{font-size:12.5px !important;font-weight:700 !important;color:var(--mk-txt) !important;letter-spacing:.6px !important}

/* 操作按钮：压成图标按钮（文字进 tooltip，图标 Lucide） */
#mkdc.mk-cards td:nth-child(22){margin-left:auto !important;justify-content:flex-end !important;gap:4px !important;margin-bottom:6px !important}
#mkdc.mk-cards td:nth-child(22) button{
  width:22px !important;height:22px !important;padding:0 !important;font-size:0 !important;
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  border-radius:6px !important;
}
#mkdc.mk-cards td:nth-child(22) button:not(.is-icon)::before{
  content:'' !important;width:12px !important;height:12px !important;
  background-color:currentColor !important;opacity:.92 !important;
  -webkit-mask:var(--mkdc-bico) center / contain no-repeat !important;
  mask:var(--mkdc-bico) center / contain no-repeat !important;
}
#mkdc.mk-cards td:nth-child(22) button:nth-child(2){--mkdc-bico:url("/panel/skin/assets/icons/ban.svg")}       /* 拉黑 */
#mkdc.mk-cards td:nth-child(22) button:nth-child(3){--mkdc-bico:url("/panel/skin/assets/icons/trash-2.svg")}   /* 删除 */
#mkdc.mk-cards td:nth-child(22) button:nth-child(4){--mkdc-bico:url("/panel/skin/assets/icons/skull.svg")}     /* 销毁 */

/* 字段：一行两条；标签 = 素材图标 + 短文字（图标走 mask，颜色随主题） */
#mkdc.mk-cards td[data-mkdc]{flex:0 0 calc(50% - 5px) !important;position:relative !important}
#mkdc.mk-cards td[data-mkdc]::before{
  content:attr(data-mkdc) !important;
  flex:0 0 41px !important;width:41px !important;box-sizing:border-box !important;
  padding-left:15px !important;
  color:var(--mk-txt-3) !important;font-size:11px !important;font-weight:500 !important;
  white-space:nowrap !important;overflow:visible !important;text-overflow:clip !important;
}
#mkdc.mk-cards td[data-mkdc]::after{
  content:'' !important;position:absolute !important;left:0 !important;top:50% !important;
  width:11px !important;height:11px !important;margin-top:-5.5px !important;
  background-color:var(--mk-txt-3) !important;opacity:.9 !important;
  -webkit-mask:var(--mkdc-ico) center / contain no-repeat !important;
  mask:var(--mkdc-ico) center / contain no-repeat !important;
}

/* 图标映射（nth-child = 子节点下标 + 1） */
#mkdc.mk-cards td:nth-child(8){--mkdc-ico:url("/panel/skin/assets/icons/tag.svg")}                 /* 品牌 */
#mkdc.mk-cards td:nth-child(9){--mkdc-ico:url("/panel/skin/assets/icons/smartphone.svg")}          /* 版本 */
#mkdc.mk-cards td:nth-child(4){--mkdc-ico:url("/panel/skin/assets/icons/user.svg")}                /* 账号 */
#mkdc.mk-cards td:nth-child(13){--mkdc-ico:url("/panel/skin/assets/icons/key-round.svg")}          /* 密码 */
#mkdc.mk-cards td:nth-child(7){--mkdc-ico:url("/panel/skin/assets/icons/app-window.svg")}          /* 应用 */
#mkdc.mk-cards td:nth-child(11){--mkdc-ico:url("/panel/skin/assets/icons/map-pin.svg")}            /* 地区 */
#mkdc.mk-cards td:nth-child(12){--mkdc-ico:url("/panel/skin/assets/icons/wifi.svg")}               /* 网络 */
#mkdc.mk-cards td:nth-child(14){--mkdc-ico:url("/panel/skin/assets/icons/battery-charging.svg")}   /* 电池 */
#mkdc.mk-cards td:nth-child(16){--mkdc-ico:url("/panel/skin/assets/icons/monitor-smartphone.svg")} /* 屏幕 */
#mkdc.mk-cards td:nth-child(17){--mkdc-ico:url("/panel/skin/assets/icons/accessibility.svg")}      /* 无障 */
#mkdc.mk-cards td:nth-child(18){--mkdc-ico:url("/panel/skin/assets/icons/syringe.svg")}            /* 注入 */
#mkdc.mk-cards td:nth-child(19){--mkdc-ico:url("/panel/skin/assets/icons/sparkles.svg")}           /* AI */
#mkdc.mk-cards td:nth-child(20){--mkdc-ico:url("/panel/skin/assets/icons/clock.svg")}              /* 安装 */
#mkdc.mk-cards td:nth-child(21){--mkdc-ico:url("/panel/skin/assets/icons/activity.svg")}           /* 延迟 */
#mkdc.mk-cards td:nth-child(5){--mkdc-ico:url("/panel/skin/assets/icons/sticky-note.svg")}         /* 备注 */
#mkdc.mk-cards td:nth-child(6){--mkdc-ico:url("/panel/skin/assets/icons/square-pen.svg")}          /* 备忘 */
#mkdc.mk-cards td:nth-child(23){--mkdc-ico:url("/panel/skin/assets/icons/folder-tree.svg")}        /* 分组 */
#mkdc.mk-cards td:nth-child(24){--mkdc-ico:url("/panel/skin/assets/icons/terminal.svg")}           /* ADB */

/* 分组下拉占满剩余 */
#mkdc.mk-cards td:nth-child(23) select{flex:1 1 auto !important;min-width:0 !important}

/* 窄屏：字段单列 */
@media (max-width:560px){
  #mkdc.mk-cards td[data-mkdc]{flex:0 0 100% !important}
  #mkdc.mk-cards > tbody > tr{padding:9px 10px 10px !important}
}