.uploadfile {
  opacity: 0;
  cursor: pointer;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  font-size: 999px;
  overflow: hidden;
}

.view-box {
  max-width: 1024px;
  padding: 80px;
  margin: 24px auto;
  border: 1px solid #e3e3e3;
  min-height: calc(100vh - 397px);
}

.contract-success {
  max-width: 1024px;
  padding: 80px 0;
  margin: 64px auto;
  border: 1px solid #e3e3e3;
  text-align: center;
}

.view-box-item {
  padding: 24px;
  background-color: #f8f8f8;
  margin-bottom: 16px;
}


.submit-label {
  min-width: 120px;
  text-align: right;
  margin-right: 16px;
  vertical-align: middle;
}

#modal-confirm-submit .submit-label {
  min-width: 80px;
}

.image-add {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid #e3e3e3;
  background-color: #fff;
  text-align: center;
  padding-top: 26px;
  cursor: pointer;
  user-select: none;
  vertical-align: top;
}

.image-content {
  width: 100px;
  text-align: center;
  display: none;
  vertical-align: top;
}

.image-content img {
  border: 1px solid #e3e3e3;
  max-height: 100px;
  max-width: 100%;
  margin-bottom: 4px;
}

.view-box-item .form-group {
  margin-bottom: 0;
}

.view-box-item .form-group + .form-group {
  margin-top: 15px;
}

.view-box-item .form-control {
  width: 471px;
}

.border-red {
	border-color: #ff0000;
}

.view-box-item select.form-control {
  width: auto;
}

#version-info,
.receive-info-first,
.receive-info-sec {
  margin-top: 15px;
}

#hetong-submit.disabled {
  pointer-events: none;
}

@media only screen and (max-width: 800px) {
	.submit-label {
    text-align: left;
    margin-bottom: 12px;
  }

  .inline + .inline.danger-tips {
    display: block;
    margin-top: 8px;
    margin-left: 0 !important;
  }
}

.view-box.print-service-tip {
  width: 1024px;
  padding-top: 16px;
  padding-bottom: 16px;
  min-height: auto;
  border: 0;
  color: #e64340;
}

.d-b {
  display: block;
}

.m-t-6 {
  margin-top: 6px;
}

.inline-flex {
  display: inline-flex;
}

.flex {
  display: flex;
}

.flex.none {
  display: none;
}

.none {
  display: none
}

.weui-icon-success {
  color: #166bc7;
}

.blue {
  color: #fff;
}

.select-packets {
  margin-left: 14px;
  cursor: pointer;
  white-space: nowrap;
}

.packet-items {
  padding: 16px;
  margin: 24px;
  width: 632px;
}

.packet-item {
  width: 100%;
  display: flex;
  position: relative;
}

.packet-item + .packet-item {
  margin-top: 24px;
}

.packet-num-editor {
  width: 80px;
  margin-right: 200px;
  margin: 0 16px 0 40px;
  text-align: center;
  border: 1px solid rgba(120,130,140,.25);
  border-radius: 2px;
  color: #55595c;
}

.packet-item-name {
  width: 55%;
  text-align: right;
}

#modal-packets-select .modal-dialog {
  width: 680px;
}

/* 仅购买增购包说明 */
.packets-only-notice {
  padding: 0 24px 24px;
  color: rgba(0, 0, 0, 0.65);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  border-bottom: 1px solid #F0F0F0;
}

.text-orange {
  color: #f0ad4e;
}

/* ========== 资源购买列表样式 ========== */
/* 资源购买列表容器 */
.resource-purchase-list {
  margin-top: 16px;
  padding: 16px 24px;
}

/* 单个资源项 */
.resource-item {
  border: 1px solid #E6E6E6;
  border-radius: 4px;
  background: #FFFFFF;
  padding: 16px;
  margin-bottom: 12px;
  transition: all 0.3s ease;
  display: flex;
  align-items: start;
  justify-content: space-between;
  min-height: 64px;
}

.resource-item:hover {
  border-color: #D9D9D9;
}

.resource-item.active {
  border-color: #F57C00;
  border-width: 2px;
}

.resource-item.has-selection {
  background-color: rgba(250, 157, 62, 0.05);
  border-color: #FA9D3E;
}

.resource-item:last-child {
  margin-bottom: 0;
}

/* 资源项头部 */
.resource-item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1;
  line-height: 32px;
  margin-right: 24px;
}

.resource-item-name {
  font-size: 14px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.85);
  line-height: 22px;
  border-bottom: 1px dashed #8F8F8F;
  cursor: pointer !important;
}

.resource-item-price-info {
  display: flex;
  align-items: center;
  gap: 24px;
}

.price-calculator-link {
  font-size: 14px;
  color: #166BC7;
  text-decoration: none;
  cursor: pointer !important;
}

.price-calculator-link:hover {
  color: #40A9FF;
  text-decoration: underline;
}

.resource-price-unit {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.65);
}

/* 资源项控件区域 */
.resource-item-controls {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: end;
}

.resource-control-row {
  display: flex;
  align-items: center;
  gap: 24px;
  position: relative;
}

.resource-control-label {
  display: flex;
  align-items: center;
  gap: 4px;
  position: absolute;
  left: -98px;
}

