/**
 * 账单模式专属样式
 * B2B内部账单 - 显示完整佣金和成本信息
 */

/* 账单模式下的footer-right */
.bill-mode .footer-right {
  width: 280px !important;  /* 缩小宽度，让内容更紧凑 */
  min-width: 280px !important;
  max-width: 280px !important;
  flex-shrink: 0 !important;  /* 防止收缩 */
  display: flex !important;
  flex-direction: column !important;
}

/* 账单模式总价区域 */
.bill-mode .total-row {
  display: flex !important;
  flex-wrap: nowrap !important;  /* 禁止换行 */
  justify-content: space-between !important;
  align-items: center !important;
  padding: 4px 0 !important;  /* 减少上下间距使行更紧凑 */
  font-size: 12px !important;
  color: var(--text-sub) !important;
  width: 100% !important;  /* 占满footer-right的宽度 */
  line-height: 1.3 !important;  /* 紧凑行高 */
}

.bill-mode .total-label {
  font-weight: 600;
  color: var(--text-sub);
  flex: 1 1 auto;  /* 占据剩余空间 */
  min-width: 0;  /* 允许收缩 */
}

.bill-mode .total-label span {
  display: block;
  line-height: 1.3;
}

.bill-mode .total-label .en {
  font-size: 9px;
  opacity: 0.7;
  font-weight: 400;
  margin-top: 0px;
  line-height: 1.2;
}

.bill-mode .total-amount {
  font-weight: 600 !important;
  color: var(--text-main) !important;
  text-align: right !important;
  white-space: nowrap !important;
  margin-left: auto !important;  /* 使用auto自动推到右侧 */
  flex-shrink: 0 !important;  /* 防止收缩 */
}

/* 佣金行特殊样式 */
.bill-mode .total-row.comm {
  color: var(--danger) !important;
  font-weight: 500;
}

.bill-mode .total-row.comm .total-label {
  color: var(--danger) !important;
}

.bill-mode .total-row.comm .total-label .en {
  color: var(--danger) !important;
  opacity: 0.85;
}

.bill-mode .total-row.comm .total-amount {
  color: var(--danger) !important;
  font-weight: 600 !important;
}

/* 实付结算价卡片 */
.bill-mode .net-box {
  background: var(--primary) !important;
  color: white !important;
  padding: 12px 14px !important;
  border-radius: 6px !important;
  margin-top: 10px !important;  /* 减少与上方的间距 */
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1) !important;
  width: 100% !important;  /* 占满footer-right的宽度 */
}

.bill-mode .net-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.bill-mode .net-title .en {
  display: block;
  font-size: 10px;
  opacity: 0.8;
  text-transform: uppercase;
  font-weight: 400;
  margin-top: 2px;
}

.bill-mode .net-val {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.5px;
}

/* 显示账单专属元素 */
.bill-mode .bill-only {
  display: revert !important;  /* 恢复默认display，不强制覆盖 */
}

/* 佣金设置行：左右并排布局 */
.bill-mode #commission-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
}

/* 账单模式表格单元格保持table-cell */
.bill-mode th.bill-only,
.bill-mode td.bill-only {
  display: table-cell !important;  /* 表格单元格必须是table-cell */
}

/* 账单模式总价行保持flex */
.bill-mode .total-row.bill-only {
  display: flex !important;  /* 总价行使用flex布局 */
}

/* 附加产品行隐藏状态 */
.bill-mode .total-row.bill-only.addon-hidden {
  display: none !important;
}

/* 账单模式实付结算价卡片保持flex */
.bill-mode .net-box.bill-only {
  display: flex !important;  /* 卡片使用flex布局 */
}

/* 隐藏其他模式元素 */
.bill-mode .quote-only,
.bill-mode .ticket-only,
.bill-mode .compare-only {
  display: none !important;
}