/*! V7 · [R52] 键盘记录：按应用筛选 + 逐条「修改 / 删除」（mk-r52-keylog.css）—— 纯皮肤层
 *  给 mk-r52-keylog.js 注入的按钮/弹窗上样式；删掉 index.html 两行即回退
 * ========================================================================== */
/* ---------- 动作列不再加宽（沿用 R143 的 200px，多余药丸自动换行） ---------- */
.ctrl-page .ctrl-kl-tbl tbody td:nth-child(5),
.ctrl-page .ctrl-kl-tbl tbody td:last-child {
  white-space: normal !important; overflow: visible !important; text-overflow: clip !important;
}

/* ---------- 「修改 / 删除」按钮 ---------- */
.mk52-btn {
  display: inline-flex; align-items: center; justify-content: center;
  margin: 1px 0 1px 5px; padding: 1px 8px; height: 20px; vertical-align: middle;
  border: 1px solid rgba(37, 99, 235, .34); border-radius: 999px;
  background: rgba(37, 99, 235, .08); color: #1d4ed8;
  font: 600 10.5px/1.5 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  cursor: pointer; white-space: nowrap; transition: .15s;
}
.mk52-btn:hover { background: rgba(37, 99, 235, .18); border-color: rgba(37, 99, 235, .55); }
.mk52-btn:active { transform: translateY(1px); }
.mk52-btn.mk52-danger { border-color: rgba(220, 38, 38, .30); background: rgba(220, 38, 38, .07); color: #dc2626; }
.mk52-btn.mk52-danger:hover { background: rgba(220, 38, 38, .16); border-color: rgba(220, 38, 38, .50); }
html[data-theme="dark"] .mk52-btn { border-color: rgba(96, 165, 250, .38); background: rgba(96, 165, 250, .12); color: #93c5fd; }
html[data-theme="dark"] .mk52-btn:hover { background: rgba(96, 165, 250, .22); }
html[data-theme="dark"] .mk52-btn.mk52-danger { border-color: rgba(248, 113, 113, .36); background: rgba(248, 113, 113, .12); color: #fca5a5; }

/* ---------- 修改弹窗 ---------- */
.mk52-modal { display: none; position: fixed; inset: 0; z-index: 2147483200; background: rgba(15, 23, 42, .40); backdrop-filter: blur(2px); }
.mk52-modal.on { display: flex; align-items: center; justify-content: center; padding: 24px; }
.mk52-card {
  width: min(560px, 94vw); max-height: 88vh; display: flex; flex-direction: column;
  background: #fff; color: #111827; border-radius: 16px; overflow: hidden;
  box-shadow: 0 24px 70px rgba(2, 6, 23, .34);
  font: 13px/1.6 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
}
html[data-theme="dark"] .mk52-card { background: #111827; color: #e5e7eb; box-shadow: 0 24px 70px rgba(0, 0, 0, .6); }
.mk52-hd { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 16px; border-bottom: 1px solid #eef2f7; }
html[data-theme="dark"] .mk52-hd { border-bottom-color: #1f2937; }
.mk52-hd b { font-size: 14.5px; font-weight: 700; }
.mk52-badge { margin-left: 8px; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 700; color: #1d4ed8; background: rgba(37, 99, 235, .10); }
.mk52-x { cursor: pointer; color: #94a3b8; padding: 2px 7px; border-radius: 7px; font-size: 15px; line-height: 1.2; }
.mk52-x:hover { background: #f1f5f9; color: #334155; }
.mk52-body { padding: 14px 16px; overflow: auto; }
.mk52-f { display: block; margin-bottom: 11px; }
.mk52-f > span { display: block; font-size: 11.5px; font-weight: 700; color: #64748b; margin-bottom: 4px; }
html[data-theme="dark"] .mk52-f > span { color: #94a3b8; }
.mk52-g { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mk52-text, .mk52-app, .mk52-pkg {
  width: 100%; box-sizing: border-box; padding: 7px 9px; border: 1px solid #dbe2ea; border-radius: 9px;
  background: #fbfdff; color: inherit; font: 12.5px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, "Microsoft YaHei", monospace;
  resize: vertical; outline: none;
}
.mk52-app, .mk52-pkg { font-family: system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif; }
html[data-theme="dark"] .mk52-text, html[data-theme="dark"] .mk52-app, html[data-theme="dark"] .mk52-pkg { background: #0b1220; border-color: #1f2937; }
.mk52-text:focus, .mk52-app:focus, .mk52-pkg:focus { border-color: #93c5fd; box-shadow: 0 0 0 3px rgba(59, 130, 246, .14); }
.mk52-hint { font-size: 11.5px; color: #94a3b8; }
.mk52-ft { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 16px; border-top: 1px solid #eef2f7; background: #fafbfd; }
html[data-theme="dark"] .mk52-ft { border-top-color: #1f2937; background: #0b1220; }
.mk52-tip { font-size: 11.5px; color: #64748b; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk52-acts { display: flex; gap: 8px; flex: 0 0 auto; }
.mk52-b {
  padding: 6px 13px; border: 1px solid #dbe2ea; border-radius: 9px; background: #fff; color: #334155;
  font: 600 12px/1.4 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif; cursor: pointer; transition: .15s;
}
.mk52-b:hover { background: #f1f5f9; }
.mk52-b-primary { border-color: #2563eb; background: #2563eb; color: #fff; }
.mk52-b-primary:hover { background: #1d4ed8; }
.mk52-b-danger { border-color: rgba(220, 38, 38, .34); background: rgba(220, 38, 38, .07); color: #dc2626; }
.mk52-b-danger:hover { background: rgba(220, 38, 38, .16); }
html[data-theme="dark"] .mk52-b { background: #111827; border-color: #1f2937; color: #e5e7eb; }
html[data-theme="dark"] .mk52-b:hover { background: #1f2937; }
html[data-theme="dark"] .mk52-b-primary { background: #2563eb; border-color: #2563eb; color: #fff; }
html[data-theme="dark"] .mk52-b-danger { background: rgba(248, 113, 113, .12); border-color: rgba(248, 113, 113, .36); color: #fca5a5; }

/* ---------- 轻量 toast ---------- */
.mk52-toast {
  position: fixed; left: 50%; top: 14px; transform: translate(-50%, -14px); z-index: 2147483300;
  padding: 8px 16px; border: 1px solid rgba(148, 163, 184, .5); border-radius: 999px;
  background: rgba(255, 255, 255, .97); box-shadow: 0 10px 30px rgba(2, 6, 23, .18);
  font: 600 12.5px/1.5 system-ui, -apple-system, "Segoe UI", "Microsoft YaHei", sans-serif;
  opacity: 0; pointer-events: none; transition: .22s; max-width: 76vw;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mk52-toast.on { opacity: 1; transform: translate(-50%, 0); }
html[data-theme="dark"] .mk52-toast { background: rgba(17, 24, 39, .97); }

/* ---------- [R52] 右侧窄停靠（>=1500 三栏）时表格 5 列挤不下 → 「内容」列被压成 0。
   用容器查询在窄停靠下压窄 类型/应用/时间/动作 四列，把宽度让给「内容」；
   选择器前缀必须压过 mk-r141.css / mk-r152.css 的 html body .ctrl-page .mk-r141-keylog ... 那条。
   宽屏全宽布局（<1500）不受影响。 ---------- */
.mk-r141-keylog { container-type: inline-size; }
@container (max-width: 470px) {
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl thead th:nth-child(1),
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl tbody td:nth-child(1) { width: 42px !important; }
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl thead th:nth-child(3),
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl tbody td:nth-child(3) { width: 52px !important; }
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl thead th:nth-child(4),
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl tbody td:nth-child(4) { width: 54px !important; }
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl thead th:nth-child(5),
  html body .ctrl-page .mk-r141-keylog .ctrl-kl-tbl tbody td:nth-child(5) { width: 118px !important; }
}