/* Proxo 2026: eye-friendly profile and transaction surfaces on web and admin.
   Restrained Proxo blue for headings/actions; near-black values and clear RTL/LTR. */
#pageProfile,#pageTx{
 --surface:#fff;--surface-2:#f8fafc;--surface-hover:#f2f7fd;
 --border:#e7edf4;--border-strong:#cbd7e6;
 --text:#172338;--text-muted:#516278;--text-faint:#66788e;
 --primary:#1685fa;--primary-hover:#0d72d8;--on-primary:#fff;
 --shadow-sm:0 8px 30px rgba(20,43,78,.045);
 color:#172338;background:#f8fafc;
 border-radius:22px;padding:20px 16px 26px;
 font-family:Rabar,Arial,sans-serif;
 font-synthesis:none;-webkit-font-smoothing:antialiased;
}
#pageProfile .page-head,#pageTx .page-head{margin-bottom:20px}
#pageProfile .page-head h2,#pageTx .page-head h2{
 font-weight:500;color:#171d28;line-height:1.6;
}
#pageProfile .page-head .icn,#pageTx .page-head .icn{color:#1685fa}
#pageProfile .pf-hero,#pageProfile .pf-card,#pageProfile .pf-menu,
#pageProfile .kyc-card,#pageTx .tx-summary,#pageTx .tx-card,
#pageTx .tx-skel{
 background:#fff;border:1px solid #e8edf3;border-radius:21px;
 box-shadow:0 8px 30px rgba(18,43,77,.04);
}
#pageProfile .pf2-cover{
 height:74px;background:linear-gradient(115deg,#ebf5ff 0%,#f5faff 60%,#fff 100%);
 border-bottom:1px solid #e9f0f8;
}
#pageProfile .pf2-avatar-wrap{margin-top:-36px}
#pageProfile .pf2-avatar{
 border:4px solid white;background:#1685fa;color:#fff;
 box-shadow:0 8px 24px rgba(22,133,250,.11);
}
#pageProfile .pf-name,#pageProfile .pf2-identity .pf-name{
 color:#171d28;font-weight:500;line-height:1.5;overflow-wrap:anywhere;
}
#pageProfile .pf2-handle{
 background:#f3f8ff;border-color:#dfebf9;border-radius:12px;
 color:#245c98;font-weight:400;
}
#pageProfile .pf-email{color:#637388;font-size:13px;direction:ltr;text-align:center;overflow-wrap:anywhere}
#pageProfile .pf-chip{
 background:#f7faff;border:1px solid #e4ecf7;color:#51647e;
 font-weight:400;padding:8px 12px;
}
#pageProfile .pf-card{padding:21px 19px;margin-bottom:14px}
#pageProfile .pf-card-title{color:#1685fa;font-weight:500;font-size:15px;line-height:1.6;margin-bottom:17px}
#pageProfile .field-label{color:#283950;font-weight:400;line-height:1.7}
#pageProfile input.input,#pageTx input.input{
 background:#fff;border:1px solid #dce6f0;color:#171d28;
 border-radius:13px;min-height:48px;
 font-family:Rabar,Arial,sans-serif;font-size:15px;font-weight:400;
}
#pageProfile input.input:focus,#pageTx input.input:focus{
 border-color:#1685fa;outline:3px solid rgba(22,133,250,.1);outline-offset:1px;
}
#pageProfile .pf-menu-item{
 min-height:62px;padding:15px 18px;font-size:14px;
 color:#22344d;font-weight:400;border-bottom-color:#edf0f4;
}
#pageProfile .pf-menu-ico{background:#edf5ff;color:#1685fa;border-radius:11px}
#pageProfile .pf-menu-item b{font-weight:500}
#pageProfile .pf-menu-item span:not(.icn){color:#7a899b}
#pageProfile .pf-menu-item.danger{color:#ba3b3b}
#pageProfile .pf-menu-item.danger .pf-menu-ico{color:#c34545;background:#fff4f4}
#pageTx .tx-summary{padding:18px;margin-bottom:16px}
#pageTx .tx-sum-cap{color:#1685fa;font-size:13px;font-weight:500;margin-bottom:13px}
#pageTx .tx-sum-pair{align-items:stretch;gap:10px}
#pageTx .tx-sum-item{
 background:#f8fafc;border:1px solid #edf0f5;border-radius:13px;
 padding:13px 12px;display:flex;align-items:flex-start;flex-direction:column;gap:5px;
}
#pageTx .tx-sum-item.recv{align-items:flex-start;text-align:start}
#pageTx .tx-sum-lbl{color:#65768d;font-size:12px;font-weight:400}
#pageTx .tx-sum-val,#pageTx .tx-sum-item.recv .tx-sum-val{
 color:#172338;font-size:18px;font-weight:550;line-height:1.6;text-align:right;
}
#pageTx .filter-scroll{gap:8px;padding:3px 0 9px}
#pageTx .filter-chip{
 background:#fff;border:1px solid #e4eaf3;color:#53667d;
 font-weight:400;border-radius:12px;min-height:42px;padding:9px 13px;
}
#pageTx .filter-chip.on{background:#edf5ff;border-color:#b8d7ff;color:#0e6ed8;font-weight:500}
#pageTx .filter-chip .chip-count{background:#f0f3f8;color:#52657b}
#pageTx .filter-chip.on .chip-count{background:#dcecff;color:#0e6ed8}
#pageTx .tx-card{padding:17px 16px;margin-bottom:12px}
#pageTx .tx-route{color:#172338;font-weight:500;font-size:14px;line-height:1.65;flex-wrap:wrap}
#pageTx .tx-amount{color:#171d28;font-size:20px;font-weight:550}
#pageTx .tx-amount-sent,#pageTx .tx-card-foot{color:#607086;line-height:1.8}
#pageTx .tx-amount-sent b{font-weight:500}
#pageTx .tx-code{font-size:11px;direction:ltr;unicode-bidi:isolate}
#pageTx .tx-card.needs-action{border-color:#eab5b5}
#pageTx .status-badge{font-weight:500;border-radius:10px}
#pageTx .result-count{font-size:12px;color:#64748b}
#pageTx .search-wrap{margin-bottom:16px}
#pageTx .search-ico{color:#1685fa}
/* Detail sheet is outside the page DOM: style it directly. */
.tx-sheet{
 --surface:#fff;--surface-2:#f8fafc;--border:#e7edf4;
 --text:#172338;--text-muted:#536780;--text-faint:#738299;--primary:#1685fa;
 background:#fff;color:#172338;border-top-color:#e8edf3;
 box-shadow:0 -14px 46px rgba(18,38,68,.09);
}
.tx-sheet .tx-damounts>div{background:#f8fafc;border:1px solid #e8edf4;border-radius:13px;padding:15px}
.tx-sheet .tx-damounts b,.tx-sheet .tx-damounts b.recv{color:#171d28;font-weight:550}
.tx-sheet .tx-dlbl{color:#63738a}
.tx-sheet .tx-dval{color:#171d28;font-weight:500}
.tx-sheet .tx-drow{min-height:48px;padding:12px 14px;line-height:1.7}
.tx-sheet .tx-dgroup{border-radius:15px}
.tx-sheet .tx-dcode{border-radius:11px}
/* Admin account and transaction pages use the same visual hierarchy. */
#pgAccounts .sec-hdr h3,#pgOrders .sec-hdr h3{color:#1685fa;font-weight:500}
#pgAccounts .tbl-wrap,#pgOrders .tbl-wrap,#pgAccounts .acc-card,
#pgOrders .rec-card,#pgDashboard .rec-card{
 background:#fff;border:1px solid #e8edf3;border-radius:20px;
 box-shadow:0 8px 30px rgba(18,43,77,.035);
}
#pgAccounts .acc-card,#pgOrders .rec-card,#pgDashboard .rec-card{padding:17px}
#pgAccounts .user-cell-name,#pgOrders .user-cell-name,
#pgAccounts .rec-card-name,#pgOrders .rec-card-name{color:#171d28;font-weight:500}
#pgAccounts .user-cell-email,#pgOrders .user-cell-email,
#pgAccounts .rec-card-sub,#pgOrders .rec-card-sub{color:#738196}
#pgOrders .rec-card-amount,#pgOrders .rec-card-value{
 font-family:Inter,Rabar,Arial,sans-serif;font-weight:550;color:#171d28
}
#pgAccounts .mini-av,#pgOrders .mini-av,#pgDashboard .mini-av{
 background:#edf5ff;color:#1685fa;border:1px solid #dceafa;
}
#pgAccounts .tbl-filter,#pgOrders .tbl-filter{gap:9px;padding:15px;background:#fff}
#pgAccounts .tbl-search,#pgOrders .tbl-search{
 min-height:44px;border-radius:12px;font-weight:400;color:#171d28;
}
#pgAccounts .act-btn,#pgOrders .act-btn{font-weight:500}
@media(max-width:600px){
 #pageProfile,#pageTx{border-radius:18px;padding:16px 11px 24px}
 #pageProfile .pf-card{padding:17px 15px}
 #pageTx .tx-sum-pair{gap:8px}
 #pageTx .tx-sum-item{padding:11px 9px}
 #pageTx .tx-sum-val,#pageTx .tx-sum-item.recv .tx-sum-val{font-size:16px}
 #pageTx .tx-card{padding:15px 13px}
}
@media(prefers-reduced-motion:reduce){
 #pageProfile *,#pageTx *,.tx-sheet *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}


/* Calm, consistent controls for customers: not every action needs a blue fill.
   Main submissions use charcoal; passive controls are neutral and low-glare. */
:root{
  --calm-control:#eef0f3;
  --calm-control-text:#293445;
  --calm-control-border:#dce2e9;
}
.btn.btn-primary{
  background:#edf0f4;
  color:#293445;
  border:1px solid #dfe5ed;
  box-shadow:none;
  filter:none;
  font-weight:500;
}
.btn.btn-primary:hover{
  background:#e4e8ed;
  border-color:#cbd5e1;
  color:#232e3e;
  box-shadow:none;
  filter:none;
  transform:none;
}
.btn.btn-primary:active{background:#dce2e9;transform:scale(.99)}
/* Submit, confirm and sign-in are the only solid, high-contrast actions. */
#submitBtn,#confirmSendBtn,#pfSaveBtn,#kycSubmitBtn,
#supportSubmitBtn,#orderCorrectionSubmitBtn,
#authBtn,#emailNextBtn,#nameNextBtn,#otpVerifyBtn,
#forgotSendBtn,#fpVerifyBtn,#fpSaveBtn{
  background:#303946;
  border:1px solid #303946;
  color:#fff;
  box-shadow:none;
  font-weight:550;
}
#submitBtn:hover,#confirmSendBtn:hover,#pfSaveBtn:hover,
#kycSubmitBtn:hover,#supportSubmitBtn:hover,
#orderCorrectionSubmitBtn:hover,#authBtn:hover,
#emailNextBtn:hover,#nameNextBtn:hover,#otpVerifyBtn:hover,
#forgotSendBtn:hover,#fpVerifyBtn:hover,#fpSaveBtn:hover{
  background:#242c38;
  border-color:#242c38;
  box-shadow:none;
}
.btn.btn-ghost,.quick-amount-btn,.icon-btn,.search-clear{
  background:#f4f5f7;
  border-color:#e0e5eb;
  color:#344155;
  box-shadow:none;
}
.btn.btn-ghost:hover,.quick-amount-btn:hover,.icon-btn:hover,.search-clear:hover{
  background:#e9edf1;
  border-color:#cbd5df;
  color:#293547;
  box-shadow:none;
}
.bn-item.on,.hdr-nav-link.on{
  background:transparent;
  color:#344357;
  font-weight:550;
}
.bn-item.on .bn-ico{
  background:#e9edf2;
  color:#344357;
}
.hdr-nav-link.on{background:#eef0f3}
.filter-chip.on,
#pageTx .filter-chip.on{
  background:#e9edf2;
  border-color:#cbd5df;
  color:#303d4f;
  font-weight:550;
}
.filter-chip.on .chip-count,
#pageTx .filter-chip.on .chip-count{
  background:#dce2e9;
  color:#39485e;
}
#pageProfile .pf-card-title,#pageTx .tx-sum-cap{
  color:#263342;
  font-weight:550;
}
#pageProfile .pf-menu-ico{
  background:#f0f2f5;
  color:#59697f;
}
#pageProfile .pf2-avatar:not(.has-photo){
  background:#e9eef4;
  color:#3d4d63;
  box-shadow:none;
}
#pageProfile .pf2-handle{
  background:#f2f4f7;
  border-color:#e1e7ed;
  color:#475970;
}
#pageProfile .pf-chip{
  background:#f5f6f8;
  border-color:#e6eaf0;
  color:#4f5e73;
}
#pageTx .tx-sum-item,#pageTx .tx-damounts>div{
  background:#f7f8fa;
}
#pageTx .tx-amount,#pageTx .tx-sum-val,
#pageTx .tx-sum-item.recv .tx-sum-val{color:#263342}
#pageProfile .page-head .icn,#pageTx .page-head .icn{color:#657589}
/* Keep true errors, warnings, verified/success status and alerts semantic. */
.btn:focus-visible,.filter-chip:focus-visible,.bn-item:focus-visible,
.hdr-nav-link:focus-visible,.pf-menu-item:focus-visible{
  outline:2px solid #526985;
  outline-offset:3px;
}
[data-theme="dark"] .btn.btn-primary{
  background:#303a48;
  border-color:#455164;
  color:#e9edf3;
}
[data-theme="dark"] .btn.btn-ghost,
[data-theme="dark"] .quick-amount-btn,
[data-theme="dark"] .icon-btn{
  background:#252d39;
  border-color:#394559;
  color:#e2e8f0;
}
[data-theme="dark"] .filter-chip.on,
[data-theme="dark"] .bn-item.on .bn-ico,
[data-theme="dark"] .hdr-nav-link.on{
  background:#303a48;
  border-color:#526174;
  color:#e6edf5;
}
[data-theme="dark"] #submitBtn,[data-theme="dark"] #confirmSendBtn,
[data-theme="dark"] #pfSaveBtn,[data-theme="dark"] #kycSubmitBtn,
[data-theme="dark"] #supportSubmitBtn{
  background:#414d5e;
  border-color:#57667b;
  color:#fff;
}
@media(prefers-reduced-motion:reduce){
 .btn,.icon-btn,.filter-chip,.bn-item{transition:none!important}
}

/* Small descriptions maintain comfortable contrast on light cards. */
#pageProfile .pf-menu-item span:not(.icn),#pageProfile .pf-email,
#pageTx .tx-card-foot,#pageTx .tx-amount-sent,#pageTx .tx-sum-lbl{color:#526176}

/* Restore blue headings on customer profile and transactions; controls stay neutral. */
#pageProfile .page-head h2,#pageTx .page-head h2,
#pageProfile .pf-card-title,#pageTx .tx-sum-cap,
#pageProfile .section-title,#pageTx .section-title,
.tx-sheet .tx-sheet-head h3{color:#1685fa!important}