/* 自定义主题覆盖样式 - 此文件会覆盖主题默认样式 */

/* ========== 修复侧边栏折叠状态 - 完全隐藏内容 ========== */

/* 确保折叠状态下内容完全隐藏，不可点击 */
.sidebar-explorer .section-content.collapsed {
  max-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important; /* 禁止点击 */
}

/* 移动端也生效 */
.sidebar-explorer.show .section-content.collapsed {
  max-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ========== 移除侧边栏 explorer-header 下方的浅色线条 ========== */

/* 移除 explorer-header 的所有边框和装饰 */
.sidebar-explorer .explorer-header,
.sidebar-explorer .explorer-header span,
.sidebar-explorer .explorer-header .explorer-title {
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
  outline: none !important;
}

/* 移除 explorer-header 的伪元素边框 */
.sidebar-explorer .explorer-header::before,
.sidebar-explorer .explorer-header::after,
.sidebar-explorer .explorer-header span::before,
.sidebar-explorer .explorer-header span::after {
  content: none !important;
  border: none !important;
  display: none !important;
  height: 0 !important;
  width: 0 !important;
}

/* 移除 explorer-header 和 explorer-section 之间的边框 */
.sidebar-explorer .explorer-header + .explorer-section {
  border-top: none !important;
  margin-top: 10px !important;
  padding-top: 0 !important;
}

/* 确保移动端也生效 */
.sidebar-explorer.show .explorer-header,
.sidebar-explorer.show .explorer-header span {
  border: none !important;
  border-bottom: none !important;
  text-decoration: none !important;
}

/* ========== Safari 固定定位全局修复 ========== */

/* 确保 body 和 html 不影响固定定位 */
html, body {
  -webkit-transform: none !important;
  transform: none !important;
}

/* ========== 主页文章卡片标题对齐修复 ========== */

/* 强制 flex 布局并垂直居中对齐 */
.post-card .post-header {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  line-height: 1 !important;
}

/* 图标样式 - 统一字体大小和行高 */
.post-card .post-header i.fas {
  font-size: 18px !important;
  line-height: 1 !important;
  height: auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: baseline !important;
  flex-shrink: 0 !important;
}

/* 标题容器 */
.post-card .post-header .post-title {
  display: inline-block !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 标题链接 - 统一字体和行高 */
.post-card .post-header .post-title a {
  font-size: 18px !important;
  line-height: 1 !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: baseline !important;
}

/* ========== Header 导航栏间距 ========== */

/* Header 下外边距 */
.vs-header {
  margin-bottom: 6px !important;
  /* Safari 固定定位修复 - 简化版 */
  -webkit-transform: translate3d(0, 0, 0) !important;
  transform: translate3d(0, 0, 0) !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
}

/* ========== 正文段落宽度优化 ========== */

/* 桌面端和移动端都移除段落宽度限制，充分利用屏幕空间 */
.post-body.vscode-markdown p,
.vscode-markdown p,
div.vscode-markdown p {
  max-width: none !important; /* 移除宽度限制，文字充满容器 */
}

/* ========== 正文容器内边距优化 ========== */

/* 桌面端增大 post-content 的左右内边距 */
@media (min-width: 769px) {
  .post-content {
    padding-left: 55px !important;
    padding-right: 55px !important;
  }
}

/* 移动端增大 post-content 的左右内边距 */
@media (max-width: 768px) {
  .post-content {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ========== 推荐文章板块优化 ========== */

/* 移动端隐藏推荐文章板块 */
@media (max-width: 768px) {
  .vs-recommended-posts {
    display: none !important;
  }
}

/* ========== Footer 页脚优化 ========== */

/* Footer Safari 固定定位修复 - 简化版 */
.footer {
  -webkit-transform: translate3d(0, 0, 0) !important;
  transform: translate3d(0, 0, 0) !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
}

/* 隐藏 "Designed By BlackCat" */
.footer .status-bar .status-item:nth-child(4) {
  display: none !important;
}

/* 隐藏 GitHub 图标链接 */
.footer .status-bar .status-item.github {
  display: none !important;
}

/* ========== 移动端 Footer 优化 ========== */

/* 移动端保持水平排列 */
@media (max-width: 768px) {
  .status-bar {
    flex-direction: row !important; /* 强制水平排列 */
    flex-wrap: wrap !important; /* 允许换行但保持水平 */
    justify-content: center !important;
  }
}

/* 小屏幕也保持水平排列 */
@media (max-width: 480px) {
  .status-bar {
    flex-direction: row !important; /* 强制水平排列 */
    flex-wrap: wrap !important; /* 允许换行 */
    justify-content: center !important;
    gap: 8px !important; /* 项目之间的间距 */
  }

  .status-item {
    margin: 2px 4px !important; /* 添加水平和垂直间距 */
  }
}

/* ========== Waline 评论区字体颜色优化 ========== */

/* 深色主题下的评论内容文字 - 提高对比度 */
:root[data-theme="dark"] #waline .wl-content {
  color: #e4e4e4 !important; /* 更亮的白色，原来是 #d4d4d4 */
}

/* 更具体的选择器 - 评论卡片中的内容 */
:root[data-theme="dark"] #waline .wl-card-item .wl-card .wl-content,
:root[data-theme="dark"] #waline .wl-card .wl-content {
  color: #e4e4e4 !important;
}

/* 评论内容中的段落和文本 */
:root[data-theme="dark"] #waline .wl-content p,
:root[data-theme="dark"] #waline .wl-content span,
:root[data-theme="dark"] #waline .wl-content div {
  color: #e4e4e4 !important;
}

/* 深色主题下的评论输入框文字 */
:root[data-theme="dark"] #waline .wl-editor {
  color: #e4e4e4 !important;
}

