/* 增量样式：默认亮色+仅文章页徽标圆形带框+文章页优化+手机链接不溢出 | 首页图标不变 */
/* 1. 强制默认亮色模式（覆盖根变量，保留暗黑模式切换功能） */
/* 亮色模式变量 */
body {
  --color-background: #ffffff;
  --color-text: #333333;
  --color-text-light: #666666;
  --color-border: #e0e0e0;
  --color-primary: #000000;
  --color-secondary: #f5f5f5;
  --color-accent: #555555;
  --color-hover: #f0f0f0;
  --color-card-shadow: rgba(0, 0, 0, 0.1);
  --color-card-background: #ffffff;
  --color-category-active: #f0f0f0;
  --color-highlight: #ff0000;
  --color-link: #0066cc;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  line-height: 1.6;
  color: var(--color-text);
  background-color: var(--color-background);
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* 暗黑模式变量：html.dark-mode body 选择器，和防闪白JS严格联动 */
html.dark-mode body {
  --color-background: #121212;
  --color-text: #f0f0f0;
  --color-text-light: #aaaaaa;
  --color-border: #333333;
  --color-primary: #ffffff;
  --color-secondary: #1e1e1e;
  --color-accent: #aaaaaa;
  --color-hover: #2a2a2a;
  --color-card-shadow: rgba(0, 0, 0, 0.3);
  --color-card-background: #1e1e1e;
  --color-category-active: #2a2a2a;
  --color-highlight: #ff4d4d;
  --color-link: #007acc;
}
/* 2. 文章页核心优化：缩窄主内容居中（768px窄版，和Astra一致） */
.single-post .main-content {
  max-width: 768px !important;
  margin: 0 auto !important;
  flex: none !important;
  width: 100% !important;
  padding: 2rem !important;
}

/* 3. 🔥 核心：仅文章页标题旁徽标 - 正圆+带边框（宽高一致+50%圆角+边框，首页图标不受影响） */
.entry-thumbnail img {
  width: 80px !important;
  height: 80px !important; /* 宽高一致强制正圆，不拉伸 */
  border-radius: 50% !important; /* 正圆核心 */
  object-fit: cover !important; /* 防止图片变形，裁剪核心内容 */
  border: 2px solid var(--color-border) !important; /* 带边框，颜色适配主题（亮色/暗黑自动变） */
  padding: 2px !important; /* 边框内边距，徽标和边框间留空隙，更精致 */
  background-color: var(--color-background) !important; /* 边框内背景，适配主题 */
}

/* 4. 文章页标题缩小优化（解决排版拥挤，原2rem改1.8rem） */
.entry-title {
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  margin-bottom: 1rem !important;
}

/* 5. 文章内图片居中+自适应（防止溢出，适配窄版内容区） */
.entry-content img {
  display: block !important;
  margin: 1.5em auto !important;
  max-width: 100% !important;
  height: auto !important;
}

/* 6. 文章内链接优化：hover加下划线+手机端强制换行防溢出（核心解决链接超出页面） */
.entry-content a {
  color: var(--color-link) !important;
  text-decoration: underline transparent !important;
  transition: text-decoration 0.3s ease !important;
}
.entry-content a:hover {
  text-decoration: underline !important;
}
.entry-content a,
.entry-content p,
.entry-content span,
.entry-content div {
  word-break: break-all !important;
  word-wrap: break-word !important;
  white-space: normal !important;
  box-sizing: border-box !important;
}

/* 7. 手机端适配：文章页徽标/标题同步缩小+主内容占满+边框适配 */
@media (max-width: 768px) {
  .single-post .main-content {
    max-width: 100% !important;
    padding: 1rem !important;
  }
  /* 手机端文章徽标缩小+保持正圆带框 */
  .entry-thumbnail img {
    width: 60px !important;
    height: 60px !important;
    border-width: 1.5px !important; /* 手机端边框稍细，更协调 */
    padding: 1px !important;
  }
  /* 手机端文章标题再缩小 */
  .entry-title {
    font-size: 1.5rem !important;
  }
  /* 手机端文章内容内边距优化，不贴边 */
  .entry-content {
    padding: 1rem !important;
  }
  .entry-header-content {
    gap: 1rem !important;
  }
}

/* 8. 小屏手机（480px以下）额外适配 */
@media (max-width: 480px) {
  .entry-thumbnail img {
    width: 50px !important;
    height: 50px !important;
  }
  .entry-title {
    font-size: 1.3rem !important;
  }
}
/* 暴力生效：文章页右侧栏所有内容强制显示亮色背景（不挑类名） */
/* 第一步：给右侧栏容器本身加背景（兜底） */
.single-post #right-sidebar {
  background-color: #ffffff !important; /* 右侧栏整体背景 */
  padding: 10px !important;
}

/* 第二步：给右侧栏里的所有子容器加卡片背景（覆盖所有小工具） */
.single-post #right-sidebar > div,
.single-post #right-sidebar > section,
.single-post #right-sidebar > aside {
  background-color: #fafafa !important; /* 亮色模式浅灰卡片背景 */
  border: 1px solid #e0e0e0 !important; /* 边框 */
  border-radius: 6px !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
  box-sizing: border-box !important;
}

/* 第三步：暗黑模式自动适配，不改动 */
html.dark-mode .single-post #right-sidebar {
  background-color: #121212 !important;
}
html.dark-mode .single-post #right-sidebar > div,
html.dark-mode .single-post #right-sidebar > section,
html.dark-mode .single-post #right-sidebar > aside {
  background-color: #1e1e1e !important;
  border-color: #333 !important;
}

/* 第四步：排除图片广告（保持无背景） */
.single-post #right-sidebar > div:has(img),
.single-post #right-sidebar > section:has(img),
.single-post #right-sidebar > aside:has(img) {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-bottom: 16px !important;
}