[data-pwa-install][hidden],
[data-pwa-installed][hidden],
[data-pwa-offline][hidden] {
    display: none !important;
}

/* Bootstrap's d-flex on the side-menu link is !important, so hiding it must be too. */
.fiatbear-standalone [data-pwa-install-link] {
    display: none !important;
}

@media (display-mode: standalone) {
    [data-pwa-install-link] {
        display: none !important;
    }
}

/* Promote installation on phones and tablets only. A tablet with a trackpad still counts once pwa.js detects iOS/Android. */
@media (hover: hover) and (pointer: fine) {
    :root:not(.fiatbear-ios):not(.fiatbear-android) [data-pwa-install-link] {
        display: none !important;
    }
}

body:not(.wagmi) .offcanvas.offcanvas-start {
    padding-top: env(safe-area-inset-top, 0px);
    padding-right: env(safe-area-inset-right, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left: env(safe-area-inset-left, 0px);
}

body:not(.wagmi) .mobile-header-wrapper {
    padding-top: calc(.5rem + env(safe-area-inset-top, 0px)) !important;
    padding-left: calc(1rem + env(safe-area-inset-left, 0px)) !important;
    padding-right: calc(1rem + env(safe-area-inset-right, 0px)) !important;
}

body:not(.wagmi) .app-page-content,
body:not(.wagmi) .dashboard-topbar,
body:not(.wagmi) .app-page-footer {
    padding-left: max(28px, env(safe-area-inset-left, 0px));
    padding-right: max(28px, env(safe-area-inset-right, 0px));
}

body:not(.wagmi) .app-page-footer,
body:not(.wagmi) .form-footer {
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}

body:not(.wagmi) > section > .container-fluid {
    padding-top: env(safe-area-inset-top, 0px);
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
}

@media (max-width: 991.98px) {
    .fiatbear-standalone body:not(.wagmi) {
        min-height: 100vh;
        min-height: 100dvh;
        display: flex;
        flex-direction: column;
    }

    .fiatbear-standalone body:not(.wagmi) > section {
        flex: 1;
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    .fiatbear-standalone .app-shell {
        min-height: 0;
        flex: 1;
    }
}

/* Size installed windows before the deferred client runs; retain the class-based legacy fallback. */
@media (max-width: 991.98px) and (display-mode: standalone) {
    body:not(.wagmi) {
        min-height: 100vh;
        min-height: 100dvh;
        display: flex;
        flex-direction: column;
    }

    body:not(.wagmi) > section {
        flex: 1;
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    body:not(.wagmi) .app-shell {
        min-height: 0;
        flex: 1;
    }

    body:not(.wagmi) .mobile-header-wrapper button,
    body:not(.wagmi) .side-tab-link {
        min-height: 44px;
    }

    body:not(.wagmi) .mobile-header-wrapper button {
        min-width: 44px;
    }
}

.pwa-guide {
    max-width: 64rem;
    overflow-wrap: anywhere;
}

.pwa-guide h2 {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

.pwa-guide-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

.pwa-guide li {
    margin-bottom: .75rem;
}

.fiatbear-ios .pwa-guide [data-pwa-platform="android"],
.fiatbear-android .pwa-guide [data-pwa-platform="ios"] {
    display: none;
}

.fiatbear-ios .pwa-guide-grid,
.fiatbear-android .pwa-guide-grid {
    grid-template-columns: minmax(0, 1fr);
}

.pwa-steps {
    list-style: none;
    padding-left: 0;
    counter-reset: pwa-step;
}

.pwa-steps li {
    display: flex;
    align-items: baseline;
    gap: .75rem;
    counter-increment: pwa-step;
}

.pwa-steps li::before {
    content: counter(pwa-step) ".";
    flex: 0 0 1.25rem;
}

.pwa-steps i {
    flex: 0 0 1.25rem;
    color: #f0b429;
    text-align: center;
}

.pwa-guide-note {
    font-size: .9rem;
    opacity: .8;
}

.pwa-guide .btn,
.fiatbear-standalone .mobile-header-wrapper button,
.fiatbear-standalone .side-tab-link {
    min-height: 44px;
}

.fiatbear-standalone .mobile-header-wrapper button {
    min-width: 44px;
}

.pwa-connection-notice {
    position: sticky;
    top: env(safe-area-inset-top, 0px);
    z-index: 1020;
    padding: 10px 20px;
    color: #f0b429;
    background: #0d1117;
    border-bottom: 1px solid #f0b429;
    font-size: .9rem;
}

@media (max-width: 639px) {
    .pwa-guide-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}