/* Shared full-screen market picker for all mobile trading products. */
.sym-drawer{position:fixed!important;inset:0!important;z-index:10000!important;display:none!important;flex-direction:column!important;background:#0b101c!important;opacity:1!important;transition:none!important}
.sym-drawer.show{display:flex!important;opacity:1!important}
.sym-drawer .sym-mask{display:none!important}
.sym-drawer .sym-panel{position:relative!important;inset:auto!important;z-index:1!important;width:100%!important;height:100%!important;max-height:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:#0b101c!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;transform:none!important;transition:none!important}
.symbol-picker-header{height:58px;display:grid;grid-template-columns:36px minmax(0,1fr) 36px;align-items:center;gap:4px;padding:calc(env(safe-area-inset-top) + 6px) 14px 6px;background:#141c2f;border-bottom:1px solid #232e45;flex-shrink:0}
.symbol-picker-header h3{margin:0 0 0 2px;color:#f1f4fa;font-size:20px;font-weight:800;letter-spacing:-.3px}
.symbol-picker-back,.symbol-picker-search-button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:0;border-radius:10px;background:transparent;color:#9ba8bd;font-size:19px;cursor:pointer;transition:background .15s,color .15s,transform .15s}
.symbol-picker-back:active,.symbol-picker-search-button:active{transform:scale(.94);background:#202a3d;color:#fff}
.sym-drawer .sp-search{width:auto!important;max-height:60px;margin:0!important;padding:8px 12px!important;background:#101727!important;border:0!important;border-bottom:1px solid #1b2538!important;border-radius:0!important;overflow:hidden!important;flex-shrink:0;transition:max-height .2s ease,padding .2s ease,border-color .2s ease}
.sym-drawer .sp-search.hidden{max-height:0;padding-top:0!important;padding-bottom:0!important;border-bottom-color:transparent!important}
.symbol-picker-search-wrap{height:42px;display:flex;align-items:center;gap:10px;padding:0 13px;background:#171f31;border:1px solid #2b3851;border-radius:11px}
.symbol-picker-search-wrap i{color:#7e8ca4;font-size:15px}
.sym-drawer .sp-search input,.sym-drawer input.sp-search{flex:1;min-width:0;width:100%;height:42px;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#eaecef;font-size:14px;outline:none}
.sym-drawer .sp-search input::placeholder,.sym-drawer input.sp-search::placeholder{color:#657188}
.sym-drawer .sp-list{flex:1!important;min-height:0!important;display:block!important;overflow-y:auto!important;overscroll-behavior:contain;padding:0 12px calc(14px + env(safe-area-inset-bottom))!important;background:#0b101c!important;scrollbar-width:none}
.sym-drawer .sp-list::-webkit-scrollbar{display:none}
.sym-drawer .sp-it{display:grid!important;grid-template-columns:42px minmax(0,1fr) minmax(72px,auto) 70px!important;align-items:center!important;gap:10px!important;min-height:64px!important;margin:0!important;padding:7px 0!important;border:0!important;border-bottom:1px solid #182133!important;border-radius:0!important;background:transparent;cursor:pointer;transition:background .15s,transform .15s}
.sym-drawer .sp-it:hover{background:#111929}
.sym-drawer .sp-it:active{transform:scale(.992);background:#151e30}
.sym-drawer .sp-it.sel{background:linear-gradient(90deg,rgba(55,114,255,.08),transparent 72%)!important}
.sym-drawer .sp-it .coin-icon-wrap{width:38px!important;height:38px!important;font-size:11px!important;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.symbol-picker-identity{min-width:0}
.symbol-picker-name{display:block;color:#edf1f8;font-size:14px;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.symbol-picker-fullname{display:block;margin-top:2px;color:#7f8ba1;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sym-drawer .symbol-picker-price{text-align:right;color:#e8edf6;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;font-weight:700;white-space:nowrap}
.symbol-picker-change{min-width:70px;padding:4px 6px;border-radius:5px;text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:700;white-space:nowrap}
.symbol-picker-change.up{color:#0ecb81;background:rgba(14,203,129,.11)}
.symbol-picker-change.down{color:#f6465d;background:rgba(246,69,93,.11)}
.symbol-picker-change.flat{color:#8995aa;background:#161e2d}
.symbol-picker-empty{padding:70px 16px;text-align:center;color:#76839a;font-size:14px}
body.symbol-picker-open{overflow:hidden!important}

/* Spot/futures use the same compact visual density as the mobile home market list. */
.sym-drawer.compact-market-picker .symbol-picker-header{
  height:calc(44px + env(safe-area-inset-top));
  grid-template-columns:32px minmax(0,1fr) 32px;
  gap:2px;
  padding:env(safe-area-inset-top) 12px 0;
}
.sym-drawer.compact-market-picker .symbol-picker-header h3{
  margin-left:2px;
  font-size:16px;
  letter-spacing:-.2px;
}
.sym-drawer.compact-market-picker .symbol-picker-back,
.sym-drawer.compact-market-picker .symbol-picker-search-button{
  width:32px;
  height:32px;
  border-radius:8px;
  font-size:17px;
}
.sym-drawer.compact-market-picker .sp-search{
  max-height:52px;
  padding:6px 12px!important;
}
.sym-drawer.compact-market-picker .sp-search.hidden{
  max-height:0;
  padding-top:0!important;
  padding-bottom:0!important;
}
.sym-drawer.compact-market-picker .symbol-picker-search-wrap,
.sym-drawer.compact-market-picker .sp-search input{
  height:38px;
}
.sym-drawer.compact-market-picker .symbol-picker-search-wrap{
  padding:0 11px;
  border-radius:9px;
}
.sym-drawer.compact-market-picker .sp-search input{
  font-size:13px;
}
.sym-drawer.compact-market-picker .sp-list{
  padding-left:12px!important;
  padding-right:12px!important;
}
.sym-drawer.compact-market-picker .sp-it{
  grid-template-columns:36px minmax(0,1fr) minmax(68px,auto) 64px!important;
  gap:9px!important;
  min-height:52px!important;
  padding:6px 2px!important;
}
.sym-drawer.compact-market-picker .sp-it .coin-icon-wrap{
  width:32px!important;
  height:32px!important;
  font-size:10px!important;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}
.sym-drawer.compact-market-picker .symbol-picker-name{
  font-size:13px;
}
.sym-drawer.compact-market-picker .symbol-picker-fullname{
  margin-top:1px;
  font-size:10px;
}
.sym-drawer.compact-market-picker .symbol-picker-price{
  font-size:13px;
}
.sym-drawer.compact-market-picker .symbol-picker-change{
  min-width:64px;
  padding:3px 5px;
  font-size:10px;
}
@media(max-width:380px){
  .sym-drawer .sp-list{padding-left:10px!important;padding-right:10px!important}
  .sym-drawer .sp-it{grid-template-columns:40px minmax(0,1fr) minmax(64px,auto) 64px!important;gap:7px!important}
  .symbol-picker-change{min-width:64px}
  .symbol-picker-name{font-size:13px}
  .sym-drawer .symbol-picker-price{font-size:13px}
  .sym-drawer.compact-market-picker .sp-it{grid-template-columns:34px minmax(0,1fr) minmax(60px,auto) 60px!important;gap:6px!important}
  .sym-drawer.compact-market-picker .sp-it .coin-icon-wrap{width:30px!important;height:30px!important}
  .sym-drawer.compact-market-picker .symbol-picker-change{min-width:60px}
  .sym-drawer.compact-market-picker .symbol-picker-name,.sym-drawer.compact-market-picker .symbol-picker-price{font-size:12px}
}