/* 深色主题下的昵称字段 */
:root[data-theme="dark"] #waline .wl-input {
  color: #e4e4e4 !important;
}

/* 深色主题下的时间戳 - 提高可读性 */
:root[data-theme="dark"] #waline .wl-time {
  color: #b8b8b8 !important; /* 原来是 #a7a7a7，调亮一点 */
}

/* 深色主题下的回复内容 */
:root[data-theme="dark"] #waline .wl-quote {
  color: #d4d4d4 !important;
  border-left-color: #569cd6 !important;
}

/* 深色主题下的元信息文字（如"回复"、"编辑"等） */
:root[data-theme="dark"] #waline .wl-meta-item {
  color: #b8b8b8 !important;
}

/* 评论作者昵称 */
:root[data-theme="dark"] #waline .wl-nick {
  color: #6eb5ff !important;
}

/* 评论头部信息 */
:root[data-theme="dark"] #waline .wl-head {
  color: #b8b8b8 !important;
}

/* 浅色主题保持不变 */
:root[data-theme="white"] #waline .wl-content {
  color: #1e1e1e !important;
}

:root[data-theme="white"] #waline .wl-editor {
  color: #1e1e1e !important;
}

:root[data-theme="white"] #waline .wl-input {
  color: #1e1e1e !important;
}

/* 评论区整体文字对比度增强 */
#waline .wl-card {
  color: var(--vscode-text) !important;
}

/* 评论区链接颜色优化 */
#waline .wl-content a {
  color: #6eb5ff !important; /* 更亮的蓝色 */
  text-decoration: underline;
}

#waline .wl-content a:hover {
  color: #8cc9ff !important;
}

/* 评论区代码块文字优化 */
#waline .wl-content code {
  color: #f5c2a2 !important; /* 更亮的橙色 */
  background-color: rgba(255, 255, 255, 0.1) !important;
}

/* 评论区预览文字 */
#waline .wl-preview {
  color: #e4e4e4 !important;
}

/* ========== Waline 输入框 Dark 模式优化 ========== */

/* 深色主题下的编辑器容器 */
:root[data-theme="dark"] #waline .wl-panel {
  background: #1e1e1e !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 6px !important;
  /* padding 由折叠/展开状态统一控制，删除此处的 padding-bottom 避免错位 */
}

/* 深色主题下的文本输入框 */
:root[data-theme="dark"] #waline .wl-editor,
:root[data-theme="dark"] #waline textarea.wl-editor {
  background: #1e1e1e !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 4px !important;
  color: #cccccc !important;
  padding: 12px !important;
  transition: all 0.2s ease !important;
  margin-top: 4px !important; /* 上边距为 4px */
  margin-bottom: 0 !important; /* 下边距为 0 */
}

/* 输入框聚焦状态 */
:root[data-theme="dark"] #waline .wl-editor:focus,
:root[data-theme="dark"] #waline textarea.wl-editor:focus {
  background: #252526 !important;
  border-color: #007acc !important;
  outline: none !important;
  box-shadow: 0 0 0 1px #007acc !important;
}

/* 输入框占位符文字 */
:root[data-theme="dark"] #waline .wl-editor::placeholder,
:root[data-theme="dark"] #waline textarea.wl-editor::placeholder {
  color: #6c6c6c !important;
  opacity: 1 !important;
}

/* 昵称、邮箱、网址输入框 */
:root[data-theme="dark"] #waline .wl-input {
  background: #1e1e1e !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 4px !important;
  color: #cccccc !important;
  padding: 8px 12px !important;
  transition: all 0.2s ease !important;
  height: auto !important;
  line-height: 1 !important; /* 最紧凑的行高 */
  font-size: 0.875rem !important; /* 统一字体大小 */
  box-sizing: border-box !important; /* 确保 padding 包含在高度内 */
  margin-left: 3px !important; /* 左外边距 */
  margin-right: 3px !important; /* 右外边距 */
}

:root[data-theme="dark"] #waline .wl-input:focus {
  background: #252526 !important;
  border-color: #007acc !important;
  outline: none !important;
  box-shadow: 0 0 0 1px #007acc !important;
}

