/*
 * Butterfly Modern Frost & Deep Sea Theme
 * 现代极简毛玻璃配色方案
 */

:root {
  /* 白天模式 - 冰霜蓝白 */
  --global-bg: #f7f9fb;
  --nav-bg: rgba(255, 255, 255, 0.7);
  --card-bg: rgba(255, 255, 255, 0.85);
  --btn-bg: #49b1f5;
  --text-main: #2c3e50;
  --text-link: #49b1f5;
  --hr-border: rgba(73, 177, 245, 0.3);
}

[data-theme="dark"] {
  /* 深色模式 - 极客深蓝 */
  --global-bg: #0d1117;
  --nav-bg: rgba(22, 27, 34, 0.7);
  --card-bg: rgba(22, 27, 34, 0.85);
  --btn-bg: #21262d;
  --text-main: #c9d1d9;
  --text-link: #58a6ff;
  --hr-border: rgba(88, 166, 255, 0.2);
}

/* 全局背景底色 */
#web_bg {
  background-color: var(--global-bg) !important;
}

/* 毛玻璃核心实现：针对导航栏、卡片、侧边栏、搜索框等 */
#nav, 
.layout > div:first-child:not(.recent-posts), 
#aside-content > .card-widget, 
.recent-post-item, 
#pdata, 
.local-search-window {
  background: var(--card-bg) !important;
  backdrop-filter: blur(12px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(160%) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 12px !important;
  transition: all 0.3s ease-in-out;
}

/* 深色模式卡片边框 */
[data-theme="dark"] #nav, 
[data-theme="dark"] .layout > div:first-child:not(.recent-posts), 
[data-theme="dark"] #aside-content > .card-widget, 
[data-theme="dark"] .recent-post-item, 
[data-theme="dark"] #pdata, 
[data-theme="dark"] .local-search-window {
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* 侧边栏和卡片阴影微调 */
#aside-content > .card-widget, .recent-post-item {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
}

/* 鼠标悬浮交互反馈 */
.recent-post-item:hover {
  border: 1px solid var(--btn-bg) !important;
  box-shadow: 0 8px 24px rgba(73, 177, 245, 0.15) !important;
}

/* 按钮悬浮平滑过渡 */
button, .nav-right .nav-button {
  transition: all 0.3s ease-in-out;
}

button:hover {
  filter: brightness(0.9);
}

/* 代码块美化：圆角与微边框 */
#article-container .highlight {
  border-radius: 10px !important;
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

[data-theme="dark"] #article-container .highlight {
  border: 1px solid rgba(255, 255, 255, 0.05);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* 强制应用文本颜色以解决文章内字体太淡的问题 */
body, #article-container {
  color: var(--text-main) !important;
}

[data-theme="dark"] body, 
[data-theme="dark"] #article-container,
[data-theme="dark"] #article-container p,
[data-theme="dark"] #article-container li {
  color: #e6edf3 !important; /* 更亮的浅灰白色，提升深色模式阅读体验 */
}

/* 修改底部区域的颜色，使其与主题一致，移除突兀的纯蓝色块 */
#footer {
  background: transparent !important;
  color: var(--text-main) !important;
}
#footer a {
  color: var(--text-main) !important;
}
#footer a:hover {
  color: var(--text-link) !important;
}

/* 进度条与按钮颜色 */
#rightside > div > button, #nav .site-page:after {
  background-color: var(--btn-bg) !important;
}

/* =====================================================
   Dark 模式：覆盖文章内所有内联 color 样式
   解决从富文本编辑器粘贴的 rgba(0,0,0,x) 深色字体问题
   ===================================================== */

/* 覆盖 font 标签内联颜色 */
[data-theme="dark"] #article-container font[style*="color"] {
  color: #c9d1d9 !important;
}

/* 覆盖所有带内联 color 的元素（span、p、div、li 等） */
[data-theme="dark"] #article-container *[style*="color:rgb(0"],
[data-theme="dark"] #article-container *[style*="color: rgb(0"],
[data-theme="dark"] #article-container *[style*="color:rgba(0"],
[data-theme="dark"] #article-container *[style*="color: rgba(0"],
[data-theme="dark"] #article-container *[style*="color:#000"],
[data-theme="dark"] #article-container *[style*="color: #000"],
[data-theme="dark"] #article-container *[style*="color:#333"],
[data-theme="dark"] #article-container *[style*="color:#353535"],
[data-theme="dark"] #article-container *[style*="color:#595959"],
[data-theme="dark"] #article-container *[style*="color:#666"],
[data-theme="dark"] #article-container *[style*="color:#4d4d4d"] {
  color: #c9d1d9 !important;
}

/* blockquote 引用块文字 */
[data-theme="dark"] #article-container blockquote,
[data-theme="dark"] #article-container blockquote * {
  color: #8b949e !important;
  border-left-color: #30363d !important;
}

/* 表格文字 */
[data-theme="dark"] #article-container table,
[data-theme="dark"] #article-container th,
[data-theme="dark"] #article-container td {
  color: #c9d1d9 !important;
  border-color: #30363d !important;
}

/* =====================================================
   导航栏居中 + 字体调大
   ===================================================== */

/* 让导航菜单在 nav 中绝对居中 */
#nav .menus_items {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  font-size: 20px !important;
  font-weight: 500 !important;
}

#nav .menus_items .menus_item a {
  font-size: 20px !important;
}

/* 隐藏首页 banner 中的站点标题 */
#site-info #site-title {
  display: none !important;
}

/* 打字机副标题字号放大 3 倍（原约 14px → 42px） */
#site-info #site-subtitle,
#site-info #subtitle {
  font-size: 84px !important;
  line-height: 1.4 !important;
}