/* 页脚与头图透明 */

#page-header {
  background: transparent !important;
}

/* 白天模式遮罩透明 */

#page-header::before {
  background: transparent !important;
}

/* 夜间模式遮罩透明 */
[data-theme="dark"] #page-header::before {
  background: transparent !important;
}

/* 黑幕 */

.heimu {
  color: black; /* 初始文本颜色 */
  background-color: black;
  transition: color 0.15s linear;
}

.heimu:hover {
  color: white; /* 鼠标悬停时的文本颜色 */
}

/*info页面css*/
.info_Left {
  flex: 1;
  display: flex;
  flex-direction: column;
  margin: auto 0;
}
.info_Left-up {
  flex: 1;
}
.info_Left-mid {
  flex: 2;
}
.info_Left-down {
  flex: 1;
}

.info_Right {
  display: flex;
  flex: 3;
  flex-direction: column;
}
.button-info{
  flex: 1;
  border: none;
  transition: background-color 0.1s linear;
}
.button-info:last-child{
  border-radius: 0 30px 0 0;
}
.button-info:hover {
  color: aliceblue;
  background-color: rgba(0, 0, 0, 0.50);
}
.button-info.active {
  color: aliceblue; 
  background-color: rgba(0, 0, 0, 0.50);
  font-weight: bold; /* 选中时的文字加粗 */
}
.info-contain-up{
  flex: 0 0 auto;
  height: 100px;
  display: flex;
  border-bottom: 1px solid #000;
  justify-content: flex-start;
}
.info-contain-down{
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  height: 600px;
  overflow-y: auto;
}
.info-container {
  border-radius: 30px;
  border: 0px;
  display: flex;
  background-color: rgba(240, 240, 240, 0.75);
  justify-content: flex-start;
}
.info-name {
  font-weight: 500;
  font-size: 1.57em;
  text-align: center;
}

.info-description {
  margin-top: -0.42em;
  text-align: center;
}

.circle-button {
  display: inline-block; /* 让按钮成为块级元素但允许它们在一行内排列 */
  width: 30px; /* 设置按钮的宽度 */
  height: 30px; /* 设置按钮的高度 */
  line-height: 30px; /* 设置行高与按钮高度相同，以垂直居中文本 */
  border-radius: 50%; /* 将按钮的角变为圆形 */
  background-color: 'transparent'; /* 设置背景颜色 */
  border: none; /* 移除边框 */
  cursor: pointer; /* 鼠标悬停时显示为手形 */
}
.circle-button-contain{
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin-top: 14px;
  margin-bottom: 4px;
}
.page-info {
  background-image: url('../images/cover_16.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  filter: brightness(0.95);
}
#content-area h1 ,#content-area h2{
  margin:  3px 0 3px;
}
.collection-container{
  overflow-x: auto;
  width: 100%;
  white-space: nowrap;
}
.collection-container::-webkit-scrollbar-thumb {
  background: #ffeebe; /* 滑块颜色 */
}