/* 自定义背景样式 */

/* 恢复使用背景图片和动画效果 */
.gradient-animate {
  background: transparent !important; /* 移除纯色背景 */
  animation: gradient 15s ease infinite; /* 恢复动画效果 */
}

.wrapper.style1.special {
  background: #051835;
  box-shadow: inset 0 0 20px rgba(0, 238, 255, 0.2);
}

/* 提高tech-title在所有页面的可见度 */
.tech-title {
  color: #4db8ff !important;
  text-shadow: 0 0 3px rgba(0, 170, 255, 0.5) !important;
  display: inline-block;
  margin-bottom: 10px;
  -webkit-text-fill-color: #4db8ff !important; /* 强制覆盖背景裁剪文本效果 */
  background: none !important;
  background-clip: initial !important;
  -webkit-background-clip: initial !important;
  border: none;
  box-shadow: none;
  font-weight: bold;
}

/* 特殊情况下的标题样式 */
#main .tech-title, 
#main_publications .tech-title, 
#main_workexperience .tech-title,
#main_research .tech-title,
.tech-card .tech-title,
article .tech-title,
section .tech-title,
.wrapper .tech-title {
  color: #4db8ff !important;
  -webkit-text-fill-color: #4db8ff !important;
  text-shadow: 0 0 3px rgba(0, 170, 255, 0.5) !important;
  font-size: 1.2em;
}

/* 调整个人资料部分的样式 */
.wrapper.style1.special h2,
.wrapper.style1.special h3 {
  color: #ffffff;
  text-shadow: none;
}

/* 增强边框发光效果 */
#wrapper {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 15px rgba(0, 195, 255, 0.5);
}

/* 改善文字在背景上的可读性 */
p, span, li, a, div {
  color: #e0f7ff;
}

/* 增强头像图片的效果 */
.wrapper.style1.special .image img {
  transition: all 0.3s ease;
  border-radius: 10px;
  border: 2px solid transparent;
  box-shadow: 0 0 10px rgba(0, 195, 255, 0.3);
}

.wrapper.style1.special .image img:hover {
  transform: scale(1.02);
  border-color: rgba(0, 195, 255, 0.5);
  box-shadow: 0 0 20px rgba(0, 195, 255, 0.5);
}

/* 修改技能部分的背景 */
#skills {
  background: #071d3a;
}

/* 让banner部分背景透明，显示页面背景图片 */
#banner.tech-box {
  background: transparent !important;
  position: relative;
}

#banner.tech-box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(10, 25, 60, 0) !important; /* 完全透明 */
  z-index: 1;
}

#banner .inner, 
#banner .more {
  position: relative;
  z-index: 2; /* 让内容显示在半透明层上方 */
}

/* 为页面添加整体风格统一性 */
.tech-box {
  
}

/* 改善各种卡片的背景色和可读性 */
.tech-card {
  background: rgba(10, 25, 60, 0.7) !important;
  border-radius: 10px;
  padding: 20px;
  margin: 20px 0;
  position: relative;
  box-shadow: 0 4px 20px rgba(0, 119, 255, 0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tech-border {
  border: 1px solid transparent;
  border-radius: 8px;
  background: rgba(10, 25, 60, 0.7) !important;
  position: relative;
  padding: 20px;
  margin: 20px 0;
  box-shadow: 0 4px 20px rgba(0, 119, 255, 0.3) !important;
  /* 添加与tech-card一致的过渡效果 */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 文章和论文链接字体颜色 */
.section a {
  color: #4db8ff;
  transition: color 0.3s ease;
  text-decoration: none;
}

.section a:hover {
  color: #80ccff;
  text-decoration: underline;
}

/* 所有页面的标题统一样式 */
#main h2, #main_publications h2, #main_workexperience h2, #main_research h2 {
  color: #ffffff;
  text-shadow: none;
}

/* 调整tech-card里的tech-title */
.tech-card .tech-title {
  margin-top: 0;
}

/* 改善文章内容背景 */
article header {
  
}

/* 确保所有文本内容可读性 */
.wrapper {
  background: #051835 !important;
}

section.wrapper {
  background: #051835 !important;
}

/* 覆盖style5白色背景，改为深色 */
.wrapper.style5 {
  background-color: #051835 !important;
  color: #e0f7ff !important;
}

.wrapper.style5 h2,
.wrapper.style5 h3,
.wrapper.style5 h4,
.wrapper.style5 h5,
.wrapper.style5 h6 {
  color: #ffffff !important;
}

.wrapper.style5 p {
  color: #e0f7ff !important;
}

.wrapper.style5 .section h3,
.wrapper.style5 .section h4 {
  color: #e0f7ff !important;
}

/* 修改粗体文字颜色，提高可读性 */
.wrapper.style5 strong, 
.wrapper.style5 b {
  color: #4db8ff !important;
  font-weight: bold;
}

/* 确保所有强调文本清晰可见 */
strong, b {
  color: #4db8ff;
}