/* Android WebView (API 33+) and Samsung Internet only skip algorithmic
   inversion when the page both declares a dark color-scheme AND actually
   uses prefers-color-scheme. A lone color-scheme meta is not enough:
   gold "خرید / واریز" pills get inverted to dark-on-gold. */
:root,
html,
body {
    color-scheme: only dark;
}

@media (prefers-color-scheme: dark) {
    :root,
    html,
    body {
        color-scheme: only dark;
    }

    :root,
    [data-theme="dark"] {
        --gold: #ca9b5d;
        --gold-soft: #d4a916;
        --gold-a: #d3ac66;
        --gold-b: #c09249;
        --gold-txt: #20150a;
        --btn-drk-a: #41372b;
        --btn-drk-b: #372f25;
        --btn-drk-txt: #d0a661;
        --bg-top: #0b1320;
        --bg-bot: #070d17;
        --shell: #09111d;
        --card-top: #2a3448;
        --card-bot: #1c2432;
        --asset-card-top: #2a3448;
        --asset-card-bot: #1c2432;
        --card-fill: rgba(42, 52, 72, 0.92);
        --card-border: rgba(255, 255, 255, 0.06);
        --foot-bg: #131c2a;
        --nav-off: #7e8792;
        --label: #d6d6d6;
        --caption: #c9c9c9;
        --title: #f2f2f2;
        --panel: #131c2a;
        --box-title: #f2f2f2;
        --green: #66d98c;
        --red: #f27373;
    }

    html,
    body {
        background: #09111d !important;
        color: #f2f2f2;
    }

    .action-btn.gold,
    .tab.on {
        background: linear-gradient(180deg, #d3ac66, #c09249) !important;
        color: #20150a !important;
    }

    .action-btn.dark {
        background: linear-gradient(180deg, #41372b, #372f25) !important;
        color: #d0a661 !important;
    }
}

/* main.css keeps .bottom-nav at 64px with border-box and pads the home-indicator
   inset inside it, so in an iPhone home-screen app (inset 34px) the icons get ~17px.
   Grow the bar by the inset instead, and move what sits above it by the same amount. */
.bottom-nav {
    height: calc(64px + env(safe-area-inset-bottom, 0px));
}

.scroll-panel {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
}

.toast {
    bottom: calc(84px + env(safe-area-inset-bottom, 0px));
}