/* New deposit page (deposit-pro.js) — scoped to .dp-* classes */
.dp-page { padding: 0 !important; }
.dp-head { display: flex; align-items: center; gap: 10px; padding: calc(12px + env(safe-area-inset-top, 0px)) 14px 12px; border-bottom: 1px solid var(--pb-line); flex-shrink: 0; }
.dp-back, .dp-close { width: 38px; height: 38px; border-radius: 12px; border: 1px solid var(--pb-line); background: var(--pb-card); color: var(--pb-t1); cursor: pointer; flex-shrink: 0; }
[dir="ltr"] .dp-back i { transform: scaleX(-1); }
.dp-title { flex: 1; min-width: 0; text-align: center; }
.dp-title b { display: block; color: var(--pb-t1); font-size: 1rem; }
.dp-title span { color: var(--pb-t2); font-size: .7rem; }
.dp-body { flex: 1; overflow-y: auto; padding: 16px 14px 28px; display: flex; flex-direction: column; gap: 12px; max-width: 520px; width: 100%; margin: 0 auto; scrollbar-width: none; }
.dp-body::-webkit-scrollbar { width: 0; }
.dp-center { display: grid; place-items: center; min-height: 260px; }
.dp-spin { width: 36px; height: 36px; border-radius: 50%; border: 3px solid var(--pb-line2); border-top-color: var(--pb-acc); animation: dpSpin 1s linear infinite; }
@keyframes dpSpin { to { transform: rotate(360deg); } }

.dp-steps { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.dp-st { display: flex; align-items: center; gap: 6px; color: var(--pb-t3); font-size: .72rem; font-weight: 600; white-space: nowrap; }
.dp-st i { font-style: normal; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--pb-card2); border: 1px solid var(--pb-line2); font-family: var(--pb-num); font-size: .72rem; }
.dp-st.on { color: var(--pb-t1); }
.dp-st.on i { background: var(--pb-acc); color: var(--pb-on-acc); border-color: var(--pb-acc); }
.dp-st.done { color: var(--pb-acc); }
.dp-st.done i { background: var(--pb-acc-soft); color: var(--pb-acc); border-color: rgba(14,203,129,.4); font-size: .6rem; }
.dp-ln { flex: 1; height: 1px; background: var(--pb-line2); min-width: 10px; }

.dp-label { color: var(--pb-t2); font-size: .78rem; font-weight: 600; margin-top: 4px; }
.dp-nets { display: flex; flex-direction: column; gap: 8px; }
.dp-net { display: flex; align-items: center; gap: 12px; width: 100%; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 14px; padding: 13px 14px; color: var(--pb-t1); cursor: pointer; text-align: start; transition: border-color .15s, background .15s; }
.dp-net:hover, .dp-net.on { border-color: var(--pb-acc); background: rgba(14,203,129,.05); }
.dp-net > i { font-style: normal; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-weight: 700; font-family: var(--pb-num); flex-shrink: 0; }
.dp-net > div { flex: 1; min-width: 0; }
.dp-net b { display: block; font-size: .9rem; }
.dp-net span { color: var(--pb-t2); font-size: .72rem; }
.dp-auto { font-style: normal; color: var(--pb-acc); background: var(--pb-acc-soft); padding: 1px 8px; border-radius: 6px; font-size: .68rem; }
.dp-net .dp-chev { color: var(--pb-t3); font-size: .8rem; }
[dir="ltr"] .dp-chev { transform: scaleX(-1); }

.dp-chip { display: flex; align-items: center; gap: 10px; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 12px; padding: 8px 10px; }
.dp-chip > i { font-style: normal; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: .78rem; font-family: var(--pb-num); }
.dp-chip b { flex: 1; color: var(--pb-t1); font-size: .84rem; }
.dp-chip button { background: none; border: 0; color: var(--pb-acc); font-size: .76rem; font-weight: 600; cursor: pointer; }

