/* 通用页面容器样式 */
.page-container {
  min-height: var(--vh, 100vh);
  background-color: #f5f5f5;
  padding-bottom: calc(50px + env(safe-area-inset-bottom, 0px));
}

@media (prefers-color-scheme: dark) {
  .page-container {
    background-color: #1a1a1a;
  }
}

/* 下拉刷新包装器 */
.refresh-wrapper {
  min-height: calc(var(--vh, 100vh) - 46px - 50px - env(safe-area-inset-bottom, 0px));
}

/* 增加卡片组的对比度 */
:deep(.van-cell-group--inset) {
  margin: 10px 16px;
  background-color: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

@media (prefers-color-scheme: dark) {
  :deep(.van-cell-group--inset) {
    background-color: #2c2c2c;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  }
}

/* 单元格样式 */
:deep(.van-cell) {
  background-color: #ffffff;
  border-bottom: 1px solid #f0f0f0;
}

@media (prefers-color-scheme: dark) {
  :deep(.van-cell) {
    background-color: #2c2c2c;
    border-bottom: 1px solid #3a3a3a;
  }
}

:deep(.van-cell:last-child) {
  border-bottom: none;
}

/* 详情弹出层样式 */
.detail-popup {
  padding: 16px;
  height: 100%;
  overflow-y: auto;
  background-color: #f5f5f5;
}

@media (prefers-color-scheme: dark) {
  .detail-popup {
    background-color: #1a1a1a;
  }
}

/* 弹出层内的卡片组样式 */
.detail-popup :deep(.van-cell-group--inset) {
  background-color: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

@media (prefers-color-scheme: dark) {
  .detail-popup :deep(.van-cell-group--inset) {
    background-color: #2c2c2c;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  }
}

/* 详情头部样式 */
.detail-header {
  margin-bottom: 16px;
}

.detail-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: bold;
  word-break: break-word;
}

.detail-header p {
  margin: 0;
  font-size: 14px;
  color: #969799;
  font-weight: normal;
}

/* 导航栏透明背景 */
:deep(.van-nav-bar) {
  background-color: transparent;
}

/* 修复表单字段过长时的换行显示 */
:deep(.van-field__control) {
  word-break: break-all;
  white-space: normal;
}

:deep(.van-field__value) {
  word-break: break-all;
  white-space: normal;
}