/* =========================================================
   带路集团官网 — 立即购买（微信扫码下单）弹窗样式
   设计系统：红 #E62129（主） · 深蓝 #0F2B46（辅）
   与官网 style.css 设计令牌保持一致，融入既有 .dc-tier-item 结构。
   ========================================================= */

/* ---- 服务项：名称/说明 + 立即购买按钮 一行 ---- */
.dc-tier-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.8rem;
}
.dc-tier-main{flex:1;min-width:0;}
.dc-buy-now{
  flex:none;
  border:1px solid var(--red);
  background:var(--red);
  color:#fff;
  font-family:inherit;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.02em;
  padding:.46rem .95rem;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  transition:background .15s ease, transform .12s ease, box-shadow .15s ease;
}
.dc-buy-now:hover{
  background:var(--red-dark);
  border-color:var(--red-dark);
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(230,33,41,.28);
}
.dc-buy-now:active{transform:translateY(0);}

/* ---- 弹窗容器 ---- */
.dc-order-modal{
  position:fixed;
  inset:0;
  z-index:100000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.dc-order-modal.is-open{display:flex;}
.dc-order-modal__mask{
  position:absolute;
  inset:0;
  background:rgba(15,43,70,.46);
  backdrop-filter:blur(2px);
}
.dc-order-modal__box{
  position:relative;
  width:100%;
  max-width:430px;
  background:#fff;
  border-radius:var(--radius);
  box-shadow:0 24px 70px rgba(15,43,70,.32);
  overflow:hidden;
  animation:dc-om-pop .18s ease;
}
@keyframes dc-om-pop{from{opacity:0;transform:translateY(10px) scale(.98);}to{opacity:1;transform:none;}}

.dc-order-modal__close{
  position:absolute;
  top:12px;right:14px;
  width:34px;height:34px;
  border:none;background:transparent;
  font-size:24px;line-height:1;
  color:var(--slate);
  cursor:pointer;
  border-radius:50%;
  transition:background .15s ease, color .15s ease;
}
.dc-order-modal__close:hover{background:var(--bg-alt);color:var(--ink);}

.dc-order-modal__head{
  background:linear-gradient(135deg,var(--red) 0%,var(--red-dark) 100%);
  color:#fff;
  padding:1.4rem 1.6rem 1.2rem;
}
.dc-order-modal__eyebrow{
  display:inline-block;
  font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  opacity:.85;margin-bottom:.5rem;
}
.dc-order-modal__head h3{
  color:#fff;font-size:1.3rem;margin:0;
}
.dc-order-modal__svc{
  margin:.4rem 0 0;
  font-size:.9rem;
  color:rgba(255,255,255,.9);
}

.dc-order-modal__body{padding:1.5rem 1.6rem 1.7rem;}

/* ---- 表单 ---- */
.dc-order-form{display:flex;flex-direction:column;gap:.9rem;}
.dc-order-form label{
  display:flex;flex-direction:column;
  font-size:.84rem;font-weight:600;color:var(--ink);
  gap:.4rem;
}
.dc-order-form input{
  width:100%;
  border:1px solid var(--line);
  border-radius:10px;
  padding:.7rem .9rem;
  font-size:.95rem;
  font-family:inherit;
  color:var(--ink);
  background:#fff;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.dc-order-form input:focus{
  outline:none;
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(230,33,41,.12);
}
.dc-order-submit{margin-top:.3rem;}
.dc-order-form-msg{
  margin:.2rem 0 0;
  font-size:.82rem;
  min-height:1rem;
  color:var(--slate);
}
.dc-order-form-msg.is-error{color:var(--red);}

/* ---- 支付面板 ---- */
.dc-order-pay{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.7rem;}
.dc-order-pay-amount{
  margin:0;
  font-size:1.15rem;font-weight:800;color:var(--ink);
}
.dc-order-qr{
  width:240px;height:240px;
  display:flex;align-items:center;justify-content:center;
  padding:10px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
}
.dc-order-qr svg, .dc-order-qr img{width:100%;height:auto;display:block;}
.dc-order-qr a{color:var(--red);font-weight:600;font-size:.9rem;word-break:break-all;}
.dc-order-pay-tip{margin:.2rem 0 0;font-size:.9rem;color:var(--slate);}
.dc-order-pay-tip strong{color:var(--ink);}
.dc-order-pay-status{margin:0;font-size:.86rem;color:var(--slate);}
.dc-order-pay-state{color:var(--red);font-weight:700;}

/* ---- 成功态 ---- */
.dc-order-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.7rem;padding:.6rem 0;}
.dc-order-done-ico{
  width:64px;height:64px;border-radius:50%;
  background:var(--red);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:34px;font-weight:800;
  box-shadow:0 10px 26px rgba(230,33,41,.3);
}
.dc-order-done h4{font-size:1.25rem;margin:.2rem 0 0;}
.dc-order-done p{margin:0;font-size:.92rem;color:var(--slate);}

@media (max-width:520px){
  .dc-tier-item{flex-direction:column;align-items:stretch;}
  .dc-buy-now{width:100%;text-align:center;}
  .dc-order-modal__box{max-width:100%;}
}