nongxiaoyu/unpackage/dist/dev/mp-weixin/pages/knowledge/index.wxss

/* 引入字体图标 */
@font-face {
  font-family: 'iconfont';
  src: url('//at.alicdn.com/t/font_3266846_kxscvlm9qpp.woff2') format('woff2');
}
.iconfont.data-v-502b983e {
  font-family: "iconfont" !important;
  font-size: 22rpx;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-robot.data-v-502b983e:before {
  content: "\e64b";
}
.icon-eye.data-v-502b983e:before {
  content: "\e614";
}

/* 页面容器 */
.page-container.data-v-502b983e {
  min-height: 100vh;
  background-color: #f7f8fa;
  position: relative;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* 头部标签样式 */
.header-tabs.data-v-502b983e {
  display: flex;
  background-color: #fff;
  padding: 0 30rpx;
  position: relative;
  border-bottom: 1rpx solid #f2f2f2;
}
.tab-item.data-v-502b983e {
  position: relative;
  padding: 20rpx 30rpx;
  margin-right: 50rpx;
  font-size: 30rpx;
  color: #666;
  transition: all 0.3s ease;
}
.tab-item.active.data-v-502b983e {
  color: #333;
  font-weight: 600;
}
.tab-line.data-v-502b983e {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 6rpx;
  background-color: #4dc971;
  border-radius: 3rpx;
  transition: all 0.3s ease;
  transform: translateX(-50%);
}
.tab-line.active.data-v-502b983e {
  width: 40rpx;
}

/* 内容区域样式 */
.content-container.data-v-502b983e {
  height: calc(100vh - 88rpx);
  box-sizing: border-box;
}
.cards-section.data-v-502b983e {
  padding: 12rpx;
}

/* 内容卡片通用样式 */
.content-card.data-v-502b983e {
  background-color: #fff;
  border-radius: 16rpx;
  margin-bottom: 24rpx;
  overflow: hidden;
  transition: all 0.2s ease;
  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
  position: relative;
}
.card-hover.data-v-502b983e {
  transform: translateY(-2rpx);
  box-shadow: 0 6rpx 16rpx rgba(0, 0, 0, 0.12);
}

/* 缩略图 */
.content-thumbnail.data-v-502b983e {
  position: relative;
  width: 100%;
  height: 300rpx;
  background-color: #f0f0f0;
}
.thumbnail-image.data-v-502b983e {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 播放按钮 */
.play-button.data-v-502b983e {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70rpx;
  height: 70rpx;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.play-icon.data-v-502b983e {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9rpx 0 9rpx 16rpx;
  border-color: transparent transparent transparent #ffffff;
  margin-left: 4rpx;
}

/* 视频时长 */
.video-duration.data-v-502b983e {
  position: absolute;
  bottom: 10rpx;
  right: 10rpx;
  padding: 3rpx 8rpx;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
  font-size: 18rpx;
  border-radius: 10rpx;
}

/* 内容类型标签 */
.content-type-tag.data-v-502b983e {
  position: absolute;
  top: 10rpx;
  left: 10rpx;
  padding: 4rpx 10rpx;
  font-size: 20rpx;
  border-radius: 6rpx;
  z-index: 2;
}
.content-type-tag.video.data-v-502b983e {
  background-color: #4dc971;
  color: #fff;
}
.content-type-tag.article.data-v-502b983e {
  background-color: #3498db;
  color: #fff;
}

/* 内容信息 */
.content-info.data-v-502b983e {
  padding: 16rpx;
  position: relative;
}
.content-title.data-v-502b983e {
  font-size: 30rpx;
  font-weight: 600;
  color: #333;
  line-height: 1.4;
  margin-bottom: 10rpx;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.source-name.data-v-502b983e {
  color: #999;
  font-size: 22rpx;
}
.info-row.data-v-502b983e {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.view-count.data-v-502b983e {
  color: #c0c0c0;
  font-size: 20rpx;
  display: flex;
  align-items: center;
}
.view-count .iconfont.data-v-502b983e {
  margin-right: 4rpx;
}

/* 空状态 */
.empty-state.data-v-502b983e {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 120rpx 0;
}
.empty-image.data-v-502b983e {
  width: 180rpx;
  height: 180rpx;
  margin-bottom: 16rpx;
}
.empty-text.data-v-502b983e {
  font-size: 26rpx;
  color: #999;
}

/* AI按钮 */
.assistant-btn.data-v-502b983e {
  position: fixed;
  right: 30rpx;
  bottom: 100rpx;
  height: 80rpx;
  border-radius: 40rpx;
  background: linear-gradient(135deg, #42b983, #3db160);
  display: flex;
  align-items: center;
  padding: 0 24rpx;
  box-shadow: 0 6rpx 20rpx rgba(66, 185, 131, 0.35);
  z-index: 99;
  transition: all 0.25s ease;
}
.assistant-icon.data-v-502b983e {
  width: 68rpx;
  height: 68rpx;
  margin-right: 10rpx;
}
.btn-hover.data-v-502b983e {
  transform: scale(1.05);
  box-shadow: 0 8rpx 24rpx rgba(66, 185, 131, 0.45);
}
.btn-text.data-v-502b983e {
  font-size: 28rpx;
  color: #fff;
  font-weight: 500;
}