/* ========== 重置主题默认 #web_bg 变形 ========== */
#web_bg {
  width: 100% !important;
  height: 100% !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
  position: fixed !important;
  z-index: -999 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
}

/* ========== 浅色模式：低分辨率小图打底 ========== */
#web_bg {
  /* 低清缩略图（快速显示，避免空白） */
  background-image: url("/img/b.jpg") !important;
}

/* 屏幕宽度≥1200px 加载浅色高清原图 */
@media screen and (min-width: 1200px) {
  #web_bg {
    background-image: url("/img/P20251112-100225.png") !important;
  }
}

/* ========== 深色模式：低分辨率小图打底 ========== */
[data-theme="dark"] #web_bg {
  /* 深色低清缩略图 */
  background-image: url("/img/y.png") !important;
}

/* 大屏加载深色高清原图 */
@media screen and (min-width: 1200px) and [data-theme="dark"] {
  [data-theme="dark"] #web_bg {
    background-image: url("/img/dji_fly_20250818_192634_0066_1755516756630_aeb.png") !important;
  }
}

/* ========== 上层容器透明化（必加，否则会挡住背景） ========== */
html,
body,
#body-wrap,
#page-header,
#footer,
#sidebar {
  background: transparent !important;
  background-color: transparent !important;
}

/* 每条说说卡片主体 */
#ispeak .xk-card {
  /* 半透明白色底色，最后一位是底色不透明度，可按需调整 */
  background: rgba(255, 255, 255, 0.18) !important;
  /* 毛玻璃核心：模糊后方背景 */
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  /* 细边框增强玻璃质感 */
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 8px !important;
  overflow: hidden;
}

/* 清除卡片内部子元素的背景，避免遮挡毛玻璃效果 */
#ispeak .xk-card-header,
#ispeak .xk-card-content,
#ispeak .xk-card-footer {
  background: transparent !important;
}

/* ========== 导航栏基础透明 ========== */
#page-header #nav {
  background: transparent !important;
  box-shadow: none !important;
}

/* ========== 彻底解除所有父容器的裁剪限制 ========== */
/* 解除遮罩层、名称容器、标题本身的溢出隐藏和遮罩效果，确保衬底可自由撑开 */
#page-header #nav .mask-name-container,
#page-header #nav #name-container,
#page-header #nav #page-name {
  overflow: visible !important;
  mask: none !important;
  -webkit-mask: none !important;
}

#page-header #nav #page-name {
  position: relative;
  transition: all 0.3s ease;
}

/* ========== 浅色模式：默认标题衬底 ========== */
[data-theme="light"] #page-header #nav .menus_item a,
[data-theme="light"] #page-header #nav #blog_name a,
[data-theme="light"] #page-header #nav #page-name,
[data-theme="light"] #page-header #nav-right .nav-button,
[data-theme="light"] #page-header #nav #toggle-menu {
  background: rgba(255, 255, 255, 0.5) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease;
}

/* 浅色模式：默认文字颜色 */
[data-theme="light"] #page-header #nav .menus_item a,
[data-theme="light"] #page-header #nav #blog_name a,
[data-theme="light"] #page-header #nav #page-name,
[data-theme="light"] #page-header #nav .site-name .title,
[data-theme="light"] #page-header #nav-right .nav-button a,
[data-theme="light"] #page-header #nav i,
[data-theme="light"] #page-header #nav #toggle-menu {
  color: #2c2c2c !important;
  text-shadow: none !important;
}

/* 浅色模式：菜单项悬停加深 */
[data-theme="light"] #page-header #nav .menus_item a:hover,
[data-theme="light"] #page-header #nav-right .nav-button:hover,
[data-theme="light"] #page-header #nav #blog_name a:hover {
  background: rgba(255, 255, 255, 0.7) !important;
}

/* ========== 深色模式：默认标题衬底 ========== */
[data-theme="dark"] #page-header #nav .menus_item a,
[data-theme="dark"] #page-header #nav #blog_name a,
[data-theme="dark"] #page-header #nav #page-name,
[data-theme="dark"] #page-header #nav-right .nav-button,
[data-theme="dark"] #page-header #nav #toggle-menu {
  background: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-radius: 8px !important;
  transition: all 0.3s ease;
}

/* 深色模式：默认文字颜色 */
[data-theme="dark"] #page-header #nav .menus_item a,
[data-theme="dark"] #page-header #nav #blog_name a,
[data-theme="dark"] #page-header #nav #page-name,
[data-theme="dark"] #page-header #nav .site-name .title,
[data-theme="dark"] #page-header #nav-right .nav-button a,
[data-theme="dark"] #page-header #nav i,
[data-theme="dark"] #page-header #nav #toggle-menu {
  color: #ffffff !important;
  text-shadow: none !important;
}

