/* ==========================================================================
   DevCN 正文渲染修复（2026-11-14）
   1) 代码块：清除行内 code 的浅底 / 内边距污染（否则每行变成白色长条）
   2) Markdown 表格：把渲染器漏掉的 | 表格补成真表格
   3) 代码块复制按钮
   只作用于文章与帖子的正文容器 .markdown-body
   ========================================================================== */

/* ---------- 1. 代码块 ---------- */
.markdown-body pre {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  tab-size: 2;
  padding-right: 52px !important; /* 给复制按钮留位，避免长行被覆盖 */
}

.markdown-body pre > code {
  display: block !important;
  background: transparent !important;
  color: inherit !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  white-space: pre;
  word-break: normal;
  overflow-wrap: normal;
}

/* 有些主题会给行内 code 加 ::before/::after 装饰符号 */
.markdown-body pre > code::before,
.markdown-body pre > code::after {
  content: none !important;
}

/* 行内代码（段落里）保持原样式，但确保可读 */
.markdown-body p code,
.markdown-body li code,
.markdown-body td code,
.markdown-body th code {
  color: var(--tw-ink-1d4ed8) !important;
  background: var(--tw-bg-eef3fd) !important;
  border: 1px solid var(--tw-line-dbe6fb);
  border-radius: 5px;
  padding: 1px 5px;
  font-size: .92em;
  white-space: nowrap;
  word-break: keep-all;
}

/* 代码块滚动条（macOS 隐藏式，Win 细条） */
.markdown-body pre::-webkit-scrollbar { height: 8px; }
.markdown-body pre::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .22); border-radius: 4px; }
.markdown-body pre::-webkit-scrollbar-track { background: transparent; }

/* 复制按钮 */
.md-copy {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 26px;
  padding: 0 9px;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1;
  color: #cbd6e8;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 6px;
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s ease, background .15s ease, color .15s ease;
  user-select: none;
  -webkit-user-select: none;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.markdown-body pre:hover .md-copy,
.md-copy:focus-visible { opacity: 1; }
.md-copy:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.md-copy.is-done { color: var(--tw-ink-86efac); border-color: rgba(134, 239, 172, .45); background: rgba(34, 197, 94, .18); }

@media (hover: none) {
  .md-copy { opacity: .78; }
  .markdown-body pre { padding-right: 68px !important; }
}

/* ---------- 2. Markdown 表格 ---------- */
.md-table-wrap {
  margin: 20px 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--tw-line-e2e9f5);
  border-radius: 12px;
  background: var(--tw-bg-fff);
  box-shadow: 0 1px 2px rgba(16, 32, 64, .04);
}

.md-table {
  display: table !important;
  width: 100% !important;
  min-width: 420px;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse !important;
  font-size: 14.5px;
  line-height: 1.62;
  color: var(--tw-ink-26324a);
  background: var(--tw-bg-fff);
}

.md-table thead th {
  padding: 11px 14px !important;
  text-align: left;
  font-weight: 650 !important;
  font-size: 14.5px !important;
  color: var(--tw-ink-17233b) !important;
  background: var(--tw-bg-f5f8fd) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tw-line-e2e9f5) !important;
  white-space: nowrap;
}

.md-table tbody td {
  padding: 10px 14px !important;
  font-size: 14.5px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tw-line-edf2f9) !important;
  vertical-align: top;
}

.md-table tbody tr:last-child td { border-bottom: 0 !important; }
.md-table tbody tr:nth-child(even) td { background: var(--tw-bg-fafcff) !important; }
.md-table code { white-space: nowrap; }

/* 表格右侧提示：内容可横向滑动 */
.md-table-wrap::after {
  content: "";
  display: block;
}

@media (max-width: 768px) {
  .md-table { font-size: 13.5px; min-width: 360px; }
  .md-table thead th { padding: 9px 11px; }
  .md-table td { padding: 8px 11px; }
  .markdown-body pre { border-radius: 8px; }
}