:root[data-theme="dark"] #waline .wl-input::placeholder {
  color: #6c6c6c !important;
  opacity: 1 !important;
}

/* 提交按钮 */
:root[data-theme="dark"] #waline .wl-btn {
  background: #0e639c !important;
  border: none !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  padding: 8px 16px !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}

:root[data-theme="dark"] #waline .wl-btn:hover {
  background: #1177bb !important;
  box-shadow: 0 2px 8px rgba(0, 122, 204, 0.3) !important;
}

:root[data-theme="dark"] #waline .wl-btn:active {
  background: #0d5a8f !important;
  transform: translateY(1px) !important;
}

/* 取消按钮 */
:root[data-theme="dark"] #waline .wl-cancel-btn {
  background: transparent !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 4px !important;
  color: #cccccc !important;
  padding: 8px 16px !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}

:root[data-theme="dark"] #waline .wl-cancel-btn:hover {
  background: #2d2d30 !important;
  border-color: #505050 !important;
}

/* 预览标签页 */
:root[data-theme="dark"] #waline .wl-tabs {
  border-bottom: 1px solid #3c3c3c !important;
}

:root[data-theme="dark"] #waline .wl-tab {
  color: #8c8c8c !important;
  border-bottom: 2px solid transparent !important;
  transition: all 0.2s ease !important;
}

:root[data-theme="dark"] #waline .wl-tab:hover {
  color: #cccccc !important;
}

:root[data-theme="dark"] #waline .wl-tab.wl-active {
  color: #007acc !important;
  border-bottom-color: #007acc !important;
}

/* 工具栏图标 */
:root[data-theme="dark"] #waline .wl-action {
  color: #8c8c8c !important;
  transition: all 0.2s ease !important;
}

:root[data-theme="dark"] #waline .wl-action:hover {
  color: #cccccc !important;
  background: #2d2d30 !important;
  border-radius: 4px !important;
}

/* 隐藏 emoji 按钮 */
:root[data-theme="dark"] #waline .wl-action[title*="Emoji"],
:root[data-theme="dark"] #waline .wl-action[title*="emoji"],
:root[data-theme="dark"] #waline .wl-emoji {
  display: none !important;
}

/* 隐藏 emoji 面板 */
:root[data-theme="dark"] #waline .wl-emoji-popup {
  display: none !important;
}

/* 分页按钮 */
:root[data-theme="dark"] #waline .wl-page-link {
  background: #1e1e1e !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 4px !important;
  color: #cccccc !important;
  transition: all 0.2s ease !important;
}

:root[data-theme="dark"] #waline .wl-page-link:hover {
  background: #2d2d30 !important;
  border-color: #505050 !important;
}

:root[data-theme="dark"] #waline .wl-page-link.active {
  background: #0e639c !important;
  border-color: #007acc !important;
  color: #ffffff !important;
}

/* 加载动画 */
:root[data-theme="dark"] #waline .wl-loading {
  color: #007acc !important;
}

/* 信息提示 - 透明化容器，强制单行布局 */
#waline .wl-info,
:root[data-theme="dark"] #waline .wl-info,
:root[data-theme="white"] #waline .wl-info {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  /* 使用 flexbox 控制布局 */
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;  /* 强制不换行，保持单行 */
}

/* 确保计数器不会被挤压 */
#waline .wl-text-number,
:root[data-theme="dark"] #waline .wl-text-number,
:root[data-theme="white"] #waline .wl-text-number {
  flex-shrink: 0 !important;  /* 不缩小 */
  white-space: nowrap !important;  /* 文字不换行 */
}

/* 优化整体容器 */
:root[data-theme="dark"] #waline {
  color: #cccccc !important;
}

/* 修复预览区域背景 */
:root[data-theme="dark"] #waline .wl-preview {
  background: #1e1e1e !important;
  border: 1px solid #3c3c3c !important;
  border-radius: 4px !important;
  padding: 12px !important;
  color: #cccccc !important;
}

/* 修复预览区域中的 hr 分割线（白色虚线） */
:root[data-theme="dark"] #waline .wl-preview hr {
  border: none !important;
  border-top: 1px solid #3c3c3c !important; /* 改为灰色实线 */
  height: 0 !important;
  margin: 12px 0 !important;
}

/* 同时修复评论内容中的 hr */
:root[data-theme="dark"] #waline .wl-content hr {
  border: none !important;
  border-top: 1px solid #3c3c3c !important;
  height: 0 !important;
  margin: 12px 0 !important;
}

/* 优化输入框内的 Markdown 提示 */
:root[data-theme="dark"] #waline .wl-editor-wrapper {
  background: transparent !important;
}

/* 修复头像边框 */
:root[data-theme="dark"] #waline .wl-avatar {
  border: 2px solid #3c3c3c !important;
  border-radius: 50% !important;
}

:root[data-theme="dark"] #waline .wl-avatar:hover {
  border-color: #505050 !important;
}

/* 隐藏 Markdown Guide 按钮 */
#waline .wl-actions a.wl-action[title="Markdown Guide"],
#waline .wl-actions a.wl-action[href*="markdown"] {
  display: none !important;
}

