/* Bitcoin Farm — display currency chip + list (fx-view.js) */
.fx-chip { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; padding: 2px 10px; border-radius: 999px;
  border: 1px solid var(--pb-line2); background: var(--pb-card2); color: var(--pb-t1); font-family: var(--pb-num); font-size: .72rem; font-weight: 600; cursor: pointer; }
.fx-chip i { font-size: .6rem; color: var(--pb-t2); }
.pro-hero-top .fx-chip { margin-inline-start: 8px; margin-inline-end: auto; }
.pro-acct-lbl + .fx-chip { margin-top: 6px; }
.fx-sub { color: var(--pb-t2); font-size: .8rem; direction: ltr; text-align: start; unicode-bidi: plaintext; margin: -8px 0 12px; }
/* the unit after a balance: small grey letters, like Binance ("1,250.40 USDT") */
.fx-u { font-size: .46em; font-weight: 600; color: var(--pb-t2); margin-inline-start: .45em; letter-spacing: 0; }
.pro-sub .fx-u, #asW .fx-u, #asM .fx-u, #assetBalanceDisplay2 .fx-u { font-size: .78em; margin-inline-start: .3em; }
/* Arabic: the balances sit on the right, under their label */
html[dir="rtl"] .pro-hero-big, html[dir="rtl"] .pro-acct-total, html[dir="rtl"] .fx-sub,
html[dir="rtl"] .pro-sub b, html[dir="rtl"] body .pro-sub .wallet-balance { text-align: right; }
.fx-sub:empty { display: none; }
.pro-acct-total + .fx-sub { margin: 2px 0 10px; }
/* BTC / ETH values are longer: smaller text in the three small boxes */
body.fx-crypto .pro-sub b, html body.fx-crypto .pro-sub .wallet-balance { font-size: .74rem !important; letter-spacing: -.2px; }
@media (max-width: 600px) {
  #proTotalBalance, #asTotal { font-size: clamp(1.45rem, 7.4vw, 2.05rem); }
}

.fx-ov { position: fixed; inset: 0; z-index: 10002; background: rgba(0,0,0,.65); display: flex; align-items: flex-end; justify-content: center; opacity: 0; transition: opacity .3s ease; }
.fx-ov.show { opacity: 1; }
.fx-sheet { width: 100%; max-width: 520px; background: var(--pb-bg2); border-radius: 22px 22px 0 0; padding: 10px 14px calc(20px + env(safe-area-inset-bottom, 0px));
  transform: translateY(100%); transition: transform .34s cubic-bezier(.32,.72,0,1); color: var(--pb-t1); display: flex; flex-direction: column; gap: 6px; }
.fx-ov.show .fx-sheet { transform: none; }
.fx-grab { width: 36px; height: 4px; border-radius: 2px; background: rgba(255,255,255,.14); margin: 0 auto 6px; }
.fx-h { display: flex; align-items: center; justify-content: space-between; margin: 0 4px; }
.fx-h b { font-size: 1.05rem; }
.fx-x { width: 32px; height: 32px; border-radius: 50%; border: 0; background: var(--pb-card); color: var(--pb-t1); cursor: pointer; display: grid; place-items: center; }
.fx-note { margin: 0 4px 6px; color: var(--pb-t2); font-size: .78rem; }
.fx-opt { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 54px; padding: 0 14px; border-radius: 14px;
  border: 1px solid transparent; background: var(--pb-card); color: var(--pb-t1); font-family: inherit; cursor: pointer; text-align: start; }
.fx-opt.on { border-color: var(--pb-acc); background: var(--pb-acc-soft); }
.fx-opt > span:first-child { display: flex; flex-direction: column; }
.fx-opt b { font-family: var(--pb-num); font-size: .95rem; }
.fx-opt small { color: var(--pb-t2); font-size: .72rem; }
.fx-opt .pro-num { color: var(--pb-t2); font-size: .85rem; }
