/* 标签云词云样式 */

/* 标签云容器 */
.tag-cloud-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 14px;
  padding: 40px 20px;
  max-width: 1000px;
  margin: 0 auto;
  line-height: 2.5;
}

/* 标签项基础样式
   选择器 .tag-cloud-list a 与 Butterfly 的 .tag-cloud-list a 同级，
   因为自定义 CSS 最后加载，所以能盖掉 Butterfly 默认规则 */
.tag-cloud-list a {
  display: inline-block !important;
  margin: 0 !important;              /* 覆盖 Butterfly 的 margin: 5px */
  padding: 5px 14px !important;      /* 覆盖 Butterfly 的 padding: 3px 12px */
  border-radius: 20px !important;    /* 覆盖 Butterfly 的 7px，更圆润 */
  overflow: hidden !important;       /* 防止 ::before 等伪元素溢出形成毛刺 */
  text-decoration: none;
  font-weight: 500;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  white-space: nowrap;
  line-height: 1.6;
  border: none !important;
  box-shadow: none !important;
  /* 覆盖 Butterfly 的初始 transform，避免影响 JS 设置的旋转 */
  transform: none;
  /* 覆盖 Butterfly 的 will-change */
  will-change: auto;
}

/* 悬停效果 */
.tag-cloud-list a:hover {
  transform: scale(1.1) !important;
  z-index: 10;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
}

/* 覆盖 Butterfly 给 .tag-cloud-list a 加的 ::before 光扫动画
   （这是毛刺的主要来源之一） */
.tag-cloud-list a::before,
.tag-cloud-list a::after {
  display: none !important;
  content: none !important;
}

/* 覆盖 Butterfly 的 :hover::before 动画 */
.tag-cloud-list a:hover::before,
.tag-cloud-list a:hover::after {
  display: none !important;
  content: none !important;
}

/* 覆盖 Butterfly 的 .tag-cloud-list:hover a:not(:hover) 半透明效果
   注意：不能覆盖 transform，否则会把 JS 设的 rotate() 清掉 */
.tag-cloud-list:hover a:not(:hover) {
  opacity: 1 !important;
}

/* 根据标签大小设置不同的样式 */
/* 超大标签 - 最热门 */
.tag-cloud-list a[style*="font-size: 1.5em"],
.tag-cloud-list a[style*="font-size:1.5em"] {
  font-size: 2.2em !important;
  font-weight: 700;
  padding: 7px 18px !important;
  letter-spacing: 2px;
}

/* 大标签 */
.tag-cloud-list a[style*="font-size: 1.4em"],
.tag-cloud-list a[style*="font-size:1.4em"] {
  font-size: 1.8em !important;
  font-weight: 600;
  padding: 6px 16px !important;
  letter-spacing: 1px;
}

/* 中等标签 */
.tag-cloud-list a[style*="font-size: 1.3em"],
.tag-cloud-list a[style*="font-size:1.3em"] {
  font-size: 1.5em !important;
  font-weight: 600;
  padding: 5px 14px !important;
}

/* 普通标签 */
.tag-cloud-list a[style*="font-size: 1.2em"],
.tag-cloud-list a[style*="font-size:1.2em"] {
  font-size: 1.2em !important;
  font-weight: 500;
  padding: 5px 13px !important;
}

/* 小标签 */
.tag-cloud-list a[style*="font-size: 1.1em"],
.tag-cloud-list a[style*="font-size:1.1em"] {
  font-size: 1em !important;
  font-weight: 400;
  padding: 4px 11px !important;
  opacity: 0.9;
}

/* 文字颜色 - 使用白色文字配合深色背景 */
.tag-cloud-list a {
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* 响应式布局 - 手机端 */
/* 注意：Butterfly 在 768px 断点给 .tag-cloud-list a 加了 zoom: 0.85
   会等比缩小标签，压缩大小差异，并且导致亚像素渲染毛刺。
   这里用 zoom: normal 覆盖掉，再用更明显的字号差异拉开层次 */
@media (max-width: 768px) {
  .tag-cloud-list {
    gap: 8px 10px;
    padding: 30px 12px;
    line-height: 2.2;
  }

  /* 覆盖 Butterfly 的 zoom: 0.85，消除毛刺和大小压缩 */
  .tag-cloud-list a {
    zoom: normal !important;
    padding: 4px 11px !important;
    border-radius: 18px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.5em"],
  .tag-cloud-list a[style*="font-size:1.5em"] {
    font-size: 2em !important;
    padding: 6px 14px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.4em"],
  .tag-cloud-list a[style*="font-size:1.4em"] {
    font-size: 1.7em !important;
    padding: 5px 13px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.3em"],
  .tag-cloud-list a[style*="font-size:1.3em"] {
    font-size: 1.45em !important;
    padding: 5px 12px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.2em"],
  .tag-cloud-list a[style*="font-size:1.2em"] {
    font-size: 1.2em !important;
    padding: 4px 11px !important;
  }
}

@media (max-width: 480px) {
  .tag-cloud-list {
    gap: 6px 8px;
    padding: 20px 8px;
    line-height: 2;
  }

  .tag-cloud-list a {
    padding: 3px 10px !important;
    border-radius: 16px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.5em"],
  .tag-cloud-list a[style*="font-size:1.5em"] {
    font-size: 1.7em !important;
    padding: 5px 12px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.4em"],
  .tag-cloud-list a[style*="font-size:1.4em"] {
    font-size: 1.5em !important;
  }

  .tag-cloud-list a[style*="font-size: 1.3em"],
  .tag-cloud-list a[style*="font-size:1.3em"] {
    font-size: 1.35em !important;
  }

  .tag-cloud-list a[style*="font-size: 1.2em"],
  .tag-cloud-list a[style*="font-size:1.2em"] {
    font-size: 1.15em !important;
    padding: 3px 9px !important;
  }

  .tag-cloud-list a[style*="font-size: 1.1em"],
  .tag-cloud-list a[style*="font-size:1.1em"] {
    font-size: 1em !important;
  }
}

/* 深色模式适配 */
[data-theme="dark"] .tag-cloud-list a {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}