/*
 * 博客自定义样式（从 Butterfly 3.7.1 的源码修改迁移而来）
 * 由 _config.butterfly.yml 的 inject.head 引入，升级主题时不会被覆盖
 */

/* ---------- 1. 卡片半透明，正文不透明 ---------- */
:root {
  --card-bg: rgba(255, 255, 255, 0.6);
  --post-bg: rgb(255, 255, 255);
}

[data-theme='dark'] {
  --card-bg: rgba(18, 18, 18, 0.8);
  --post-bg: rgb(18, 18, 18);
}

/* 文章页、独立页面的主体容器 */
.layout > div:first-child:not(.nc) {
  background: var(--post-bg);
}

/* 手机端弹出的文章目录 */
@media screen and (max-width: 900px) {
  #aside-content #card-toc {
    background: var(--post-bg);
  }
}

/* ---------- 2. 导航栏图片 Logo ---------- */
#nav .site-icon {
  width: 150px;
  height: auto;
  margin-right: 10px;
}

/* ---------- 3. 页脚四色渐变流动 ---------- */
#footer {
  background: linear-gradient(-45deg, #ee7752, #ce3e75, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: footer-gradient 10s ease infinite;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  user-select: none;
}

@keyframes footer-gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ---------- 4. 蓝色条纹滚动条 ---------- */
*::-webkit-scrollbar-thumb {
  background-color: #49b1f5;
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
  border-radius: 2em;
}

*::-webkit-scrollbar-track {
  background-color: rgba(73, 177, 245, 0.2);
  border-radius: 2em;
}

/* ---------- 5. 右下角按钮改圆形 ---------- */
#rightside > div > button,
#rightside > div > a {
  border-radius: 20px;
}