/* 隐藏预览按钮和预览标签页 */
#waline .wl-tabs,
:root[data-theme="dark"] #waline .wl-tabs,
:root[data-theme="white"] #waline .wl-tabs {
  display: none !important;
}

/* 隐藏 wl-actions 中的预览按钮 */
#waline .wl-actions button.wl-action[title*="预览"],
#waline .wl-actions button.wl-action[title*="Preview"],
#waline .wl-actions .wl-action[title*="预览"],
#waline .wl-actions .wl-action[title*="Preview"],
:root[data-theme="dark"] #waline .wl-actions button.wl-action[title*="预览"],
:root[data-theme="dark"] #waline .wl-actions button.wl-action[title*="Preview"],
:root[data-theme="white"] #waline .wl-actions button.wl-action[title*="预览"],
:root[data-theme="white"] #waline .wl-actions button.wl-action[title*="Preview"] {
  display: none !important;
}

/* 隐藏预览区域 */
#waline .wl-preview,
:root[data-theme="dark"] #waline .wl-preview,
:root[data-theme="white"] #waline .wl-preview {
  display: none !important;
}

/* 移除评论输入框头部的虚线边框 */
:root[data-theme="dark"] #waline .wl-header {
  border-bottom: 1px solid #3c3c3c !important; /* 改为实线，与整体风格一致 */
  margin-top: 4px !important; /* 统一上边距 */
  margin-bottom: 4px !important; /* 统一下边距 */
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* 或者完全隐藏边框（如果不需要分割线） */
:root[data-theme="dark"] #waline .wl-header.item3 {
  border-bottom: none !important;
}

/* 评论输入框底部的外边距和内边距 - 统一上下间距 */
:root[data-theme="dark"] #waline .wl-footer {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

/* 更具体的选择器 - 确保覆盖 */
:root[data-theme="dark"] #waline .wl-panel .wl-footer,
:root[data-theme="dark"] div#waline .wl-comment .wl-panel .wl-footer,
:root[data-theme="dark"] #waline .wl-comment .wl-panel .wl-footer {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

/* 修复 nickname、email、website 输入框的虚线边框 */
:root[data-theme="dark"] #waline .wl-header-item .wl-input {
  border: none !important;
  border-bottom: 1px solid #3c3c3c !important;
  outline: none !important; /* 移除 outline 虚线 */
  text-decoration: none !important; /* 移除文本装饰虚线 */
  box-shadow: none !important; /* 移除可能的阴影虚线 */
}

/* 移动端和桌面端所有输入框的通用虚线清除 */
:root[data-theme="dark"] #waline input,
:root[data-theme="dark"] #waline textarea {
  border: none !important;
  outline: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

/* 为需要的输入框添加完整边框 - 桌面端 */
:root[data-theme="dark"] #waline .wl-header .wl-header-item input,
:root[data-theme="dark"] #waline .wl-header-item input.wl-input,
:root[data-theme="dark"] #waline div.wl-header-item > input,
:root[data-theme="dark"] #waline .wl-header-item textarea {
  border: 1px solid #3c3c3c !important;
  border-radius: 4px !important;
  background: #1e1e1e !important;
  padding: 8px 12px !important;
}

:root[data-theme="dark"] #waline .wl-header .wl-header-item input:focus,
:root[data-theme="dark"] #waline .wl-header-item input.wl-input:focus,
:root[data-theme="dark"] #waline div.wl-header-item > input:focus,
:root[data-theme="dark"] #waline .wl-header-item textarea:focus {
  border: 1px solid #007acc !important;
  background: #252526 !important;
  box-shadow: 0 0 0 1px #007acc !important;
}

/* 中等屏幕（小于 960px）：Name/Mail/URL 改为垂直布局 */
@media (max-width: 960px) {
  /* header 改为垂直布局 */
  :root[data-theme="dark"] #waline .wl-header,
  :root[data-theme="white"] #waline .wl-header,
  #waline .wl-header {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  /* 每个 header-item 占满宽度 */
  :root[data-theme="dark"] #waline .wl-header .wl-header-item,
  :root[data-theme="white"] #waline .wl-header .wl-header-item,
  #waline .wl-header .wl-header-item {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
  }

  /* 标签统一宽度，左对齐 */
  :root[data-theme="dark"] #waline .wl-header .wl-header-item label,
  :root[data-theme="white"] #waline .wl-header .wl-header-item label,
  #waline .wl-header .wl-header-item label {
    min-width: 70px !important;
    width: 70px !important;
    flex-shrink: 0 !important;
    text-align: left !important;
  }

  /* 输入框占据剩余空间 */
  :root[data-theme="dark"] #waline .wl-header .wl-header-item .wl-input,
  :root[data-theme="white"] #waline .wl-header .wl-header-item .wl-input,
  #waline .wl-header .wl-header-item .wl-input {
    flex: 1 !important;
    width: auto !important;
  }
}

