.idpay-body{margin:0;background:linear-gradient(180deg,#e7f1f6 0,#f4f8fa 320px);font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#1d2327;min-height:100vh}
.idpay-top{display:flex;align-items:center;gap:14px;background:linear-gradient(90deg,#0e5271,#1c7fa8);color:#fff;padding:12px 24px;font-weight:600}
.idpay-top img{height:34px}
.idpay-wrap{padding:28px 16px 60px}
.idpay{--b:#1c7fa8;--bd:#0e5271;--y:#ffcb05;--bo:#d7dee3;--mu:#667781;max-width:760px;margin:0 auto;font-size:15px}
.idpay *{box-sizing:border-box}
.idpay-steps{display:flex;gap:6px;margin-bottom:14px}
.idpay-steps span{flex:1;text-align:center;padding:9px 6px;border-radius:999px;background:#e3eaee;color:var(--mu);font-size:13px;font-weight:600}
.idpay-steps span.on{background:var(--bd);color:#fff}
.idpay-steps span.done{background:#cfe6dc;color:#146c43}
.idpay-card{background:#fff;border:1px solid var(--bo);border-radius:16px;padding:26px 28px;box-shadow:0 6px 28px rgba(14,82,113,.10)}
.idpay-card h2{margin:0 0 16px;font-size:20px;color:var(--bd)}
.idpay-pk{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.idpay-opt{position:relative;text-align:left;border:2px solid var(--bo);border-radius:14px;background:#fff;padding:18px 16px 16px;cursor:pointer;transition:.15s;font:inherit;color:inherit}
.idpay-opt:hover{border-color:#8fc3d9;transform:translateY(-1px)}
.idpay-opt.on{border-color:var(--b);background:#f2f9fc;box-shadow:0 0 0 3px rgba(28,127,168,.15)}
.idpay-opt.on:after{content:"✓";position:absolute;top:10px;right:12px;width:24px;height:24px;border-radius:50%;background:var(--b);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px}
.idpay-opt b{display:block;font-size:17px;margin-bottom:4px;padding-right:28px}
.idpay-opt span{display:block;color:var(--mu);font-size:13px;min-height:36px}
.idpay-opt em{display:block;margin-top:10px;font-style:normal;font-size:22px;font-weight:700;color:var(--bd)}
.idpay-opt em small{font-size:12px;font-weight:500;color:var(--mu)}
.idpay-qty{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 6px}
.idpay-qty label{font-weight:600}
.idpay-stepper{display:flex;align-items:center;border:1px solid var(--bo);border-radius:12px;overflow:hidden}
.idpay-stepper button{width:46px;height:46px;border:0;background:#f1f5f8;font-size:22px;cursor:pointer;color:var(--bd)}
.idpay-stepper button:hover{background:#e3edf3}
.idpay-stepper input{width:84px;height:46px;border:0;text-align:center;font-size:18px;font-weight:700;-moz-appearance:textfield}
.idpay-stepper input::-webkit-outer-spin-button,.idpay-stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.idpay-sum{margin:16px 0;background:linear-gradient(135deg,#0e5271,#1c7fa8);color:#fff;border-radius:14px;padding:16px 20px;display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:baseline}
.idpay-sum b{font-size:30px;grid-row:1/3;grid-column:2}
.idpay-sum small{opacity:.85}
.idpay-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--y);color:#1d2327;border:0;border-radius:12px;padding:14px 26px;font-size:16px;font-weight:700;cursor:pointer;text-decoration:none;transition:.15s}
.idpay-btn:hover{filter:brightness(.95);transform:translateY(-1px)}
.idpay-btn.ghost{background:#fff;border:1px solid var(--bo);color:var(--bd)}
.idpay-btn[disabled]{opacity:.5;cursor:default;transform:none}
#idpay-next,#idpay-go{width:100%}
.idpay-row{display:flex;gap:10px}.idpay-row .idpay-btn{flex:1}.idpay-row .ghost{flex:0 0 120px}
.idpay-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.idpay-grid label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:13.5px}
.idpay-grid input{border:1px solid var(--bo);border-radius:10px;padding:12px;font-size:15px;font-family:inherit;font-weight:400}
.idpay-grid input:focus{outline:2px solid var(--b);border-color:var(--b)}
.idpay-mini{margin:16px 0;padding:12px 14px;background:#f2f9fc;border:1px dashed #9bc9dc;border-radius:12px;font-size:14px}
.idpay-err{margin:12px 0;padding:10px 14px;border-radius:10px;background:#fdecec;color:#a02622;border:1px solid #f3c6c4;font-size:14px}
.idpay-final .top{text-align:center;margin-bottom:18px}
.idpay-final .ok{width:54px;height:54px;border-radius:50%;background:#1a8a52;color:#fff;font-size:28px;display:flex;align-items:center;justify-content:center;margin:0 auto 10px}
.idpay-final h2{margin-bottom:4px}
.idpay-final .amount{margin:16px 0;text-align:center;background:#f2f9fc;border:1px solid #bcdbe9;border-radius:14px;padding:16px}
.idpay-final .amount b{display:block;font-size:36px;color:var(--bd)}
.idpay-final .amount span{color:var(--mu);font-size:13px}
.idpay-way{border:1px solid var(--bo);border-radius:14px;padding:16px 18px;margin:12px 0}
.idpay-way h3{margin:0 0 8px;font-size:16px}
.idpay-way p{margin:0 0 12px;color:var(--mu);font-size:13.5px}
.idpay-way .idpay-btn{width:100%}
.idpay-or{text-align:center;color:var(--mu);font-size:13px;margin:4px 0}
.idpay-kv{display:grid;grid-template-columns:110px 1fr auto;gap:6px 10px;align-items:center;font-size:14px}
.idpay-kv dt{color:var(--mu)}.idpay-kv dd{margin:0;font-weight:600;word-break:break-word}
.idpay-kv code{font-size:15px;letter-spacing:.5px}
.idpay-cp{border:1px solid var(--bo);background:#fff;border-radius:8px;padding:5px 10px;font-size:12.5px;cursor:pointer;color:var(--bd)}
.idpay-cp:hover{background:#f2f9fc}
.idpay-ref{margin-top:14px;padding:12px 14px;background:#fff8e0;border:1px solid #f0dc8a;border-radius:12px;font-size:13.5px}
@media(max-width:620px){.idpay-pk,.idpay-grid{grid-template-columns:1fr}.idpay-card{padding:20px 16px}.idpay-kv{grid-template-columns:1fr auto}.idpay-kv dt{grid-column:1/3;margin-top:6px}.idpay-sum b{font-size:26px}}

.idpay-lead{margin:0 0 16px;color:#44525a;line-height:1.55}
.idpay-alt{margin:14px 0 0;font-size:13.5px;color:var(--mu);text-align:center}.idpay-alt a{color:var(--b)}
#idpay-fgo{width:100%;margin-top:14px}
.idpay-wait{display:flex;align-items:center;gap:12px;background:#f2f9fc;border:1px solid #bcdbe9;border-radius:12px;padding:12px 16px;margin-bottom:14px;font-size:14px}
.idpay-spin{width:20px;height:20px;border:3px solid #bcdbe9;border-top-color:var(--b);border-radius:50%;animation:idpay-sp 0.9s linear infinite;flex:0 0 auto}
@keyframes idpay-sp{to{transform:rotate(360deg)}}
.idpay-embed{border:1px solid var(--bo);border-radius:12px;overflow:hidden}
.idpay-embed iframe{display:block;width:100%;border:0;min-height:700px}
.idpay-h3{margin:18px 0 8px;font-size:15px}