.custom-scroll::-webkit-scrollbar { width:4px; height:4px; }
.custom-scroll::-webkit-scrollbar-thumb { background:#374151; border-radius:4px; }

/* Risk Limit tier button group */
.btn_group { display:flex; border:1px solid #2a3347; border-radius:8px; overflow:hidden; }
.btn_group button {
    flex:0 0 auto; height:32px; padding:0 10px;
    background:#0d0f14; border:none; border-right:1px solid #2a3347;
    color:#6b7280; font-size:11px; cursor:pointer; white-space:nowrap;
}
.btn_group button:last-child { border-right:none; }
.btn_group button:hover { background:#1e2535; color:#d1d5db; }
.btn_group button.selected_current { background:#2a3347; color:#fff; font-weight:700; }
.btn_group button.selected_new { background:rgba(91,164,229,0.15); color:#5ba4e5; font-weight:700; }
#rl-tier-scroll::-webkit-scrollbar { display:none; }

/* Ticker bar coin select arrow */
#coin-select { appearance:none; -webkit-appearance:none; padding-right:16px; background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239ca3af' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 2px center; }

/* Order book ob-panel-book/trades flex */
#ob-panel-book { display:flex; flex-direction:column; }
#ob-panel-trades { display:none; flex-direction:column; }
#ob-panel-trades.flex { display:flex; }

/* Position panel empty state */
#pos-panel-body svg { opacity:0.4; }

/* Coin list popup slide-in animation */
#col-coins {
    animation: slideInLeft 0.18s ease-out;
}
@keyframes slideInLeft {
    from { transform: translateX(-100%); opacity: 0; }
    to   { transform: translateX(0);     opacity: 1; }
}

/* Chart height: trading area should not overflow */
#trading-area { overflow: hidden; }
#col-chart { min-height: 0; }
#chart-container { min-height: 0; }

/* Mobile responsive */
@media (max-width: 767px) {
    #col-orderbook, #col-order { display:none; }
    #pos-panel { height:300px !important; }
    #mob-tabs { display:flex !important; }
    #pos-panel { flex-shrink: 0; }
}

@media (max-width: 767px) {
    #col-coins {
        /* width: 240px !important; */
    }
}

/* ===== Mobile (< 1024px) specific fixes ===== */
@media (max-width: 1023px) {
    /* Timeframe bar: TF buttons and Candles/Depth toggle must not shrink */
    #div-19 { flex-shrink: 0; }
    #div-22 { flex-shrink: 0; }

    /* Ticker bar: hide less critical stats to reduce scroll distance */
    #div-13, #div-15 { display: none; }

    /* Ticker bar: prevent price/icon from shrinking */
    #div-3, #div-6, #div-7 { flex-shrink: 0; }

    /* ===== Split Trade Tab: compact 2-column orderbook ===== */
    /* Hide depth selector row and 3rd header column */
    #mob-split-row #div-31 { display: none; }
    #mob-split-row #div-33 { grid-template-columns: 1fr 1fr !important; }
    #mob-split-row #div-33 > span:last-child { display: none; }
    /* Override inline grid-template-columns on ob-rows */
    #mob-split-row .ob-row { grid-template-columns: 1fr 1fr !important; }
    /* Hide the 5th child (cumQ column) — children 1+2 are abs backgrounds, 3=price, 4=size, 5=cumQ */
    #mob-split-row .ob-row > div:nth-child(5) { display: none !important; }
    /* Smaller ob-tab buttons in split */
    #mob-split-row #div-30 button { font-size: 10px; height: 32px; }
    /* Make order form slightly compact in split */
    #mob-split-row #col-order .px-2\.5 { padding-left: 8px; padding-right: 8px; }
}