/* ── Mobile safe-area fix (issue #8) ────────────────────────────────────────
   Full-screen MudDialog uses position:fixed; top:0. With viewport-fit=cover
   (set in index.html) this extends under the device status bar / Dynamic
   Island on iOS and Android.

   MudBlazor 8.x renders the close button as .mud-button-close with
   position:absolute; top:8px — relative to the nearest positioned ancestor
   which is the fullscreen dialog (position:fixed; top:0). Adding padding-top
   to the title row does NOT move the button because it is taken out of flow.
   We must offset the button's own top value AND pad the title text separately.

   env(safe-area-inset-top) = the status-bar / Dynamic Island height.
   Falls back to 0px on desktop browsers that don't set it.
─────────────────────────────────────────────────────────────────────────── */

/* Push the title text below the status bar */
.mud-dialog-fullscreen .mud-dialog-title {
    padding-top: calc(env(safe-area-inset-top, 0px) + 16px) !important;
}

/* Push the absolutely-positioned close button below the status bar */
.mud-dialog-fullscreen .mud-button-close {
    top: calc(env(safe-area-inset-top, 0px) + 8px) !important;
}