/* ============================================
   Custom CSS - 全局背景 & 页脚透明玻璃效果
   如需更换背景图，修改下方 #web_bg 的 url 即可
   ============================================ */

/* ---------- 全局背景 ---------- */
/* #web_bg 是全站固定背景层 */
#web_bg {
  background: url(https://img.diyus.top/img/2026/05/background.{ext}) !important;
  background-attachment: fixed !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

/* 给内容区域添加半透明遮罩，提升文字可读性 */
#body-wrap {
  background: rgba(255, 255, 255, 0.75) !important;
}

/* 深色模式下遮罩适配 */
[data-theme="dark"] #body-wrap {
  background: rgba(18, 18, 18, 0.8) !important;
}

/* ---------- 页脚自定义背景图 ---------- */
/* ---------- 页脚背景（粉色渐变 - 持续流动）---------- */
#footer {
  background-image: linear-gradient(135deg, #fce4ec 0%, #f8bbd0 25%, #f48fb1 50%, #ec407a 75%, #f8bbd0 100%) !important;
  background-size: 400% 400% !important;
  background-repeat: no-repeat !important;
  animation: footer-gradient-shift 5s ease-in-out infinite;
}

/* 移除页脚遮罩层，让渐变可见 */
#footer:before {
  display: none !important;
}

[data-theme="dark"] #footer {
  background-image: linear-gradient(135deg, #4a1525 0%, #3d1020 25%, #2d0a18 50%, #1a060c 75%, #3d1020 100%) !important;
  background-size: 400% 400% !important;
  background-repeat: no-repeat !important;
  animation: footer-gradient-shift 5s ease-in-out infinite;
}

@keyframes footer-gradient-shift {
  0%   { background-position: 0% 50%; }
  25%  { background-position: 100% 0%; }
  50%  { background-position: 100% 100%; }
  75%  { background-position: 0% 100%; }
  100% { background-position: 0% 50%; }
}

#footer-wrap {
  /* 半透明遮罩保证文字可读，可调整最后一个值 (0~1) 控制透明度 */
  background: rgba(255, 255, 255, 0.2) !important;
  backdrop-filter: blur(0.5px);
  -webkit-backdrop-filter: blur(0.5px);
  border-top: 1px solid rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] #footer-wrap {
  background: rgba(0, 0, 0, 0.25) !important;
}

/* 页脚文字颜色微调，确保可读性 */
#footer-wrap,
#footer-wrap a,
#footer-wrap .framework-info {
  color: #555 !important;
}

[data-theme="dark"] #footer-wrap,
[data-theme="dark"] #footer-wrap a,
[data-theme="dark"] #footer-wrap .framework-info {
  color: #bbb !important;
}

/* 页脚链接悬停效果 */
#footer-wrap a:hover {
  color: #49b1f5 !important;
}

/* 页脚框架与主题版本号标注 */
#footer-wrap .framework-info a[href*="hexo.io"]::after {
  content: " 6.3.0";
}
#footer-wrap .framework-info a[href*="butterfly"]::after {
  content: " 4.13.0";
}

/* ---------- 侧边栏卡片仅首页显示（TOC 除外）---------- */
body:not(.pg-home) .card-info,
body:not(.pg-home) .card-announcement,
body:not(.pg-home) .card-recent-post,
body:not(.pg-home) .card-categories,
body:not(.pg-home) .card-tags {
  display: none !important;
}

/* ---------- 移动端菜单项外框 ---------- */
@media screen and (max-width: 768px) {
  #sidebar-menus .custom-hr {
    display: none !important;
  }

  #sidebar-menus .menus_items {
    margin: 8px 12px;
    padding: 6px 0;
    border: 1px solid rgba(150, 150, 150, 0.25);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  }

  [data-theme="dark"] #sidebar-menus .menus_items {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.04);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
  }
}

/* ---------- 点击爆炸小球动效 ---------- */
.click-burst {
  position: fixed;
  z-index: 9999;
  border-radius: 50%;
  pointer-events: none;
  animation: burst-out 0.7s ease-out forwards;
}

@keyframes burst-out {
  0% {
    opacity: 1;
    transform: translate(0, 0) scale(1);
  }
  60% {
    opacity: 0.6;
    transform: translate(var(--bx), var(--by)) scale(0.8);
  }
  100% {
    opacity: 0;
    transform: translate(var(--ex), var(--ey)) scale(0.15);
  }
}

/* ---------- 非首页内容居中对齐 ---------- */
/* 在桌面端隐藏非首页非文章页的侧边栏 */
body:not(.pg-home):not(.pg-post) #aside-content {
  display: none !important;
}

/* 居中内容区并限制最大宽度（非首页非文章页） */
body:not(.pg-home):not(.pg-post) .layout {
  max-width: 900px;
  justify-content: center !important;
}

