karamay_wx/pages/user/my-preview/index.wxss

/* 容器样式 */
.preview-container {
  width: 100%;
  height: 100vh;
  background-image: url('https://klmybwg.4dage.com/mini/wxImg/bg.png');
  overflow: auto;
}

/* 预约列表容器 */
.reservation-list {
  width: 100%;
  height: 100vh;
  padding: 40rpx 30rpx;
  box-sizing: border-box;
}

/* 预约卡片样式 */
.reservation-card {
  position: relative;
  width: 100%;
  height: 736rpx;
  margin-bottom: 40rpx;
  border-radius: 20rpx;
  overflow: hidden;
  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.1);
}

/* 卡片背景图 */
.card-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* 预约信息区域 */
.reservation-info {
  position: absolute;
  top: 10rpx;
  width: 90%;
  z-index: 1;
  padding: 40rpx 0 0 40rpx;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

/* 日期时间区域 */
.date-time-section {
  flex: 1;
}

/* 信息行 */
.info-row {
  display: flex;
  align-items: center;
  margin-bottom: 20rpx;
}

.info-row:last-child {
  margin-bottom: 0;
}

/* 标签样式 */
.label {
  font-size: 32rpx;
  color: #584735;
  font-weight: bold;
  margin-right: 10rpx;
}

/* 值样式 */
.value {
  width: 250rpx;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 32rpx;
  color: #B1967B;
}

/* 取消按钮 */
.cancel-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 40px;
  border-radius: 6rpx;
  border: 1px solid #B1967B;
  color: #B1967B;
  font-size: 32rpx;
}

/* 印章图标 */
.stamp-icon {
  width: 136rpx;
  height: 136rpx;
}

.stamp-icon image {
  width: 100%;
  height: 100%;
}

/* 参观人信息区域 */
.visitors-section {
  position: absolute;
  top: 240rpx;
  z-index: 1;
  padding: 0 40rpx 20rpx;
  max-height: 440rpx;
  overflow-y: auto;
}

/* 区域标题 */
.section-title {
  font-size: 32rpx;
  color: #584735;
  font-weight: 600;
  margin-bottom: 26rpx;
  margin-top: 26rpx;
}

.section-title:first-child {
  margin-top: 0;
}

/* 参观人信息 */
.visitor-info {
  margin-bottom: 20rpx;
}

/* 参观人详情 */
.visitor-detail {
  display: flex;
  align-items: center;
  margin-bottom: 15rpx;
}

.visitor-detail:last-child {
  margin-bottom: 0;
}

/* 参观人标签 */
.visitor-label {
  font-size: 32rpx;
  color: #B1967B;
  margin-right: 10rpx;
  min-width: 140rpx;
}

/* 参观人值 */
.visitor-value {
  font-size: 32rpx;
  color: #B1967B;
  flex: 1;
}

/* 加载更多样式 */
.load-more {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30rpx 0;
}

.load-more-text {
  font-size: 28rpx;
  color: #999;
}

.loading-text {
  font-size: 28rpx;
  color: #666;
}

/* 没有更多数据样式 */
.no-more {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30rpx 0;
}

.no-more-text {
  font-size: 28rpx;
  color: #ccc;
}

/* 首次加载样式 */
.first-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 400rpx;
  margin-top: 100rpx;
}

/* 空状态样式 */
.empty-state {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 400rpx;
  margin-top: 100rpx;
}

.empty-text {
  font-size: 32rpx;
  color: #999;
  text-align: center;
}

/* 滚动条样式 */
::-webkit-scrollbar {
  width: 0;
  background: transparent;
}