/* 自定义样式 — Tailwind 不方便表达的部分写在这里 */

/* 滚动条 */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.4);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(100, 116, 139, 0.6);
}

/* 平滑滚动 + 平滑主题切换 */
html {
  scroll-behavior: smooth;
}
body {
  transition: background-color 0.2s ease, color 0.2s ease;
}
html:not(.dark) {
  color-scheme: light;
}
html.dark {
  color-scheme: dark;
}

/* AdSense 自动广告位上下间距 */
ins.adsbygoogle {
  display: block !important;
  margin: 16px auto !important;
}

/* 首页侧边栏分类导航 active 高亮（scroll-spy 触发） */
.sidebar-link-active {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.12), rgba(168, 85, 247, 0.12));
  color: #3b82f6;
  font-weight: 600;
}
html.dark .sidebar-link-active {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(168, 85, 247, 0.2));
  color: #93c5fd;
}
.sidebar-link-active > span:last-child {
  color: #3b82f6 !important;
}
html.dark .sidebar-link-active > span:last-child {
  color: #93c5fd !important;
}

/* 锚点滚动偏移避开 sticky header */
.scroll-mt-20 {
  scroll-margin-top: 5rem;
}

/* line-clamp-1/2 兼容（旧 Safari） */
.line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 卡片 hover 微动效 */
.tool-card {
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.tool-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px -10px rgba(59, 130, 246, 0.25);
}

/* Modal 焦点陷阱 + 滚动锁 */
body.modal-open {
  overflow: hidden;
}

/* 渐变文字（Tailwind 写起来太长，抽成类） */
.text-gradient-brand {
  background-image: linear-gradient(120deg, #3b82f6 0%, #a855f7 50%, #06b6d4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* 无障碍：焦点环 */
:focus-visible {
  outline: 2px solid #3b82f6;
  outline-offset: 2px;
}

/* 场景筛选 tab */
.scene-tab {
  padding: 0.5rem 1rem;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 500;
  background-color: rgb(241 245 249);
  color: rgb(71 85 105);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
  border: 1px solid transparent;
}
html.dark .scene-tab {
  background-color: rgb(30 41 59);
  color: rgb(148 163 184);
}
.scene-tab:hover {
  background-color: rgb(226 232 240);
}
html.dark .scene-tab:hover {
  background-color: rgb(51 65 85);
}
.scene-tab-active {
  background: linear-gradient(135deg, #3b82f6 0%, #a855f7 100%);
  color: #fff;
}
html.dark .scene-tab-active {
  background: linear-gradient(135deg, #3b82f6 0%, #a855f7 100%);
  color: #fff;
}
.scene-tab-active:hover {
  background: linear-gradient(135deg, #3b82f6 0%, #a855f7 100%);
  filter: brightness(1.05);
}

/* line-clamp 兼容（Tailwind 内置但确保 Safari 老版本支持） */
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
