﻿/* Ensure the under-notch area is your blue background */
html, body {
    margin: 0;
    height: 100%;
}
/* Push all page content *below* the notch and home-indicator: */
body {
    /* iOS < 11.2 syntax: */
    padding-top: constant(safe-area-inset-top);
    /* iOS ≥ 11.2 syntax: */
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
}

#mobile-overflow-pwa-coverage {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* height = the notch/status‐bar inset on iOS */
    height: constant(safe-area-inset-top); /* legacy iOS syntax */
    height: env(safe-area-inset-top);
    background-color: #007cb2; /* your blue */
    z-index: 1005;
    pointer-events: none; /* don’t block taps */
}

.modal {
    top: constant(safe-area-inset-top) !important; /* legacy iOS syntax */
    top: env(safe-area-inset-top) !important;
}