/* ══════════════════════════════════════════════════════════
   Binance Theme Override — finser.io
   Load AFTER all other stylesheets.
   Only visual overrides — no layout, no logic changes.
   ══════════════════════════════════════════════════════════ */

/* ── Global font — IBM Plex Sans (matches Binance typography) */
body,
body * {
    font-family: "IBM Plex Sans", sans-serif !important;
}

/* ── Page background ─────────────────────────────────────── */
.crypt-dark.bg-grayscale { background: #0B0E11 !important; }

/* ── Global button radius (Binance: 4px square feel) ────── */
.btn                    { border-radius: 4px !important; }
.btn-editor             { border-radius: 4px !important; }
.btn-editor-sm          { border-radius: 4px !important; }
.input-group-text       { border-radius: 4px !important; }
.form-control           { border-radius: 4px !important; }
.search-input           { border-radius: 4px !important; }
.offcanvas              { border-radius: 0 !important; }

/* ── Pagination active → Binance yellow ─────────────────── */
.page-link.active,
.active > .page-link {
    background-color: #F0B90B !important;
    border-color:     #C99A00 !important;
    color:            #0B0E11 !important;
    font-weight: 700;
}
.page-link {
    background-color: #1E2026;
    border-color: rgba(255,255,255,0.08);
}
.page-link.disabled,
.disabled > .page-link {
    background-color: #1E2026;
    border-color: rgba(255,255,255,0.06);
}

/* ── Market page — filter/pagination active ─────────────── */
.mkt-filter-btn.active {
    background:   #F0B90B !important;
    border-color: #F0B90B !important;
    color:        #0B0E11 !important;
}
.mkt-page-btn.active {
    background:   #F0B90B !important;
    border-color: #F0B90B !important;
    color:        #0B0E11 !important;
}
.mkt-rows-opt.active         { color: #F0B90B !important; }
.mkt-table thead th.mkt-sorted .mkt-sort-icon { color: #F0B90B !important; }

/* Market spinner */
.mkt-spinner { border-top-color: #F0B90B !important; }

/* Market loading overlay */
.mkt-loading { background: rgba(11,14,17,0.82) !important; }

/* Global form focus ring → yellow (overrides Bootstrap blue on all pages) */
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: rgba(240,185,11,0.5) !important;
    box-shadow:   0 0 0 2px rgba(240,185,11,0.12) !important;
    outline: none !important;
}

/* Market search focus ring → yellow */
.mkt-search-input:focus {
    border-color: rgba(240,185,11,0.45) !important;
    box-shadow:   0 0 0 2px rgba(240,185,11,0.12) !important;
}

/* ── Coin-detail — accent blue → yellow ─────────────────── */
.cd-period-btn.active {
    background: rgba(240,185,11,0.16) !important;
    color: #F0B90B !important;
}
.cd-type-btn.active {
    background: rgba(240,185,11,0.16) !important;
    color: #F0B90B !important;
}
.cd-hdr-link:hover {
    background:    rgba(240,185,11,0.08) !important;
    border-color:  rgba(240,185,11,0.30) !important;
    color: #F0B90B !important;
}
.cd-cat-tag {
    color:       #F0B90B !important;
    background:  rgba(240,185,11,0.10) !important;
    border-color: rgba(240,185,11,0.20) !important;
}
.cd-hl-fill   { background: #F0B90B !important; }
.cd-supply-fill { background: linear-gradient(90deg, #C99A00, #F0B90B) !important; }
.cd-sb-supply-pct {
    color:       #F0B90B !important;
    background:  rgba(240,185,11,0.12) !important;
}
.cd-sb-mkt-link:hover { color: #F0B90B !important; }
.cd-mkt-link:hover    { color: #F0B90B !important; }
.cd-breadcrumb-item:hover { color: #F0B90B !important; }
.cd-expand-btn:hover {
    border-color: rgba(240,185,11,0.40) !important;
    color: #F0B90B !important;
}

/* ── Light-mode coin-detail accents ─────────────────────── */
body.crypt-light .cd-period-btn.active { color: #C99A00 !important; background: rgba(240,185,11,0.12) !important; }
body.crypt-light .cd-type-btn.active   { color: #C99A00 !important; background: rgba(240,185,11,0.12) !important; }
body.crypt-light .cd-hdr-link:hover    { color: #C99A00 !important; border-color: rgba(200,153,0,0.30) !important; }
body.crypt-light .cd-expand-btn:hover  { color: #C99A00 !important; border-color: rgba(200,153,0,0.40) !important; }