/* === Chirpy 布局与视觉细节优化 v1 (2026-07-18) === */
/* 叠加式覆盖，不动主题源文件；移除本文件即可完全还原 */

/* 卡片圆角加大 + 柔和分层阴影 */
.card.post-preview {
  border-radius: 16px !important;
  border: 0.5px solid rgba(0,0,0,.06) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.05), 0 1px 3px rgba(0,0,0,.03) !important;
  transition: box-shadow .25s ease, transform .25s ease !important;
}
.card.post-preview:hover {
  box-shadow: 0 10px 30px rgba(0,0,0,.09), 0 2px 6px rgba(0,0,0,.05) !important;
  transform: translateY(-2px);
}

/* 卡片间距加大 */
.card-wrapper { margin-bottom: 1.5rem !important; }

/* 按钮圆角统一 */
.btn-box-shadow, .btn { border-radius: 8px !important; }

/* 正文行高优化中文阅读 */
.post-content p, .content p, .post-content .content {
  line-height: 1.85 !important;
}

/* 内容区阅读宽度适度收窄 */
@media (min-width: 1200px) {
  .col-12.col-lg-11.col-xl-9 { max-width: 72% !important; }
}

/* 过渡动画统一 */
.card, .btn, a { transition: all .25s ease !important; }

/* === v2: 评论组件暗色模式桥接 + monologue 页面协调 (2026-07-18) === */
/* 问题：PluginCommentWidget 用 --halo-cw-* 变量，暗色模式只认 .dark 类 /
   [data-color-scheme=dark] / prefers-color-scheme:dark；
   但 Chirpy 用 html[data-mode="dark"] 切换，两者不通气，导致暗色模式下评论文字不可读。
   方案：在 html[data-mode="dark"] 上直接设置 --halo-cw-* 变量，
   CSS 自定义属性会穿透 Shadow DOM 被 web component 继承。 */

/* 暗色模式：评论组件变量对齐 Chirpy 暗色配色 */
html[data-mode="dark"] {
  --halo-cw-text-1-color: #f9fafb;
  --halo-cw-text-2-color: #e2e8f0;
  --halo-cw-text-3-color: #94a3b8;
  --halo-cw-muted-1-color: #64748b;
  --halo-cw-muted-2-color: #475569;
  --halo-cw-muted-3-color: #334155;
  --halo-cw-primary-1-color: #6ea8fe;
  --halo-cw-primary-2-color: #5a9afe;
  --halo-cw-primary-3-color: #4a8ae0;
  --halo-cw-emoji-picker-rgb-color: 222,222,221;
  --halo-cw-emoji-picker-rgb-accent: 58,130,247;
  --halo-cw-emoji-picker-rgb-background: 21,22,23;
  --halo-cw-emoji-picker-rgb-input: 0,0,0;
  --halo-cw-emoji-picker-color-border: #ffffff1a;
  --halo-cw-emoji-picker-color-border-over: #fff3;
}

/* 亮色模式：评论组件主色统一为 Chirpy 蓝，文字色对齐主题变量 */
html:not([data-mode]),
html[data-mode="light"] {
  --halo-cw-text-1-color: var(--text-color, #34343c);
  --halo-cw-text-2-color: var(--text-muted-color, #757575);
  --halo-cw-text-3-color: var(--text-muted-color, #757575);
  --halo-cw-muted-1-color: #e9ecef;
  --halo-cw-muted-2-color: #f1f5f9;
  --halo-cw-muted-3-color: #f8f9fa;
  --halo-cw-primary-1-color: #0d6efd;
  --halo-cw-primary-2-color: #0b5ed7;
  --halo-cw-primary-3-color: #0a58ca;
}

/* 评论区间隔 + 分隔线，与上方内容拉开层次 */
#comment {
  margin-top: 3rem !important;
  padding-top: 1.5rem;
  border-top: 1px solid var(--main-border-color, #f3f3f3);
}