/* 特别针对移动端的输入框 */
@media (max-width: 768px) {
  /* 强制所有 Waline 输入框为完整边框 */
  :root[data-theme="dark"] #waline input.wl-input,
  :root[data-theme="dark"] #waline textarea.wl-input,
  :root[data-theme="dark"] #waline .wl-input {
    border: 1px solid #3c3c3c !important;
    border-radius: 4px !important;
  }

  :root[data-theme="dark"] #waline input.wl-input:focus,
  :root[data-theme="dark"] #waline textarea.wl-input:focus,
  :root[data-theme="dark"] #waline .wl-input:focus {
    border: 1px solid #007acc !important;
    box-shadow: 0 0 0 1px #007acc !important;
  }

  /* 针对 header 中的输入框（nickname、email、website） - 最高优先级 */
  :root[data-theme="dark"] #waline .wl-header .wl-header-item input,
  :root[data-theme="dark"] #waline .wl-header-item input.wl-input,
  :root[data-theme="dark"] #waline div.wl-header-item > input {
    border: 1px solid #3c3c3c !important;
    border-radius: 4px !important;
  }

  :root[data-theme="dark"] #waline .wl-header .wl-header-item input:focus,
  :root[data-theme="dark"] #waline .wl-header-item input.wl-input:focus,
  :root[data-theme="dark"] #waline div.wl-header-item > input:focus {
    border: 1px solid #007acc !important;
    box-shadow: 0 0 0 1px #007acc !important;
  }

  /* 移除 header-item 之间的分割线（nickname 和 email 之间） */
  :root[data-theme="dark"] #waline .wl-header-item {
    border: none !important;
    border-bottom: none !important;
  }

  /* 移除 label 可能的边框 */
  :root[data-theme="dark"] #waline .wl-header-item label {
    border: none !important;
  }

  /* 统一移动端标签宽度，让输入框对齐 */
  :root[data-theme="dark"] #waline .wl-header .wl-header-item {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
  }

  :root[data-theme="dark"] #waline .wl-header .wl-header-item label {
    min-width: 80px !important;
    width: 80px !important;
    flex-shrink: 0 !important;
    text-align: left !important;
  }

  :root[data-theme="dark"] #waline .wl-header .wl-header-item .wl-input {
    flex: 1 !important;
    width: auto !important;
  }
}

/* 桌面端也统一标签宽度 */
:root[data-theme="dark"] #waline .wl-header .wl-header-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

:root[data-theme="dark"] #waline .wl-header .wl-header-item label {
  min-width: 70px !important;
  flex-shrink: 0 !important;
  text-align: right !important;
  color: #cccccc !important;
}

/* ========== Waline 优化 ========== */

/* 隐藏 Waline 版权信息 */
:root[data-theme="dark"] #waline .wl-power,
#waline .wl-power {
  display: none !important;
}

/* 字符计数 - 统一字体大小为 0.65rem（所有主题、所有设备）*/
#waline .wl-text-number,
:root[data-theme="dark"] #waline .wl-text-number,
:root[data-theme="white"] #waline .wl-text-number {
  font-size: 0.65rem !important;
}

#waline .wl-info,
:root[data-theme="dark"] #waline .wl-info,
:root[data-theme="white"] #waline .wl-info {
  font-size: 0.65rem !important;
}

/* 深色主题下的颜色 */
:root[data-theme="dark"] #waline .wl-text-number,
:root[data-theme="dark"] #waline .wl-info {
  color: #8c8c8c !important;
}

/* 移动端字符计数 - 统一字体大小为 0.65rem（所有主题）*/
@media (max-width: 768px) {
  #waline .wl-text-number,
  :root[data-theme="dark"] #waline .wl-text-number,
  :root[data-theme="white"] #waline .wl-text-number {
    font-size: 0.65rem !important;
  }

  #waline .wl-info,
  :root[data-theme="dark"] #waline .wl-info,
  :root[data-theme="white"] #waline .wl-info {
    font-size: 0.65rem !important;
  }
}

/* 评论区紧凑优化 */

/* 头像缩小 - 进一步压缩 */
:root[data-theme="dark"] #waline .wl-avatar {
  width: 28px !important;
  height: 28px !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-avatar {
    width: 20px !important;
    height: 20px !important;
  }
}

/* 评论卡片间距优化 - 进一步压缩 */
:root[data-theme="dark"] #waline .wl-card-item {
  padding: 0.625rem !important;
  margin-bottom: 0.75rem !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-card-item {
    padding: 0.375rem !important;
    margin-bottom: 0.5rem !important;
  }
}

/* 昵称字体 - 进一步缩小 */
:root[data-theme="dark"] #waline .wl-nick {
  font-size: 0.875rem !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-nick {
    font-size: 0.8125rem !important;
  }
}

/* 时间戳字体 - 进一步缩小 */
:root[data-theme="dark"] #waline .wl-time {
  font-size: 0.75rem !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-time {
    font-size: 0.7rem !important;
  }
}