/* 深色模式：菜单项悬停加深 */
[data-theme="dark"] #page-header #nav .menus_item a:hover,
[data-theme="dark"] #page-header #nav-right .nav-button:hover,
[data-theme="dark"] #page-header #nav #blog_name a:hover {
  background: rgba(0, 0, 0, 0.7) !important;
}

/* ========== 布局对齐修正 ========== */
#page-header #nav #blog_name {
  padding: 0 !important;
}
#page-header #nav #blog_name > a {
  display: inline-flex;
  align-items: center;
}

#page-header #nav #page-name {
  padding: 3px 12px !important;
  line-height: 1.5 !important;
  min-width: auto !important;
  font-weight: 700 !important; /* 统一原标题字重 */
}

/* ========== 核心：悬停切换回到顶部（强制覆盖原生样式） ========== */
#page-header.nav-fixed #nav #page-name::after {
  content: "回到顶部" !important;
  position: absolute !important;
  left: 50% !important;
  right: auto !important; /* 强制覆盖原生 right:0，解除宽度铺满限制 */
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: auto !important; /* 宽度完全随文字内容自适应 */
  padding: 3px 12px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  white-space: nowrap !important; /* 禁止文字换行 */
  /* 字体样式强制和原标题完全统一 */
  font-size: inherit !important;
  font-weight: 700 !important;
  font-family: inherit !important;
  line-height: 1.5 !important;
  opacity: 0 !important;
  transition: all 0.3s ease !important;
  pointer-events: none !important;
  text-shadow: none !important;
}

/* 悬停时：原标题文字+衬底完全隐藏 */
#page-header.nav-fixed #nav #page-name:hover {
  color: transparent !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* 悬停时：显示回到顶部 */
#page-header.nav-fixed #nav #page-name:hover::after {
  opacity: 1 !important;
}

/* 悬停时：浅色模式 回到顶部衬底+文字 */
[data-theme="light"] #page-header.nav-fixed #nav #page-name:hover::after {
  background: rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  color: #2c2c2c !important;
}

/* 悬停时：深色模式 回到顶部衬底+文字 */
[data-theme="dark"] #page-header.nav-fixed #nav #page-name:hover::after {
  background: rgba(0, 0, 0, 0.7) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  color: #ffffff !important;
}

/* 浅色模式：边框设为完全透明 */
:root {
  --anzhiyu-card-border: transparent;
}

/* 深色模式：边框设为完全透明 */
html[data-theme='dark'] {
  --anzhiyu-card-border: transparent;
}


:root {
  --waline-font-color: #000000;
  --waline-bg-color: rgba(255, 255, 255, 0.85);
}

@media (prefers-color-scheme: dark) {
  :root {
    --waline-font-color: #ffffff;
    --waline-bg-color: rgba(0, 0, 0, 0.55);
  }
}

html[data-theme='dark'] {
  --waline-font-color: #ffffff;
  --waline-bg-color: rgba(0, 0, 0, 0.55);
}

html[data-theme='light'] {
  --waline-font-color: #000000;
  --waline-bg-color: rgba(255, 255, 255, 0.85);
}

#waline-wrap,
.wl-wrap {
  color: var(--waline-font-color);
}

/* 去除卡片整体背景，只在文字下方显示衬底 */
#waline-wrap .wl-card,
.wl-wrap .wl-card {
  background-color: transparent;
  border: none;
  box-shadow: none;
}

#waline-wrap .wl-card-item,
.wl-wrap .wl-card-item {
  background-color: transparent;
}

/* 评论内容区域：背景只跟随文字 */
#waline-wrap .wl-content,
.wl-wrap .wl-content {
  color: var(--waline-font-color);
  background-color: var(--waline-bg-color);
  display: inline-block;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 4px;
  word-wrap: break-word;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  box-sizing: border-box;
}

#waline-wrap .wl-comment-main,
.wl-wrap .wl-comment-main {
  color: var(--waline-font-color);
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
}

#waline-wrap .wl-comment-main p,
.wl-wrap .wl-comment-main p {
  color: var(--waline-font-color);
  word-wrap: break-word;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  margin: 0;
}

#waline-wrap .wl-nick,
.wl-wrap .wl-nick {
  color: var(--waline-font-color);
}

#waline-wrap .wl-time,
.wl-wrap .wl-time {
  color: var(--waline-font-color);
  opacity: 0.7;
}
