#toast-wrapper {
    width: 100%;
    text-align: center;
    padding: 12px 0px;
    bottom: 0;
    position: fixed;
    z-index: 1;
}

@supports(padding: max(0px)) {
    #toast-wrapper {
        padding-top: max(10px, env(safe-area-inset-top));
        padding-bottom: max(10px, env(safe-area-inset-bottom));
        padding-left: max(10px, env(safe-area-inset-left));
        padding-right: max(10px, env(safe-area-inset-right));
    }
}