/* 操作按钮字体 - 进一步缩小 */
:root[data-theme="dark"] #waline .wl-meta-item,
:root[data-theme="dark"] #waline .wl-reply {
  font-size: 0.75rem !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-meta-item,
  :root[data-theme="dark"] #waline .wl-reply {
    font-size: 0.7rem !important;
  }
}

/* 减少评论头部间距 - 进一步压缩 */
:root[data-theme="dark"] #waline .wl-head {
  margin-bottom: 0.375rem !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-head {
    margin-bottom: 0.25rem !important;
  }
}

/* 减少评论列表容器上边距 */
:root[data-theme="dark"] #waline .wl-cards {
  margin-top: 1rem !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-cards {
    margin-top: 0.75rem !important;
  }
}

/* 评论内容字体保持可读性 */
:root[data-theme="dark"] #waline .wl-content {
  font-size: 0.9375rem !important;
  line-height: 1.5 !important;
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-content {
    font-size: 0.875rem !important;
    line-height: 1.45 !important;
    margin-bottom: 0 !important;
  }
}

/* ========== Waline 按钮主题色适配 ========== */

/* 隐藏排序按钮（Latest/Oldest/Hottest）*/
#waline .wl-sort,
#waline .wl-meta-head .wl-sort,
#waline ul.wl-sort,
:root[data-theme="dark"] #waline .wl-sort,
:root[data-theme="white"] #waline .wl-sort {
  display: none !important;
}

/* ========== Archives 页面布局优化 - 参考移动端纵向布局 ========== */

/* 桌面端也使用纵向布局，像移动端一样 */
.timeline-post {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
  align-items: flex-start !important;
}

.post-date {
  min-width: auto !important;
  align-self: flex-start !important; /* 强制左对齐 */
}

/* post-info 内部也使用紧凑的纵向布局 */
.post-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.3rem !important;
  width: 100% !important;
  align-items: flex-start !important; /* 强制左对齐 */
}

/* 标题左对齐 */
.timeline-post .post-info > a {
  align-self: flex-start !important;
  text-align: left !important;
}

/* 取消 post-meta 的上边距，由 gap 控制 */
.timeline-post .post-meta {
  margin-top: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.3rem !important;
  align-items: flex-start !important;
  align-self: flex-start !important; /* 强制左对齐 */
}

.timeline-post .post-meta .category,
.timeline-post .post-meta .tags {
  display: flex !important;
  align-items: center !important;
  gap: 0.3rem !important;
  align-self: flex-start !important; /* 强制左对齐 */
}

/* ========== Categories 页面布局修复 ========== */

/* 防止 Grid 布局拉伸分类容器 */
.category-section {
  align-self: start !important; /* 防止被 Grid 拉伸 */
  height: auto !important; /* 自动高度 */
}

/* 确保 Grid 容器正确对齐 */
@media (min-width: 1200px) {
  .categories-overview {
    align-items: start !important; /* 顶部对齐，不拉伸 */
  }
}

/* ========== Tags 页面优化 ========== */

/* 隐藏 Tags 页面的标题行 */
.tags-overview h1 {
  display: none !important;
}

/* ========== Search 页面优化 ========== */

/* 隐藏 Search 页面的 header */
.vs-search-header {
  display: none !important;
}

.vs-search-header p {
  display: none !important;
}

/* ========== Waline 强制主题色覆盖（最高优先级） ========== */

/* 排序按钮 - 基础样式（不强制背景，让 Waline 控制） */
:root[data-theme="dark"] #waline .wl-sort button {
  color: #8c8c8c !important;
  border-color: #3c3c3c !important;
  transition: all 0.2s ease !important;
}

/* 排序按钮 - Hover 状态 */
:root[data-theme="dark"] #waline .wl-sort button:hover {
  color: #cccccc !important;
  border-color: #505050 !important;
}

/* 排序按钮 - 激活状态（白色） */
:root[data-theme="dark"] #waline .wl-sort button.active {
  background-color: transparent !important;
  color: #ffffff !important;
  border-color: #505050 !important;
}

/* Like 按钮 - 基础样式 */
:root[data-theme="dark"] #waline .wl-like,
:root[data-theme="dark"] #waline button.wl-like,
:root[data-theme="dark"] #waline .wl-meta-item.wl-like,
:root[data-theme="dark"] #waline span.wl-like {
  color: #8c8c8c !important;
  transition: all 0.2s ease !important;
}

/* Like 按钮 - Hover 状态 */
:root[data-theme="dark"] #waline .wl-like:hover,
:root[data-theme="dark"] #waline button.wl-like:hover,
:root[data-theme="dark"] #waline .wl-meta-item.wl-like:hover,
:root[data-theme="dark"] #waline span.wl-like:hover {
  color: #cccccc !important;
}

