/*
 * iPhone/iPad standalone web-app adjustments.
 * This file does not change the normal browser layout.
 */

/*
 * Do not set a background on html or body here.
 * The existing site.css and .cosmos layer control the website background.
 */
html,
body {
    min-height: 100%;
}

body {
    min-height: 100vh;
    min-height: 100dvh;
}

@media (display-mode: standalone) {
    body {
        min-height: 100vh;
        min-height: 100dvh;
    }

    .topbar {
        padding-top:
            calc(14px + env(safe-area-inset-top, 0px));
    }

    .footer {
        padding-bottom:
            max(18px, env(safe-area-inset-bottom, 0px));
    }

    .topbar__inner,
    .footer__inner,
    .wrap,
    .live-shell {
        padding-left:
            max(var(--pwa-safe-inline, 0px), env(safe-area-inset-left, 0px));
        padding-right:
            max(var(--pwa-safe-inline, 0px), env(safe-area-inset-right, 0px));
    }
}

/* Avoid text-selection callouts on app navigation while preserving form use. */
.is-standalone .topbar a,
.is-standalone .topbar button {
    -webkit-tap-highlight-color: transparent;
}