/* ---------- 文章页布局：左侧目录 + 内容居中 ---------- */
html body.pg-post .layout {
  max-width: 1060px;
}

html body.pg-post #aside-content,
html body.pg-post .read-mode #aside-content {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 240px !important;
  min-width: 240px !important;
  flex-shrink: 0;
  padding-right: 15px;
}

html body.pg-post .layout #post,
html body.pg-post .layout #page {
  flex: 1;
  max-width: 750px;
  width: auto !important;
  min-width: 0;
}

/* 文章页侧边栏只保留目录卡片 */
html body.pg-post #aside-content .card-widget:not(#card-toc) {
  display: none !important;
}

/* 确保目录卡片可见 */
html body.pg-post #aside-content #card-toc {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* 目录阅读百分比样式 */
#card-toc .toc-percentage {
  display: inline !important;
  margin-left: 6px;
}
#card-toc .toc-percentage::after {
  content: "%";
}

/* 隐藏目录序号（桌面端 + 移动端） */
#card-toc .toc-number,
.mobile-toc .toc-number {
  display: none !important;
}

#card-toc .toc-content ol,
#card-toc .toc-content li,
.mobile-toc .toc-content ol,
.mobile-toc .toc-content li {
  list-style: none !important;
}

/* 移动端：文章页目录移到汉堡菜单内 */
@media screen and (max-width: 900px) {
  html body.pg-post #aside-content {
    display: none !important;
  }

  html body.pg-post .layout #post,
  html body.pg-post .layout #page {
    width: 100% !important;
    max-width: 100%;
  }

  /* 移动端侧边栏菜单内的目录 */
  #sidebar-menus .mobile-toc {
    margin: 8px 12px 12px;
    padding: 12px 14px;
    max-height: 45vh;
    overflow-y: auto;
    border-radius: 10px;
    background: rgba(150,150,150,0.06);
    border-bottom: 2px solid rgba(150,150,150,0.25);
  }

  [data-theme="dark"] #sidebar-menus .mobile-toc {
    background: rgba(255,255,255,0.04);
    border-bottom-color: rgba(255,255,255,0.15);
  }

  #sidebar-menus .mobile-toc .toc-title {
    font-weight: bold;
    margin-bottom: 8px;
    font-size: 1.1em;
  }

  /* 导航菜单与目录之间的分隔 */
  #sidebar-menus .mobile-toc + .custom-hr {
    margin-top: 4px;
  }
}

/* 404 图片底色改为渐变 */
.error404 #error-wrap .error-content .error-img img {
  background: linear-gradient(135deg, #fce4ec 0%, #f8bbd0 25%, #f48fb1 50%, #ec407a 75%, #f8bbd0 100%) !important;
}

[data-theme="dark"] .error404 #error-wrap .error-content .error-img img {
  background: linear-gradient(135deg, #4a1525 0%, #3d1020 25%, #2d0a18 50%, #1a060c 75%, #3d1020 100%) !important;
}

/* 标签云文字加边框（颜色自适应 + 字号统一） */
.tag-cloud-list a,
.card-tag-cloud a {
  display: inline-block !important;
  margin: 4px 6px;
  padding: 4px 14px;
  font-size: 14px !important;
  font-weight: bold !important;
  border: 1.5px solid;
  border-radius: 16px;
  background: color-mix(in srgb, currentColor 12%, transparent);
  transition: all 0.3s;
}

/* 侧边栏标签间距缩小 */
.card-tag-cloud a {
  margin: 2px 3px;
  padding: 3px 10px;
  font-size: 13px !important;
}

.tag-cloud-list a:hover,
.card-tag-cloud a:hover {
  background: color-mix(in srgb, currentColor 22%, transparent);
  transform: scale(1.05);
}

/* ---------- 隐藏导航栏左上角 logo ---------- */
#nav .site-icon {
  display: none !important;
}

/* 文章版权声明图标替换 */
#post .post-copyright:before {
  content: '' !important;
  width: 22px;
  height: 22px;
  background: url(https://img.diyus.top/img/2026/05/logos.{ext}) center/contain no-repeat;
}

/* ---------- 暂时隐藏开往菜单项 ---------- */
.menus_item:has(a[href*="travellings"]) {
  display: none !important;
}

/* ---------- 右下角按钮调整 ---------- */
/* 让深浅色切换按钮始终可见 */
#rightside #rightside-config-hide {
  height: auto !important;
  opacity: 1 !important;
  transform: translate(0, 0) !important;
}

/* 移除单栏/双栏切换按钮 */
#hide-aside-btn {
  display: none !important;
}

/* 移除设置齿轮按钮 */
#rightside-config {
  display: none !important;
}

/* 移除阅读模式按钮 */
#readmode {
  display: none !important;
}

/* 移除移动端目录按钮 */
#mobile-toc-button {
  display: none !important;
}