/* 二维码样式优化 */
.qr-code {
    border-radius: 8px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* 图片列表间距优化 */
#photo-list {
    min-height: 120px;
}

/* 支付按钮禁用样式 */
#pay-btn:disabled {
    cursor: not-allowed;
    opacity: 0.8;
}

/* 自拍视频容器样式 */
#camera {
    max-height: 400px;
    object-fit: cover;
}
/* 图片父容器样式（可选，优化移动端布局） */
.photo-item-container {
    position: relative;
    display: inline-block;
    margin: 0 8px 8px 0;
}
@media (max-width: 767.98px) {
    .photo-item-container {
        display: block; /* 移动端每张图片独占一行 */
        margin: 0 0 12px 0; /* 调整移动端上下间距 */
    }
}
/* 基础样式：公共样式（圆角、边框、对象适应方式） */
.photo-item {
    object-fit: cover; /* 保持图片比例，裁剪填充容器 */
    border-radius: 4px; /* 圆角 */
    border: 1px solid #ddd; /* 灰色边框 */
  }
  
  /* 电脑端样式（屏幕宽度 ≥ 768px，可根据需求调整断点） */
  @media (min-width: 768px) {
    .photo-item {
      width: 200px; /* 电脑端固定宽度 */
      height: 200px; /* 电脑端固定高度 */
    }
  }
  
  /* 移动端样式（屏幕宽度 < 768px，手机等小屏设备） */
  @media (max-width: 767.98px) {
    .photo-item {
      width: 100%; /* 移动端占满父容器宽度 */
      height: auto; /* 高度自适应（根据图片原始比例自动调整，不固定高度） */
      /* max-width: 300px; */
    }
  }