/* Like 按钮 - 激活状态（强制蓝色） */
:root[data-theme="dark"] #waline .wl-like.active,
:root[data-theme="dark"] #waline button.wl-like.active,
:root[data-theme="dark"] #waline .wl-meta-item.wl-like.active,
:root[data-theme="dark"] #waline span.wl-like.active,
:root[data-theme="dark"] #waline .wl-like.actived,
:root[data-theme="dark"] #waline button.wl-like.actived,
:root[data-theme="dark"] #waline .wl-meta-item.wl-like.actived,
:root[data-theme="dark"] #waline span.wl-like.actived,
:root[data-theme="dark"] #waline .wl-like[class*="active"],
:root[data-theme="dark"] #waline span.wl-like[class*="active"] {
  color: #007acc !important;
}

:root[data-theme="dark"] #waline .wl-like.active svg,
:root[data-theme="dark"] #waline .wl-like.active path,
:root[data-theme="dark"] #waline button.wl-like.active svg,
:root[data-theme="dark"] #waline button.wl-like.active path,
:root[data-theme="dark"] #waline .wl-like.actived svg,
:root[data-theme="dark"] #waline .wl-like.actived path,
:root[data-theme="dark"] #waline span.wl-like.active svg,
:root[data-theme="dark"] #waline span.wl-like.active path {
  fill: #007acc !important;
  stroke: #007acc !important;
  color: #007acc !important;
}

/* 预览按钮 - 激活状态（强制蓝色） */
:root[data-theme="dark"] #waline .wl-tab.wl-active,
:root[data-theme="dark"] #waline .wl-tab.active,
:root[data-theme="dark"] #waline .wl-tab[class*="active"] {
  color: #007acc !important;
  border-bottom-color: #007acc !important;
}

/* Submit 按钮样式 - 与计数器字体大小一致 */
:root[data-theme="dark"] #waline .wl-btn,
:root[data-theme="dark"] #waline button[type="submit"] {
  font-size: 0.65rem !important; /* 与计数器一致 */
  font-weight: 500 !important;
  padding: 8px 16px !important;
}

@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-btn,
  :root[data-theme="dark"] #waline button[type="submit"] {
    font-size: 0.65rem !important; /* 移动端也一致 */
  }
}

/* ========== 强制覆盖 Waline 主题色（根级别） ========== */

/* 覆盖 :root 的默认绿色主题 */
:root {
  --waline-theme-color: #007acc !important;
  --waline-active-color: #007acc !important;
}

/* 深色主题也强制蓝色 */
:root[data-theme="dark"] {
  --waline-theme-color: #007acc !important;
  --waline-active-color: #007acc !important;
  --waline-color: #8c8c8c !important;
}

/* ========== 强制覆盖按钮激活色（超高优先级） ========== */

/* Like 按钮 - 使用 !important 和属性选择器强制覆盖 */
:root[data-theme="dark"] #waline .wl-like.active *,
:root[data-theme="dark"] #waline .wl-like.actived *,
:root[data-theme="dark"] #waline span.wl-like.active *,
:root[data-theme="dark"] #waline span.wl-like[style] {
  color: #007acc !important;
  fill: #007acc !important;
  stroke: #007acc !important;
}

/* 预览按钮 - 强制覆盖所有状态 */
:root[data-theme="dark"] #waline .wl-tab.wl-active *,
:root[data-theme="dark"] #waline .wl-tab.active *,
:root[data-theme="dark"] #waline .wl-tab[style*="color"] {
  color: #007acc !important;
}

/* 通用规则：覆盖所有可能的内联样式 */
:root[data-theme="dark"] #waline [style*="rgb(76, 175, 80)"] *,
:root[data-theme="dark"] #waline [style*="#4caf50"] *,
:root[data-theme="dark"] #waline [style*="rgb(255, 255, 255)"].active,
:root[data-theme="dark"] #waline [style*="#fff"].active,
:root[data-theme="dark"] #waline [style*="white"].active {
  color: #007acc !important;
  fill: #007acc !important;
  stroke: #007acc !important;
}

/* 评论区整体容器间距调整 - 桌面端和移动端统一修复 */
.vs-comments-section {
  margin-top: 1rem !important; /* 从 3rem 减少到 1rem */
  padding: 0 !important;  /* 移除 padding，避免多层嵌套 */
  box-sizing: border-box !important;
}

#waline {
  width: 100% !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* 在 panel 层面统一控制内边距（桌面端和移动端） */
:root[data-theme="dark"] #waline .wl-panel,
:root[data-theme="white"] #waline .wl-panel,
#waline .wl-panel {
  padding: 16px !important;  /* 桌面端使用稍大的内边距 */
  box-sizing: border-box !important;
}

