/* 全局基础样式优化 */
html {
  scroll-behavior: smooth; /* 平滑滚动 */
  font-size: 16px; /* 基准字体大小 */
}

body {
  font-family: 'Microsoft YaHei', 'Inter', system-ui, -apple-system, sans-serif; /* 优先中文字体 */
  line-height: 1.8; /* 优化行高，提升中文可读性 */
  letter-spacing: 0.5px; /* 轻微字间距，中文更舒展 */
}

/* 卡片核心样式增强 */
.bg-white {
  transition: all 0.3s ease; /* 所有变化平滑过渡 */
}

.bg-white:hover {
  box-shadow: 0 4px 20px rgba(0, 102, 255, 0.08); /* 淡蓝色阴影，更细腻 */
  transform: translateY(-2px); /* 轻微上浮，增加交互感 */
  border-color: rgba(0, 102, 255, 0.2) !important; /* 卡片边框轻微泛主色调 */
}

/* 暗黑模式卡片优化 */
.dark .bg-gray-800:hover {
  box-shadow: 0 4px 20px rgba(0, 102, 255, 0.15);
  border-color: rgba(0, 102, 255, 0.3) !important;
}

/* 导航栏样式增强 */
nav a {
  position: relative; /* 为下划线做准备 */
  padding: 0.25rem 0; /* 增加点击区域 */
  font-weight: 500;
  transition: color 0.2s ease;
}

/* 导航栏链接hover/选中态下划线 */
nav a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #0066FF;
  transition: width 0.2s ease;
}

nav a:hover::after,
nav a:focus::after {
  width: 100%; /* hover时显示下划线 */
}

/* 主题切换按钮交互增强 */
#theme-toggle {
  transition: all 0.2s ease;
  cursor: pointer;
}

#theme-toggle:hover {
  background-color: rgba(0, 102, 255, 0.1) !important;
  color: #0066FF;
}

/* 图片样式优化 */
.avatar {
  transition: all 0.3s ease;
  border: 3px solid #fff;
  box-shadow: 0 4px 12px rgba(0, 102, 255, 0.1);
}

.avatar:hover {
  transform: scale(1.02); /* 轻微放大 */
  box-shadow: 0 6px 16px rgba(0, 102, 255, 0.15);
}

/* 模块标题样式增强 */
h2 {
  position: relative;
  padding-left: 12px;
}

/* 标题左侧小竖线装饰 */
h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 4px;
  background-color: #0066FF;
  border-radius: 2px;
}

/* 项目/教育/课题条目样式增强 */
.border-l-4 {
  transition: all 0.2s ease;
  border-radius: 0 4px 4px 0;
}

.border-l-4:hover {
  background-color: rgba(0, 102, 255, 0.03); /* 轻微背景色 */
  padding-left: 16px; /* 轻微缩进 */
}

/* 暗黑模式条目hover优化 */
.dark .border-l-4:hover {
  background-color: rgba(0, 102, 255, 0.08);
}

/* 链接样式增强 */
a {
  transition: all 0.2s ease;
}

a:hover {
  color: #0052cc !important; /* 深一点的蓝色，更有层次 */
  text-decoration: underline;
  text-underline-offset: 4px; /* 下划线偏移，更美观 */
}

/* 页脚样式优化 */
footer {
  margin-top: 40px;
  border-top: 1px solid rgba(0, 102, 255, 0.1) !important;
}

/* 移动端适配优化 */
@media (max-width: 768px) {
  /* 移动端导航栏换行优化 */
  nav .flex {
    flex-direction: column;
    padding: 1rem 0;
    height: auto;
  }

  nav .space-x-4 {
    margin-top: 1rem;
    space-x: 2rem;
  }

  /* 移动端卡片内边距调整 */
  .bg-white, .bg-gray-800 {
    padding: 1rem !important;
  }

  /* 移动端标题字号调整 */
  h1 {
    font-size: 1.8rem !important;
  }

  h2 {
    font-size: 1.4rem !important;
  }
}

/* 暗黑模式全局样式适配 */
.dark {
  color-scheme: dark; /* 适配系统暗黑模式 */
}

.dark a {
  color: #4d94ff !important; /* 暗黑模式链接色更柔和 */
}

.dark a:hover {
  color: #73b0ff !important;
}

/* 全局滚动条美化（可选） */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #0066FF;
}

/* 暗黑模式滚动条 */
.dark ::-webkit-scrollbar-track {
  background: #1e293b;
}

.dark ::-webkit-scrollbar-thumb {
  background: #475569;
}

.dark ::-webkit-scrollbar-thumb:hover {
  background: #0066FF;
}