@tailwind base;
@tailwind components;
@tailwind utilities;

/* 全局重置与基础设置 */
html {
  scroll-behavior: smooth;
}

body {
  @apply font-sans text-gray-800 bg-white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 导航栏样式 */
.nav-link {
  @apply relative px-1 py-2 text-sm font-light transition-colors duration-300;
}
.nav-link:hover {
  @apply text-gray-600;
}
.nav-link::after {
  @apply absolute bottom-0 left-0 w-full h-px bg-gray-300 opacity-0 transition-opacity duration-300;
  content: "";
}
.nav-link:hover::after {
  @apply opacity-100;
}

/* 图片通用样式 */
.img-hover {
  @apply transition-transform duration-500 ease-out cursor-pointer;
}
.img-hover:hover {
  @apply scale-105;
}

/* 淡入淡出页面过渡 */
.page-fade {
  @apply opacity-0 transition-opacity duration-700;
}
.page-fade.loaded {
  @apply opacity-100;
}

/* 占位符样式（懒加载） */
.lazy-placeholder {
  @apply bg-gray-100 animate-pulse;
}

/* 响应式断点增强 */
@media (max-width: 768px) {
  .mobile-menu-open .mobile-menu {
    @apply block;
  }
  .mobile-menu {
    @apply hidden absolute top-full left-0 w-full bg-white shadow-lg py-4;
  }
  .mobile-menu a {
    @apply block px-4 py-2 text-center;
  }
}

/* Lightbox全屏查看（仅视觉提示，无实际功能） */
.lightbox-trigger {
  @apply cursor-zoom-in;
}

/* 页脚样式 */
.footer-copy {
  @apply text-gray-500 text-sm;
}

/* 禁止用户选择文字（可选，提升视觉纯净度） */
.noselect {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* 高清图片最小高度保障 */
.min-h-screen-img {
  min-height: 100vh;
  height: 100svh;
}

/* 文字排版优化 */
.prose-quote {
  @apply italic text-gray-600 border-l-2 border-gray-200 pl-4;
}

/* 莫兰迪色系辅助类 */
.bg-mauve {
  background-color: #e0d3d6;
}
.bg-oatmeal {
  background-color: #e8e0d5;
}
.bg-misty {
  background-color: #dce5e8;
}