/* 调整特定Logo的大小 */
.nav_brand .logo {
  width: 50px;
  /* 根据需要调整宽度 */
  height: auto;
  /* 保持比例 */
}

/* 给 Logo 容器添加最大宽度和水平居中 */
.nav_brand {
  max-width: 900px;
  /* 你可以根据需要调整这个宽度 */
  margin: 0 auto;
  /* 水平居中 */
  padding: 0 20px;
  /* 左右边距（页边距效果） */
}

/* 给Logo容器添加上下内边距 */
.nav_brand {
  max-width: 900px;
  margin: 0 auto;
  padding: 15px 20px;
  /* ← 加了上下 15px 的内边距 */
}

/* 由于themes/hugo-clarity/assets/sass/_bass.sass中定义了var为随日夜切换，所以这里也要var */
.footer_text p,
.footer_text .beian,
.footer_text .beian a {
  color: var(--text) !important;
}

/* 以下为share相关的样式 */
/* 容器样式 */
/* .share-container {
    display: flex;
    /* 水平排列 */
/* align-items: center; */
/* 垂直居中 */
/* gap: 12px; */
/* 图标之间的间距 */
/* } */

/* 图标样式 */
.share-icon {
  width: 16px;
  height: 16px;
  transition: transform 0.2s ease;
}

.share-icon:hover {
  transform: scale(1.2);
}

/* 文字样式 */
.share-text {
  margin-left: 8px;
  /* 图标与文字之间的间距 */
  vertical-align: middle;
  /* 垂直居中对齐 */
}

/* 以下为post_meta样式 */
/* 在static/css/custom.css中添加 */
.post_time {
  display: flex;
  align-items: center;
  gap: 6px !important;
  line-height: 1em;
}

.meta_item .share-container {
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1em;
  margin-bottom: 1px;

}

/* 控制所有 img 图标 */
.share-container img {
  width: 16px;
  height: 16px;
  transition: transform 0.2s ease;
}

/* hover 效果 */
.share-container img:hover {
  transform: scale(1.2);
}


/* 主页的返回顶部按钮 */
.back-to-top {
  display: none;
  /* 默认隐藏 */
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 98;
  background-color: #3f51b5;
  color: white;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  line-height: 40px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  transition: opacity 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

.back-to-top:hover {
  background-color: #283593;
  color: white;
  text-decoration: none;
}

.nav_close {
  margin-right: 10px;
}

/* 以下为sidebar的固定样式 */
/* 保持原有 Grid 布局 */
.grid-inverse {
  display: grid;
  grid-template-columns: 70% 1fr;
  grid-column-gap: 4rem;
}

/* 主内容区域不需要手动设置 margin-right */
.grid-inverse.wrap.content {
  /* 移除 margin-right: 300px */
}

/* 侧边栏样式 */
.sidebar {
  position: sticky;
  top: 80px;
  width: 100%;
  max-width: 270px; /* 最大宽度限制 */
  height: calc(100vh - 100px);
  overflow: visible;
  z-index: 98;
}

/* 新增中等屏幕断点（1024px） */
@media (max-width: 1024px) {
  .grid-inverse {
    grid-template-columns: 1fr; /* 只保留一列 */
  }

  .sidebar {
    display: none !important;
  }
}

/* 移动端（768px 以下） */
@media (max-width: 768px) {
  .grid-inverse {
    grid-template-columns: 1fr;
  }

  .sidebar {
    display: none !important;
  }
}
/* 示例按钮样式（请根据你的实际 HTML 修改） */
/* .fixed-bottom-sidebar .read-more-button,
  .fixed-bottom-sidebar a.read-more {
    display: inline-block;
    padding: 8px 16px;
    background-color: #007BFF;
    color: white;
    text-decoration: none;
    border-radius: 4px;
    font-weight: bold;
  }
   */

.sidebar-section {
  margin-top: 30px;
  /* 向下偏移 30px*/
  line-height: 1.6; /* 调整行高 */
  margin-bottom: 10px; /* 增加段落底部的外边距 */
}


/* 按钮样式 */
.icon {
  width: 20px;
  height: 20px;
  fill: currentColor;
  display: inline-block;
  vertical-align: middle;
  image-rendering: -webkit-optimize-contrast;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.search_button {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  margin-left: -30px; /* Adjust based on your design */
}

.search_button svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.page-search .nav_header {
  margin-bottom: 0;
  padding-bottom: 0;
}

.page-search #main {
  padding-top: 0;
  margin-top: 0;
}

#searchpage.search-page {
  margin-top: 0;
  padding-top: 20px;
}