.dp-amount { display: flex; align-items: center; gap: 10px; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 16px; padding: 6px 14px; }
.dp-amount:focus-within { border-color: var(--pb-acc); box-shadow: 0 0 0 3px var(--pb-acc-soft); }
.dp-amount input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; color: var(--pb-t1); font-family: var(--pb-num); font-size: 1.8rem; font-weight: 600; padding: 8px 0; direction: ltr; text-align: start; }
.dp-amount span { color: var(--pb-t2); font-weight: 600; font-size: .85rem; background: var(--pb-card2); padding: 4px 10px; border-radius: 8px; }
.dp-quick { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 6px; }
.dp-quick button { background: var(--pb-card); border: 1px solid var(--pb-line); color: var(--pb-t1); border-radius: 10px; padding: 9px 0; font-family: var(--pb-num); font-weight: 600; font-size: .82rem; cursor: pointer; }
.dp-quick button.on { border-color: var(--pb-acc); color: var(--pb-acc); background: var(--pb-acc-soft); }
.dp-code { display: flex; align-items: center; gap: 10px; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 12px; padding: 0 14px; }
.dp-code:focus-within { border-color: var(--pb-acc); box-shadow: 0 0 0 3px var(--pb-acc-soft); }
.dp-code i { color: var(--pb-warn); font-size: .9rem; }
.dp-code input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; color: var(--pb-t1); font-family: var(--pb-num); font-size: 1rem; font-weight: 600; letter-spacing: .5px; padding: 12px 0; direction: ltr; text-align: start; text-transform: uppercase; }
.dp-code input::placeholder { color: var(--pb-t3); font-weight: 400; }
.dp-code-hint { color: var(--pb-t3); font-size: .72rem; line-height: 1.6; margin-top: -4px; }
.dp-err { color: var(--pb-dn); font-size: .78rem; }
.dp-err:empty { display: none; }
.dp-info, .dp-note { display: flex; gap: 10px; align-items: flex-start; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 12px; padding: 11px 12px; color: var(--pb-t2); font-size: .74rem; line-height: 1.7; }
.dp-info i, .dp-note i { color: var(--pb-acc); margin-top: 3px; }
.dp-warn { display: flex; gap: 10px; align-items: flex-start; background: rgba(240,185,11,.07); border: 1px solid rgba(240,185,11,.25); border-radius: 12px; padding: 11px 12px; color: #f3cf55; font-size: .74rem; line-height: 1.7; }
.dp-warn i { color: var(--pb-warn); margin-top: 3px; }

.dp-cta { width: 100%; height: 52px; border: 0; border-radius: 14px; background: var(--pb-acc); color: var(--pb-on-acc); font-weight: 700; font-size: .95rem; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 4px; }
.dp-cta:hover { background: var(--pb-acc-h); }
[dir="ltr"] .dp-cta .fa-arrow-left { transform: scaleX(-1); }
.dp-cta.busy { opacity: .6; pointer-events: none; }
.dp-ghost { width: 100%; height: 46px; border-radius: 14px; background: transparent; border: 1px solid var(--pb-line2); color: var(--pb-t2); font-weight: 600; cursor: pointer; }

.dp-sum { display: flex; justify-content: space-between; align-items: center; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 12px; padding: 12px 14px; color: var(--pb-t2); font-size: .8rem; }
.dp-sum b { color: var(--pb-t1); font-size: 1.05rem; direction: ltr; }
.dp-addr-card { background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 18px; padding: 18px 14px 14px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.dp-qr { background: #fff; border-radius: 16px; padding: 10px; width: 180px; height: 180px; display: grid; place-items: center; }
.dp-qr img { width: 160px; height: 160px; display: block; }
.dp-addr-lbl { color: var(--pb-t2); font-size: .74rem; }
.dp-addr { width: 100%; background: var(--pb-bg); border: 1px dashed var(--pb-line2); border-radius: 12px; padding: 11px 12px; color: var(--pb-t1); font-family: var(--pb-num); font-size: .82rem; text-align: center; word-break: break-all; direction: ltr; letter-spacing: .3px; }
.dp-copy { width: 100%; height: 44px; border-radius: 12px; background: var(--pb-acc-soft); color: var(--pb-acc); border: 1px solid rgba(14,203,129,.35); font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px; }
.dp-copy.sm { width: auto; height: 34px; padding: 0 14px; font-size: .78rem; }
.dp-copy.ok { background: var(--pb-acc); color: var(--pb-on-acc); }

.dp-exact { background: linear-gradient(160deg, rgba(14,203,129,.12), rgba(14,203,129,.02)); border: 1px solid rgba(14,203,129,.3); border-radius: 18px; padding: 16px 14px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.dp-exact > span { color: var(--pb-t2); font-size: .78rem; }
.dp-exact b { color: var(--pb-t1); font-size: 1.9rem; font-weight: 700; direction: ltr; }
.dp-exact b small { font-size: .9rem; color: var(--pb-acc); font-weight: 600; }
.dp-timer { color: var(--pb-t2); font-size: .76rem; }
.dp-timer b { color: var(--pb-t1); font-size: .9rem; }
.dp-timer.low b { color: var(--pb-warn); }
.dp-timer.over b { color: var(--pb-dn); }

.dp-track { background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 16px; padding: 6px 14px; }
.dp-tr { display: flex; align-items: center; gap: 12px; padding: 10px 0; color: var(--pb-t3); font-size: .82rem; position: relative; }
.dp-tr + .dp-tr::before { content: ""; position: absolute; top: -10px; inset-inline-start: 12px; width: 2px; height: 20px; background: var(--pb-line2); }
.dp-tr i { font-style: normal; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--pb-card2); border: 1px solid var(--pb-line2); font-family: var(--pb-num); font-size: .72rem; flex-shrink: 0; position: relative; z-index: 1; }
.dp-tr.on { color: var(--pb-t1); font-weight: 600; }
.dp-tr.on i { border-color: var(--pb-acc); color: var(--pb-acc); box-shadow: 0 0 0 4px var(--pb-acc-soft); }
.dp-tr.done { color: var(--pb-t2); }
.dp-tr.done i { background: var(--pb-acc); border-color: var(--pb-acc); color: var(--pb-on-acc); font-size: .6rem; }
.dp-tr em { font-style: normal; color: var(--pb-acc); }

.dp-state { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; background: var(--pb-card); border: 1px solid var(--pb-line); border-radius: 16px; padding: 22px 16px; }
.dp-state i { font-size: 2rem; }
.dp-state.bad i { color: var(--pb-dn); }
.dp-state b { color: var(--pb-t1); }
.dp-state span { color: var(--pb-t2); font-size: .78rem; line-height: 1.7; }
.dp-empty, .dp-done { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 40px 10px; }
.dp-empty i { font-size: 2.2rem; color: var(--pb-t3); }
.dp-empty b, .dp-done b { color: var(--pb-t1); font-size: 1.05rem; }
.dp-empty span, .dp-done span { color: var(--pb-t2); font-size: .8rem; line-height: 1.8; max-width: 320px; }
.dp-done-ic { width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; font-size: 2.4rem; margin-bottom: 6px; }
.dp-done.completed .dp-done-ic { background: var(--pb-acc-soft); color: var(--pb-acc); }
.dp-done.review .dp-done-ic { background: rgba(240,185,11,.1); color: var(--pb-warn); }
.dp-done .dp-cta { margin-top: 14px; max-width: 320px; }

/* ================================================================
   WITHDRAW PAGE — same flow and ids (script.js), new look matching the deposit page
   ================================================================ */
#withdrawFull { padding: 0 !important; }
#withdrawFull .full-page-header { padding: calc(14px + env(safe-area-inset-top, 0px)) 16px 14px !important; justify-content: center; position: relative; font-size: 1rem !important; }
#withdrawFull .full-page-header > span i { display: none; }
#withdrawFull .full-page-header > .fa-times { position: absolute; inset-inline-end: 14px; width: 38px; height: 38px; border-radius: 12px; border: 1px solid var(--pb-line); background: var(--pb-card); display: grid; place-items: center; font-size: .95rem !important; color: var(--pb-t1) !important; }
#withdrawFull .full-page-content { padding: 16px 14px 28px !important; max-width: 520px; width: 100%; margin: 0 auto; }
#withdrawFull .crypto-section-title { color: var(--pb-t2) !important; font-size: .78rem !important; font-weight: 600; margin: 4px 0 8px !important; }
#withdrawFull .crypto-section-title i { display: none; }
#withdrawFull .source-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 8px !important; margin-bottom: 14px; }
#withdrawFull .source-card { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; padding: 12px !important; border-radius: 14px !important; background: var(--pb-card) !important; border: 1px solid var(--pb-line) !important; box-shadow: none !important; }
#withdrawFull .source-card:hover:not(.disabled) { border-color: var(--pb-line2) !important; }
#withdrawFull .source-card.selected { border-color: var(--pb-acc) !important; background: rgba(14,203,129,.06) !important; }
#withdrawFull .source-card.disabled { opacity: .45; }
#withdrawFull .source-ic { width: 32px !important; height: 32px !important; border-radius: 10px !important; background: var(--pb-card2) !important; color: var(--pb-t2) !important; font-size: .85rem !important; }
#withdrawFull .source-card.selected .source-ic { background: var(--pb-acc) !important; color: var(--pb-on-acc) !important; }
#withdrawFull .source-label { color: var(--pb-t2) !important; font-size: .72rem !important; font-weight: 500 !important; }
#withdrawFull .source-amount { color: var(--pb-t1) !important; font-family: var(--pb-num); font-size: .88rem !important; font-weight: 600; direction: ltr; text-align: start; }
#withdrawFull .withdraw-action-panel { background: var(--pb-card) !important; border: 1px solid var(--pb-line) !important; border-radius: 18px !important; padding: 16px 14px !important; }
#withdrawFull .address-input-wrap { background: var(--pb-card2) !important; border: 1px solid var(--pb-line) !important; border-radius: 14px !important; }
#withdrawFull .address-input-wrap:focus-within { border-color: var(--pb-acc) !important; box-shadow: 0 0 0 3px var(--pb-acc-soft) !important; }
#withdrawFull .address-input-wrap input { color: var(--pb-t1) !important; font-family: var(--pb-num) !important; direction: ltr; text-align: start; }
#withdrawFull .address-input-wrap.locked { border-color: rgba(14,203,129,.4) !important; background: rgba(14,203,129,.05) !important; }
#withdrawFull .withdraw-address-locked-note a { color: var(--pb-acc) !important; }
#withdrawFull .receipt-card { background: var(--pb-bg) !important; border: 1px dashed var(--pb-line2) !important; border-radius: 14px !important; }
#withdrawFull .receipt-row { color: var(--pb-t1) !important; }
#withdrawFull .receipt-row b { font-family: var(--pb-num); direction: ltr; }
#withdrawFull .receipt-row.muted { color: var(--pb-t2) !important; border-bottom-color: var(--pb-line) !important; }
#withdrawFull .receipt-row.total, #withdrawFull .receipt-row.total b { color: var(--pb-acc) !important; }
#withdrawFull #confirmWithdrawBtn { height: 52px; border-radius: 14px !important; }
#withdrawFull .crypto-message { text-align: center; margin-top: 10px; }

/* ======================================================================
   Deposit welcome v3 (deposit-pro.js → DepositWelcome): Bitget-style start card for an empty account
   ====================================================================== */
.dw-start, .dw-top, .tp-deposit { display: none; }
body.acct-empty .pro-hero,
body.acct-empty .pro-acct .pro-acct-lbl,
body.acct-empty .pro-acct .pro-acct-total,
body.acct-empty .pro-acct .pro-acct-list,
body.acct-empty #walletDisplay > i,
body.acct-empty #walletDisplay > #walletBalance,
body.acct-empty #pageTrading .tp-bal,
body.acct-empty #pageTrading .tp-topup { display: none !important; }
body.acct-empty .dw-start { display: block; }
body.acct-empty .dw-top { display: inline-flex; }
body.acct-empty #pageTrading .tp-deposit { display: inline-flex; }

.dw-start { margin-bottom: 16px; }
.dw-hello { color: #EAECEF; font-size: 1.05rem; font-weight: 700; margin: 2px 2px 12px; }
.dw-box { display: flex; align-items: center; gap: 10px; background: #1A1C21; border: 1px solid #23262D; border-radius: 18px; padding: 22px 18px 18px; overflow: hidden; }
.dw-box-main { flex: 1; min-width: 0; }
.dw-h { color: #fff; font-size: 1.65rem; font-weight: 900; line-height: 1.3; margin: 0 0 16px; letter-spacing: -.2px; }
.dw-prog { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.dw-prog-bar { flex: 1; max-width: 210px; height: 7px; border-radius: 4px; background: #2E3138; overflow: hidden; }
.dw-prog-bar i { display: block; height: 100%; border-radius: 4px; background: #0ECB81; }
.dw-box.pend .dw-prog-bar i { background: linear-gradient(90deg, #0ECB81, #3ef0a8, #0ECB81); background-size: 200% 100%; animation: dwShine 1.4s linear infinite; }
.dw-prog em { font-style: normal; color: #B7BDC6; font-size: .82rem; font-weight: 600; direction: ltr; }
.dw-all { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; color: #EAECEF; font-size: .85rem; font-weight: 600; cursor: pointer; }
.dw-all svg { width: 13px; height: 13px; }
[dir="ltr"] .dw-all svg { transform: scaleX(-1); }
.dw-box-art { flex: none; width: 104px; }
.dw-wallet { width: 100%; height: auto; display: block; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .55)); }
.dw-c1 { animation: dwFloat 3.2s ease-in-out infinite; }
.dw-c2 { animation: dwFloat 3.2s ease-in-out -1.6s infinite; }
.dw-dep { width: 100%; margin-top: 14px; border: 0; border-radius: 14px; padding: 15px; cursor: pointer;
    background: #fff; color: #0B0E11; font-size: 1rem; font-weight: 800; transition: transform .08s, filter .15s; }
.dw-dep:hover { filter: brightness(.94); }
.dw-dep:active { transform: scale(.985); }
/* computer account panel: compact */
.dw-start.dw-in-acct { margin: 12px 0 8px; }
.dw-start.dw-in-acct .dw-hello { font-size: .85rem; margin-bottom: 8px; }
.dw-start.dw-in-acct .dw-box { padding: 16px 14px 14px; }
.dw-start.dw-in-acct .dw-h { font-size: 1.15rem; margin-bottom: 12px; }
.dw-start.dw-in-acct .dw-box-art { width: 68px; }
.dw-start.dw-in-acct .dw-prog { margin-bottom: 12px; }
.dw-start.dw-in-acct .dw-dep { padding: 12px; font-size: .92rem; margin-top: 10px; }
@media (max-width: 360px) { .dw-h { font-size: 1.4rem; } .dw-box-art { width: 84px; } }

/* top bar pill + trading page button */
.dw-top { align-items: center; border: 0; border-radius: 8px; padding: 5px 12px; font-weight: 800; font-size: .74rem; cursor: pointer; color: #0B0E11; background: #fff; }
#pageTrading .tp-deposit { align-items: center; gap: 6px; border: 0; border-radius: 10px; padding: 9px 16px; font-weight: 800; font-size: .8rem; cursor: pointer;
    white-space: nowrap; color: #0B0E11; background: #fff; }

/* "View all steps" sheet: bottom sheet on phones, centred on computers */
.dw-modal { position: fixed; inset: 0; z-index: 9800; display: flex; align-items: flex-end; justify-content: center; background: rgba(0, 0, 0, .6); animation: dwFade .2s ease; }
.dw-modal[hidden] { display: none; }
.dw-sheet { width: 100%; max-width: 480px; max-height: 90vh; overflow-y: auto; box-sizing: border-box;
    padding: 10px 18px calc(20px + env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; background: #1A1C21; border-top: 1px solid #2B2F36;
    animation: dwUp .3s cubic-bezier(.2, .9, .25, 1); }
.dw-grab { display: block; width: 38px; height: 4px; border-radius: 4px; background: #474D57; margin: 0 auto 10px; }
.dw-sheet-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.dw-sheet-h b { color: #fff; font-size: 1.1rem; font-weight: 800; }
.dw-x { width: 30px; height: 30px; border: 0; border-radius: 50%; display: grid; place-items: center; background: #2B2F36; color: #B7BDC6; cursor: pointer; }
.dw-x svg { width: 14px; height: 14px; }
.dw-prog.big .dw-prog-bar { max-width: none; }
.dw-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dw-list li { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: #22252B; border: 1px solid #2B2F36; }
.dw-list li > i { flex: none; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-weight: 800; font-size: .85rem;
    color: #848E9C; background: #2B2F36; }
.dw-list li > i svg { width: 15px; height: 15px; }
.dw-list li > div { flex: 1; min-width: 0; }
.dw-list li b { display: block; color: #EAECEF; font-size: .92rem; }
.dw-list li small { display: block; color: #848E9C; font-size: .74rem; margin-top: 2px; line-height: 1.5; }
.dw-list li.done > i { background: #0ECB81; color: #0B0E11; }
.dw-list li.done b { color: #B7BDC6; }
.dw-list li.now { border-color: #4a4f58; }
.dw-list li.now > i { background: #fff; color: #0B0E11; }
.dw-list li button { flex: none; border: 0; border-radius: 10px; padding: 9px 16px; font-weight: 800; font-size: .82rem; cursor: pointer; background: #fff; color: #0B0E11; }
body.dw-open { overflow: hidden; }
@media (min-width: 600px) {
    .dw-modal { align-items: center; padding: 20px; }
    .dw-sheet { max-width: 420px; border-radius: 20px; border: 1px solid #2B2F36; padding-top: 18px; animation: dwFade .2s ease; }
    .dw-grab { display: none; }
}
@keyframes dwFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes dwUp { from { transform: translateY(100%); } to { transform: none; } }
@keyframes dwFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes dwShine { from { background-position: 200% 0; } to { background-position: 0 0; } }
@media (prefers-reduced-motion: reduce) { .dw-c1, .dw-c2, .dw-sheet, .dw-modal, .dw-box.pend .dw-prog-bar i { animation: none; } }
