/* 地区-IP数量：固定可视高度，超出滚动，避免撑开支付弹框 */
.order-detail-primary-scroll {
  max-height: 40px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 4px;
  overscroll-behavior: contain;
}

.order-detail-primary-scroll::-webkit-scrollbar {
  width: 4px;
}

.order-detail-primary-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.order-detail-primary-scroll::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 2px;
}

.order-detail-primary-scroll::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

.order-detail-box {
  max-height: 82px;
  overflow: hidden;
}

/* ===== 支付弹框移动端适配 (max-width: 768px) ===== */
@media (max-width: 768px) {
  /* ---- 支付弹框 #paymentModal ---- */
  #paymentModal {
    z-index: 9999999 !important;
  }
  #paymentModal > div:first-child {
    width: calc(100% - 32px) !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 90vh !important;
    flex-direction: column !important;
    overflow-y: auto !important;
    border-radius: 12px !important;
  }
  /* 左侧边栏 */
  #paymentModal .w-\[200px\] {
    width: 100% !important;
    height: auto !important;
    padding: 20px 16px !important;
    border-radius: 12px 12px 0 0 !important;
  }
  #paymentModal .w-\[200px\] ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 12px !important;
  }
  #paymentModal .w-\[200px\] ul li {
    padding-top: 4px !important;
  }
  /* 右侧内容区 */
  #paymentModal .flex-1.p-\[24px\] {
    padding: 16px !important;
  }
  /* 支付方式切换 tab */
  #paymentModal .flex.mb-4.bg-\[\#F9FAFB\] {
    gap: 4px !important;
  }
  #paymentModal .pay-tab {
    font-size: 12px !important;
    padding: 0 4px !important;
    white-space: nowrap !important;
  }
  #paymentModal .pay-tab span {
    font-size: 12px !important;
  }
  /* 二维码区域堆叠 */
  #paymentModal .pay-alipay-content .flex.items-start.gap-5,
  #paymentModal .pay-wechat-content .flex.items-start.gap-5,
  #paymentModal .pay-balance-content .flex.items-start.gap-5 {
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
  }
  /* 二维码框 */
  #paymentModal .w-\[170px\] {
    width: 160px !important;
    height: auto !important;
    min-height: 180px !important;
  }
  #paymentModal .w-\[170px\] #alipay-qrcode-box,
  #paymentModal .w-\[170px\] #wechat-qrcode-box {
    width: 140px !important;
    height: 140px !important;
    margin: 0 auto 8px !important;
  }
  /* 订单详情行 */
  #paymentModal .bg-\[\#F9FAFB\].rounded-lg {
    flex-direction: column !important;
    gap: 8px !important;
  }
  /* 金额字号 */
  #paymentModal .text-\[40px\] {
    font-size: 28px !important;
    line-height: 40px !important;
  }
  #paymentModal .modal-price-value {
    font-size: 28px !important;
    line-height: 40px !important;
  }
  /* 余额支付 */
  #paymentModal .pay-balance-content .w-\[170px\] {
    width: 100% !important;
    height: auto !important;
    flex-direction: row !important;
    gap: 12px !important;
    padding: 12px !important;
  }
  #paymentModal .pay-balance-content .w-\[170px\] img {
    margin-bottom: 0 !important;
  }
  #paymentModal #modal-balance-pay-btn {
    width: 100% !important;
  }

  /* ---- 支付成功弹框 #paySuccessModal ---- */
  #paySuccessModal {
    z-index: 9999999 !important;
  }
  #paySuccessModal > div:first-child {
    width: calc(100% - 32px) !important;
    max-width: 100% !important;
    padding: 32px 16px 24px !important;
    border-radius: 12px !important;
  }
  #paySuccessModal .grid.grid-cols-2 {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  #paySuccessModal .text-\[36px\] {
    font-size: 28px !important;
    line-height: 40px !important;
  }
  #paySuccessModal .w-full.flex.justify-center.gap-\[10px\] {
    flex-direction: column !important;
    align-items: center !important;
  }
  #paySuccessModal .w-\[160px\] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* 提示消息层级高于弹框 */
  .pop-message {
    z-index: 99999999 !important;
  }
}
