/* ==========================================================================
   PLIXWIN – Wallet / Deposit look (v23)
   Clean, flat restyle of the account window and the deposit flow.
   Only visual: the deposit logic itself stays in account.js.
   ========================================================================== */
.pxa-acc, .pxa-panel {
  --pw-bg: #111215; --pw-card: #17191e; --pw-card-2: #1c1f25; --pw-field: #0d0e11;
  --pw-line: #24272e; --pw-line-2: #30343c; --pw-text: #f1f2f4; --pw-muted: #8b8f99;
  --pw-gold: linear-gradient(#e8c98e, #cfa257); --pw-gold-solid: #d8b06a;
  --pw-usd: #3f8f63; --pw-eur: #3e6fb5; --pw-rub: #8f4c5c; --pw-inr: #c28237;
}

/* ---------- window ---------- */
.pxa-acc .pxa-acc-card { background: var(--pw-bg) !important; border: 1px solid var(--pw-line) !important; border-radius: 20px !important; box-shadow: 0 40px 100px -30px rgba(0, 0, 0, .9) !important; backdrop-filter: none !important; }
.pxa-acc .pxa-acc-card::before, .pxa-acc .pxa-acc-card::after { display: none !important; }
.pxa-acc .pxa-acc-head { border-bottom: 1px solid var(--pw-line) !important; background: transparent !important; }
.pxa-acc .pxa-acc-tabs { background: transparent !important; border-right: 1px solid var(--pw-line) !important; }
.pxa-acc .pxa-acc-tabs button { border-radius: 10px !important; color: #b9bcc5 !important; }
.pxa-acc .pxa-acc-tabs button.is-active, .pxa-acc .pxa-acc-tabs button[aria-selected="true"] { background: var(--pw-card-2) !important; color: var(--pw-text) !important; border-color: transparent !important; box-shadow: none !important; }
.pxa-acc .pxa-acc-body { background: transparent !important; }

/* ---------- Deposit / Withdraw / Transfer switch ---------- */
.pxa-acc .pxa-view > .pxa-seg { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 4px; width: 100%; max-width: 460px; padding: 4px !important; border-radius: 12px !important; background: var(--pw-field) !important; border: 1px solid var(--pw-line) !important; }
.pxa-acc .pxa-view > .pxa-seg button { justify-content: center; height: 40px; border-radius: 9px !important; border: 0 !important; background: transparent !important; color: #a9adb6 !important; font-weight: 600 !important; box-shadow: none !important; }
.pxa-acc .pxa-view > .pxa-seg button:hover { color: var(--pw-text) !important; }
.pxa-acc .pxa-view > .pxa-seg button.is-active { background: var(--pw-card-2) !important; color: var(--pw-text) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important; }
.pxa-acc .pxa-view > .pxa-seg button.is-active svg { color: var(--pw-gold-solid); }

/* ---------- currency chips: one compact row ---------- */
.pxa-acc .pxa-curchips { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px !important; }
.pxa-acc .pxa-curchip { min-height: 56px !important; padding: 8px 10px !important; gap: 9px !important; border-radius: 12px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; box-shadow: none !important; backdrop-filter: none !important; }
.pxa-acc .pxa-curchip:hover { border-color: var(--pw-line-2) !important; }
.pxa-acc .pxa-curchip.is-on { background: var(--pw-card-2) !important; border-color: rgba(216, 176, 106, .55) !important; }
.pxa-acc .pxa-curchip .pxa-flag { width: 28px !important; height: 28px !important; min-width: 28px; border-radius: 50% !important; border: 0 !important; background: var(--pw-usd) !important; color: #fff !important; font-size: 13px !important; font-weight: 800; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .2); }
.pxa-acc .pxa-curchip:has(input[value="EUR"]) .pxa-flag { background: var(--pw-eur) !important; }
.pxa-acc .pxa-curchip:has(input[value="RUB"]) .pxa-flag { background: var(--pw-rub) !important; }
.pxa-acc .pxa-curchip:has(input[value="INR"]) .pxa-flag { background: var(--pw-inr) !important; }
.pxa-acc .pxa-curchip b { font-size: 13.5px !important; }
.pxa-acc .pxa-curchip small { font-size: 11.5px !important; color: var(--pw-muted) !important; }

/* ---------- payment method row: hidden when there is only one method ---------- */
.pxa-acc .pxa-methods:has(> .pxa-method:only-child) { display: none !important; }
.pxa-acc .pxa-methods:has(> .pxa-method:only-child) + .pxa-dep-content { margin-top: 0 !important; }
.pxa-acc .pxa-method { border-radius: 12px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; box-shadow: none !important; }
.pxa-acc .pxa-method.is-on { border-color: rgba(216, 176, 106, .55) !important; background: var(--pw-card-2) !important; }

/* ---------- step 1: choose a coin ---------- */
.pxa-acc .pxa-crypto-wrap { display: flex; flex-direction: column; gap: 12px !important; }
.pxa-acc .pxa-crypto-search-box { height: 46px; border-radius: 12px !important; background: var(--pw-field) !important; border: 1px solid var(--pw-line) !important; box-shadow: none !important; }
.pxa-acc .pxa-crypto-search-box:focus-within { border-color: var(--pw-line-2) !important; }
.pxa-acc .pxa-crypto-search-input { font-size: 14px !important; }
.pxa-acc .pxa-chain-bar { gap: 6px !important; padding-bottom: 2px !important; scrollbar-width: none; }
.pxa-acc .pxa-chain-bar::-webkit-scrollbar { display: none; }
.pxa-acc .pxa-chain-btn { height: 32px; padding: 0 12px !important; border-radius: 99px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; color: #b9bcc5 !important; font-size: 12.5px !important; font-weight: 600 !important; white-space: nowrap; box-shadow: none !important; }
.pxa-acc .pxa-chain-btn:hover { color: var(--pw-text) !important; border-color: var(--pw-line-2) !important; }
.pxa-acc .pxa-chain-btn.is-active { background: var(--pw-text) !important; border-color: var(--pw-text) !important; color: #111215 !important; }
/* the "Popular tokens" strip repeats the first coins of the list – hidden for a calmer page */
.pxa-acc .pxa-crypto-wrap > .pxa-chain-bar:has([data-pick-token]),
.pxa-acc .pxa-crypto-wrap > div:has(+ .pxa-chain-bar [data-pick-token]) { display: none !important; }
.pxa-acc .pxa-badge-free { padding: 3px 9px !important; border-radius: 99px !important; font-size: 11.5px !important; background: rgba(61, 220, 132, .08) !important; border: 1px solid rgba(61, 220, 132, .22) !important; }

.pxa-acc .pxa-token-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
.pxa-acc .pxa-token-card { display: flex; align-items: center; gap: 10px !important; min-height: 58px; padding: 9px 12px !important; border-radius: 12px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; box-shadow: none !important; cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.pxa-acc .pxa-token-card:hover { background: var(--pw-card-2) !important; border-color: var(--pw-line-2) !important; transform: none !important; }
.pxa-acc .pxa-token-card.is-selected { border-color: var(--pw-line) !important; }
.pxa-acc .pxa-token-icon { width: 34px !important; height: 34px !important; min-width: 34px; border-radius: 50% !important; background: var(--pw-card-2) !important; border: 1px solid var(--pw-line-2) !important; }
.pxa-acc .pxa-token-icon span { font-size: 10px !important; }
.pxa-acc .pxa-token-info b { font-size: 14px !important; color: var(--pw-text) !important; }
.pxa-acc .pxa-token-info small { font-size: 11.5px !important; color: var(--pw-muted) !important; }
.pxa-acc .pxa-net-badge { padding: 1px 6px !important; border-radius: 6px !important; background: rgba(255, 255, 255, .06) !important; border: 0 !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: .02em; }

/* ---------- step 2: amount ---------- */
.pxa-acc .pxa-crypto-wrap > div:first-child:has([data-back-select]) { padding: 12px 14px !important; border-radius: 14px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; }
.pxa-acc [data-back-select] { height: 32px; padding: 0 12px !important; border-radius: 9px; background: var(--pw-card-2) !important; border: 1px solid var(--pw-line-2) !important; color: var(--pw-text) !important; font-size: 12.5px !important; text-decoration: none !important; }
.pxa-acc form[data-f="crypto-dep-form"] { gap: 12px !important; padding: 16px !important; border-radius: 14px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; box-shadow: none !important; backdrop-filter: none !important; }
.pxa-acc form[data-f="crypto-dep-form"] .pxa-input { height: 52px; border-radius: 12px !important; background: var(--pw-field) !important; border: 1px solid var(--pw-line) !important; }
.pxa-acc form[data-f="crypto-dep-form"] .pxa-input input { font-size: 18px !important; font-weight: 700; }
.pxa-acc .pxa-quick { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px !important; }
.pxa-acc .pxa-quick button { height: 36px; border-radius: 9px !important; background: var(--pw-card-2) !important; border: 1px solid var(--pw-line) !important; color: #d4d6dc !important; font-weight: 600 !important; box-shadow: none !important; }
.pxa-acc .pxa-quick button:hover { border-color: var(--pw-line-2) !important; color: #fff !important; }
.pxa-acc form[data-f="crypto-dep-form"] > div[style] { border-radius: 10px !important; background: var(--pw-field) !important; border: 1px solid var(--pw-line) !important; }
.pxa-acc .pxa-estimate-text { color: var(--pw-text) !important; }
.pxa-acc .pxa-btn-gold { height: 50px; border-radius: 12px !important; background: var(--pw-gold) !important; color: #17140e !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4) !important; font-weight: 700 !important; }
.pxa-acc .pxa-btn-gold:hover { background: #e2be78 !important; }
.pxa-acc .pxa-hint { color: var(--pw-muted) !important; }

/* ---------- step 3: send to this address ---------- */
.pxa-acc .pxa-invoice-panel { gap: 14px !important; padding: 18px !important; border-radius: 16px !important; background: var(--pw-card) !important; border: 1px solid var(--pw-line) !important; box-shadow: none !important; }
.pxa-acc .pxa-invoice-panel::before { display: none !important; }
.pxa-acc .pxa-invoice-header { padding-bottom: 12px !important; border-bottom: 1px solid var(--pw-line) !important; }
.pxa-acc .pxa-invoice-timer { padding: 4px 10px !important; border-radius: 99px !important; background: var(--pw-card-2) !important; border: 1px solid var(--pw-line-2) !important; color: var(--pw-text) !important; font-variant-numeric: tabular-nums; }
.pxa-acc .pxa-invoice-status-bar { border-radius: 10px !important; font-size: 13px !important; }
.pxa-acc .pxa-invoice-status-bar.is-waiting { background: rgba(216, 176, 106, .08) !important; border: 1px solid rgba(216, 176, 106, .25) !important; color: #e6cf9f !important; }
.pxa-acc .pxa-invoice-body { display: grid !important; grid-template-columns: 168px minmax(0, 1fr); gap: 18px !important; align-items: start; }
.pxa-acc .pxa-invoice-qr { width: 168px !important; height: 168px !important; padding: 10px; border-radius: 14px !important; background: #fff !important; }
.pxa-acc .pxa-invoice-row small { font-size: 11px !important; letter-spacing: .06em; text-transform: uppercase; color: var(--pw-muted) !important; }
.pxa-acc .pxa-invoice-amount-val { font-size: 22px !important; color: var(--pw-text) !important; }
.pxa-acc .pxa-invoice-copybox { border-radius: 10px !important; background: var(--pw-field) !important; border: 1px solid var(--pw-line) !important; }
.pxa-acc .pxa-invoice-copybox code { font-size: 12.5px !important; color: var(--pw-text) !important; word-break: break-all; }
.pxa-acc .pxa-invoice-copybtn { border-radius: 8px !important; background: var(--pw-card-2) !important; border: 1px solid var(--pw-line-2) !important; color: var(--pw-text) !important; font-weight: 600 !important; }
.pxa-acc .pxa-net-alert { border-radius: 10px !important; background: rgba(255, 255, 255, .03) !important; border: 1px solid var(--pw-line) !important; border-left: 3px solid var(--pw-gold-solid) !important; color: #c8cbd2 !important; }

/* ---------- profile panel: gold Deposit tile, no Transfer ---------- */
.pxa-panel .pxa-p-actions:has(.pxa-p-act[data-go="wallet:transfer"]) { grid-template-columns: repeat(2, 1fr) !important; }
.pxa-panel .pxa-p-act[data-go="wallet:transfer"] { display: none !important; }
.pxa-panel .pxa-p-act.is-deposit { background: none !important; }
.pxa-panel .pxa-p-act.is-deposit span { background: var(--pw-gold) !important; border-color: transparent !important; color: #fffaf0 !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4) !important; }
.pxa-panel .pxa-p-act.is-deposit:hover span { background: #e2be78 !important; }
.pxa-panel .pxa-p-act.is-deposit { color: var(--pw-text) !important; }

/* ---------- wallet: Transfer tab removed ---------- */
.pxa-acc .pxa-view > .pxa-seg:has(button[data-w="transfer"]) { grid-template-columns: repeat(2, 1fr) !important; max-width: 320px; }
.pxa-acc .pxa-view > .pxa-seg button[data-w="transfer"] { display: none !important; }

/* ---------- coin list: no long names, famous coins first ---------- */
.pxa-acc .pxa-token-info small { display: none !important; }
.pxa-acc .pxa-token-card { min-height: 54px; }
.pxa-acc .pxa-token-card[data-token="usdttrc20"] { order: -17; }
.pxa-acc .pxa-token-card[data-token="usdtbsc"] { order: -16; }
.pxa-acc .pxa-token-card[data-token="usdtton"] { order: -15; }
.pxa-acc .pxa-token-card[data-token="usdterc20"] { order: -14; }
.pxa-acc .pxa-token-card[data-token="usdtsol"] { order: -13; }
.pxa-acc .pxa-token-card[data-token="usdtmatic"] { order: -12; }
.pxa-acc .pxa-token-card[data-token="btc"] { order: -11; }
.pxa-acc .pxa-token-card[data-token="eth"] { order: -10; }
.pxa-acc .pxa-token-card[data-token="sol"] { order: -9; }
.pxa-acc .pxa-token-card[data-token="trx"] { order: -8; }
.pxa-acc .pxa-token-card[data-token="bnbbsc"] { order: -7; }
.pxa-acc .pxa-token-card[data-token="ton"] { order: -6; }
.pxa-acc .pxa-token-card[data-token="ltc"] { order: -5; }
.pxa-acc .pxa-token-card[data-token="usdc"] { order: -4; }
.pxa-acc .pxa-token-card[data-token="usdcbsc"] { order: -3; }
.pxa-acc .pxa-token-card[data-token="doge"] { order: -2; }
.pxa-acc .pxa-token-card[data-token="xrp"] { order: -1; }
/* Start view (empty search, All Chains): only the well-known coins, the rest via search or a chain */
.pxa-acc .pxa-crypto-wrap:has(.pxa-crypto-search-input:placeholder-shown):has(.pxa-chain-btn[data-chain="all"].is-active) .pxa-token-card:not([data-token="usdttrc20"]):not([data-token="usdtbsc"]):not([data-token="usdtton"]):not([data-token="usdterc20"]):not([data-token="usdtsol"]):not([data-token="usdtmatic"]):not([data-token="btc"]):not([data-token="eth"]):not([data-token="sol"]):not([data-token="trx"]):not([data-token="bnbbsc"]):not([data-token="ton"]):not([data-token="ltc"]):not([data-token="usdc"]):not([data-token="usdcbsc"]):not([data-token="doge"]):not([data-token="xrp"]) { display: none !important; }
.pxa-acc .pxa-crypto-wrap:has(.pxa-crypto-search-input:placeholder-shown):has(.pxa-chain-btn[data-chain="all"].is-active) .pxa-token-grid ~ *, .pxa-acc .pxa-crypto-wrap:has(.pxa-crypto-search-input:placeholder-shown):has(.pxa-chain-btn[data-chain="all"].is-active) div:has(> .pxa-badge-free) > span:first-child { display: none !important; }
.pxa-acc .pxa-crypto-wrap:has(.pxa-crypto-search-input:placeholder-shown):has(.pxa-chain-btn[data-chain="all"].is-active) div:has(> .pxa-badge-free)::before { content: "Popular coins"; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--pw-muted); }
.pxa-acc .pxa-crypto-wrap:has(.pxa-crypto-search-input:placeholder-shown):has(.pxa-chain-btn[data-chain="all"].is-active) .pxa-token-grid::after { content: "Type a coin name above or pick a chain to see all 250+ coins."; grid-column: 1 / -1; order: 99; padding: 6px 2px 2px; font-size: 12px; color: var(--pw-muted); text-align: center; }

/* ---------- phones ---------- */
@media (max-width: 760px) {
  .pxa-acc .pxa-acc-card { border-radius: 0 !important; border: 0 !important; }
  .pxa-acc .pxa-acc-tabs { border-right: 0 !important; border-bottom: 1px solid var(--pw-line) !important; }
  .pxa-acc .pxa-view > .pxa-seg { max-width: none; }
  .pxa-acc .pxa-view > .pxa-seg button { height: 38px; font-size: 13px !important; gap: 6px; }
  .pxa-acc .pxa-curchips { gap: 6px !important; }
  .pxa-acc .pxa-curchip { flex-direction: column; justify-content: center; align-items: center !important; min-height: 64px !important; padding: 8px 4px !important; gap: 4px !important; text-align: center; }
  .pxa-acc .pxa-curchip > span:last-child { display: flex; flex-direction: column; align-items: center; }
  .pxa-acc .pxa-curchip .pxa-flag { width: 24px !important; height: 24px !important; min-width: 24px; font-size: 11px !important; }
  .pxa-acc .pxa-curchip b { font-size: 12.5px !important; }
  .pxa-acc .pxa-curchip small { font-size: 10.5px !important; }
  .pxa-acc .pxa-token-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .pxa-acc .pxa-token-card { min-height: 54px; padding: 8px 10px !important; }
  .pxa-acc .pxa-quick { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .pxa-acc .pxa-quick button { font-size: 12px !important; padding: 0 !important; }
  .pxa-acc .pxa-invoice-panel { padding: 14px !important; }
  .pxa-acc .pxa-invoice-body { grid-template-columns: 1fr; justify-items: center; }
  .pxa-acc .pxa-invoice-details { width: 100%; }
  .pxa-acc .pxa-invoice-amount-val { font-size: 19px !important; }
}
@media (max-width: 760px) {
  /* profile sheet: clear "Log out" button next to Settings */
  .pxa-panel .pxa-p-foot { display: grid !important; grid-template-columns: 1fr 1fr; }
  .pxa-panel .pxa-p-foot [data-act="logout"] { width: auto !important; gap: 8px; justify-content: center; }
  .pxa-panel .pxa-p-foot [data-act="logout"]::after { content: "Log out"; font-size: 14px; font-weight: 600; }
}
@media (max-width: 380px) {
  .pxa-acc .pxa-token-grid { grid-template-columns: 1fr !important; }
}
/* coin list uses the window's own scroll instead of a second inner scroll box */
.pxa-acc .pxa-token-grid { max-height: none !important; overflow: visible !important; padding-right: 0 !important; }
/* network tags (TRC20, ERC20, BEP20 …): one calm colour instead of a different colour per chain */
.pxa-acc .pxa-net-badge { color: #b9bcc5 !important; background: rgba(255, 255, 255, .07) !important; }
