/* ===================================================
   Butterfly 卡片轻透明统一风格 v3
   for iroyame.com
   =================================================== */

/* 页面背景防闪白：保持与主题背景一致 */
body {
  background-color: #e5dac8 !important;
  transition: none !important; /* 仅 body 禁用过渡，避免闪白；不影响主题 hover 动效 */
}

/* 全局变量 */
:root {
  --card-bg-opacity: 0.5;       /* 背景透明度：50% */
  --card-radius: 4px;           /* 微圆角 */
  --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.04); /* 极轻阴影 */
  --card-shadow-hover: 0 2px 6px rgba(0, 0, 0, 0.06);
}

/* === 卡片类：主页文章卡片 + 侧栏 + Page 页面 + 评论区 === */
.recent-post-item,
.card-widget,
.card,
#page,
.comment-wrap,
#waline-wrap {
  background: rgba(255, 255, 255, var(--card-bg-opacity)) !important;
  border-radius: var(--card-radius) !important;
  box-shadow: var(--card-shadow) !important;
  backdrop-filter: none !important;
  /* 不再禁用 transition，交给主题默认 */
}

/* === 夜间模式 === */
[data-theme="dark"] .recent-post-item,
[data-theme="dark"] .card-widget,
[data-theme="dark"] .card,
[data-theme="dark"] #page,
[data-theme="dark"] .comment-wrap,
[data-theme="dark"] #waline-wrap {
  background: rgba(30, 30, 30, var(--card-bg-opacity)) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

/* === 按钮、分页、标签保持统一圆角 === */
button,
input,
textarea,
select,
.pagination a,
.pagination span,
.tag-cloud a,
.post-meta__tags a {
  border-radius: var(--card-radius) !important;
}

/* === 取消这段对页面元素的过渡禁用（会屏蔽主题 hover 动效）
   （已移除：body, #page, .recent-post-item, .card-widget, .card { transition: none !important; }）
*/

/* 恢复 author 区域的动效（头像/社交图标保留过渡） */
#aside-content .card-author *,
#author-info *,
#site-author *,
#author-img *,
#author-avatar *,
#author-info .social-icon * {
  transition: all 0.3s ease !important;
}

/* === 文章区卡片边框风格（与首页卡片统一） === */
#post {
  background: rgba(255, 255, 255, 0.4) !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  backdrop-filter: blur(4px);
  /* 不禁用 transition，保留主题默认 */
  padding: 25px;
}

/* （已移除 #post:hover，交由主题默认 hover 效果） */

/* 夜间模式一致 */
[data-theme="dark"] #post {
  background: rgba(30, 30, 30, 0.4) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}