.resource-control-text {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.65);
}

.info-icon {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.45);
}

/* 数量/时长加减器 */
.quantity-stepper,
.duration-stepper {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 152px;
  height: 32px;
}

.quantity-btn,
.duration-btn {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(120, 130, 140, 0.13);
  border-radius: 6px;
  background: #FFFFFF;
  color: rgba(0, 0, 0, 0.85);
  cursor: pointer !important;
  user-select: none;
  transition: all 0.2s;
}

.quantity-btn:hover:not([disabled]),
.duration-btn:hover:not([disabled]) {
  border-color: #D9D9D9;
  background: #FAFAFA;
  cursor: pointer !important;
}

.quantity-btn:active:not([disabled]),
.duration-btn:active:not([disabled]) {
  color: #F57C00;
  background: #F0F2F5;
  cursor: pointer !important;
}

.quantity-btn[disabled],
.duration-btn[disabled] {
  color: #E6E6E6;
  cursor: not-allowed;
  background: #FAFAFA;
}

.quantity-input-wrapper,
.duration-input-wrapper {
  width: 90px;
  flex: 1;
  height: 32px;
  position: relative;
  border: 1px solid rgba(120, 130, 140, 0.13);
  border-radius: 4px;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: text;
}

.quantity-input,
.duration-input {
  border: none;
  outline: none;
  background: transparent;
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.85);
  padding: 0 8px;
}

.quantity-unit-display,
.duration-unit-display {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-size: 14px;
  color: rgba(0, 0, 0, 0.85);
  pointer-events: none;
  white-space: nowrap;
}

.quantity-input:focus + .quantity-unit-display,
.duration-input:focus + .duration-unit-display {
  display: none;
}

.quantity-input::placeholder,
.duration-input::placeholder {
  color: rgba(0, 0, 0, 0.25);
}

.quantity-input[disabled],
.duration-input[disabled] {
  background-color: #FAFAFA;
  color: rgba(0, 0, 0, 0.25);
  border-color: #FAFAFA;
  cursor: not-allowed;
}

.quantity-input[disabled] + .quantity-unit-display,
.duration-input[disabled] + .duration-unit-display {
  color: rgba(0, 0, 0, 0.25);
}

/* 兼容不支持 :has() 的浏览器 */
.quantity-input-wrapper.disabled,
.duration-input-wrapper.disabled {
  background-color: #FAFAFA;
  border-color: #FAFAFA;
}

/* 单选组 */
.resource-radio-group {
  display: flex;
  gap: 12px;
}

.resource-radio-option {
  position: relative;
  display: inline-block;
}

.resource-radio-option input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.radio-label {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #E8E8E8;
  border-radius: 4px;
  background: #FFFFFF;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.65);
  cursor: pointer !important;
  transition: all 0.3s;
  white-space: nowrap;
  width: 162px;
  text-align: center;
}

.resource-radio-option input[type="radio"]:checked + .radio-label {
  border-color: #FA9D3E;
  color: #E97E11;
  font-weight: 700;
  cursor: pointer !important;
}

.resource-radio-option:hover .radio-label {
  border-color: #D9D9D9;
  cursor: pointer !important;
}

/* 弹窗内资源购买列表样式调整 */
#modal-packets-select .resource-purchase-list {
  margin-top: 0;
  padding: 24px 24px 16px;
}

#modal-packets-select .btn-wrapper {
  display: flex;
  justify-content: flex-end;
  padding: 10px 24px;
  margin-top: 8px;
  box-shadow: 0 1px 0 0 #F0F0F0 inset;
}

#modal-packets-select .btn-wrapper .btn {
  width: 60px;
}

#modal-packets-select .modal-dialog {
  width: 680px;
}

.color85 {
  color: rgba(0, 0, 0, 0.85);
}

/* 弹窗样式 */
.popover.popover-dark {
  background-color: rgba(0, 0, 0, 0.75);
  border-color: rgba(0, 0, 0, 0.75);
  color: #fff;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}

.popover.popover-dark .popover-content {
  padding: 6px 8px;
  color: #fff;
  max-width: 320px;
}

/* 箭头颜色（按方向覆盖） */
.popover.top.popover-dark>.arrow {
  border-top-color: rgba(0, 0, 0, .25);
  bottom: -11px;
}

.popover.top.popover-dark>.arrow:after {
  border-top-color: #333;
}

.popover.right.popover-dark>.arrow {
  border-right-color: rgba(0, 0, 0, .25);
}

.popover.right.popover-dark>.arrow:after {
  border-right-color: #333;
}

.popover.bottom.popover-dark>.arrow {
  border-bottom-color: rgba(0, 0, 0, .25);
}

.popover.bottom.popover-dark>.arrow:after {
  border-bottom-color: #333;
}

.popover.left.popover-dark>.arrow {
  border-left-color: rgba(0, 0, 0, .25);
}

.popover.left.popover-dark>.arrow:after {
  border-left-color: #333;
}

.light-blue-text {
  color: #5BC1EB;
}

.light-blue-text:hover,
.light-blue-text:active {
  color: #166bc7;
}

#packets-select-contact-service {
  cursor: pointer;
}

#wxwork-member-interface-consult-customer {
  position: absolute;
  left: 188px;
}