/* 移动端特殊处理 */
@media (max-width: 768px) {
  /* 移除 content-area 的 padding，由 post-content 统一控制 */
  .content-area {
    padding: 0 !important;
  }

  .vs-comments-section {
    margin-left: -16px !important;  /* 抵消 post-content 的 16px padding */
    margin-right: -16px !important; /* 抵消 post-content 的 16px padding */
    padding-left: 16px !important;  /* 恢复 16px 内边距，与 post-content 对齐 */
    padding-right: 16px !important; /* 恢复 16px 内边距，与 post-content 对齐 */
    border: none !important;        /* 移动端隐藏外边框 */
    background-color: transparent !important; /* 移动端透明背景 */
  }

  /* 移动端使用更紧凑的内边距，确保左右对称 */
  :root[data-theme="dark"] #waline .wl-panel,
  :root[data-theme="white"] #waline .wl-panel,
  #waline .wl-panel {
    padding: 12px !important; /* 四个方向都是 12px */
    width: 100% !important;   /* 占满容器宽度 */
    box-sizing: border-box !important; /* padding 包含在宽度内 */
    margin-left: 0 !important;  /* 移除左外边距 */
    margin-right: 0 !important; /* 移除右外边距 */
  }

  /* 移除 wl-input 的左右外边距，确保对称 */
  :root[data-theme="dark"] #waline .wl-input,
  :root[data-theme="white"] #waline .wl-input,
  #waline .wl-input {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;  /* 占满父容器宽度 */
    box-sizing: border-box !important; /* padding 包含在宽度内 */
  }

  /* 确保 wl-editor 也没有额外的左右边距，并且水平居中 */
  :root[data-theme="dark"] #waline .wl-editor,
  :root[data-theme="dark"] #waline textarea.wl-editor,
  :root[data-theme="white"] #waline .wl-editor,
  :root[data-theme="white"] #waline textarea.wl-editor,
  #waline .wl-editor,
  #waline textarea.wl-editor {
    margin-left: 4px !important;
    margin-right: 4px !important;
    width: calc(100% - 8px) !important;  /* 减去左右外边距 */
    box-sizing: border-box !important; /* padding 包含在宽度内 */
  }
}

/* ========== 修复文章导航按钮宽度不一致问题 ========== */

/* 让上一篇和下一篇按钮宽度相同，间距对称 */
.post-nav .prev {
  margin-right: 0.5em !important;
}

.post-nav .next {
  margin-left: 0.5em !important;
  text-align: right;
}

/* ========== 统一分割线和间距设计 ========== */

/* 推荐文章板块 - 统一间距为 2em */
.vs-recommended-posts {
  margin-top: 2em !important;
  padding-top: 2em !important;
  border-top: 1px solid var(--vscode-border) !important;
}

/* 评论区板块 - 添加分割线和统一间距，移除卡片式设计 */
.vs-comments-section {
  margin-top: 2em !important;
  padding-top: 2em !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  background-color: transparent !important;  /* 移除背景色 */
  border: none !important;  /* 移除四周边框 */
  border-top: 1px solid var(--vscode-border) !important;  /* 只保留上方分割线 */
  border-radius: 0 !important;  /* 移除圆角 */
}

/* 评论区标题头部 - 可点击折叠/展开 */
.vs-comments-section .section-header {
  cursor: pointer !important;
  user-select: none !important;
  transition: all 0.2s ease !important;
}

.vs-comments-section .section-header:hover {
  color: var(--vscode-link) !important;
  opacity: 0.8 !important;
}

/* 图标旋转动画 */
.vs-comments-section .section-header i.fas {
  transition: transform 0.2s ease !important;
  transform: rotate(0deg) !important;
  display: inline-block !important;
}

.vs-comments-section .section-header.collapsed i.fas {
  transform: rotate(-90deg) !important;
}

/* 默认折叠评论输入框 - 提高选择器权重确保覆盖所有主题 */
:root[data-theme="dark"] #waline .wl-panel:not(.expanded),
:root[data-theme="white"] #waline .wl-panel:not(.expanded),
#waline .wl-panel:not(.expanded) {
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease, visibility 0.3s ease !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 展开状态的评论输入框 - 提高选择器权重确保覆盖所有主题 */
:root[data-theme="dark"] #waline .wl-panel.expanded,
:root[data-theme="white"] #waline .wl-panel.expanded,
#waline .wl-panel.expanded {
  max-height: 1000px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  padding: 16px !important;
}

/* 移动端展开状态 - 提高选择器权重 */
@media (max-width: 768px) {
  :root[data-theme="dark"] #waline .wl-panel.expanded,
  :root[data-theme="white"] #waline .wl-panel.expanded,
  #waline .wl-panel.expanded {
    padding: 12px !important;
  }
}

/* 评论列表始终可见 */
#waline .wl-cards,
#waline .wl-count,
#waline .wl-operation {
  display: block !important;
}

/* ========== 在 about 页面隐藏推荐文章板块 ========== */

/* 使用 body class 或 URL 路径判断，在 about 页面隐藏推荐文章 */
body[class*="about"] .vs-recommended-posts,
body[data-page="about"] .vs-recommended-posts {
  display: none !important;
}

/* 如果主题使用路径作为 body class，也覆盖 */
.page-about .vs-recommended-posts,
.about-page .vs-recommended-posts {
  display: none !important;
}