/* Data page pieces that render outside any component's scope: the dialog paper
   belongs to MudDialogProvider, so scoped CSS can't reach it. */

/* fullscreen on phones: six fields plus the soft keyboard don't fit a centered card */
@media (max-width: 599px) {
    .add-ingredient-dialog {
        width: 100vw;
        max-width: 100vw;
        height: 100dvh;
        max-height: 100dvh;
        margin: 0;
        border-radius: 0;
    }
}

.add-ingredient-dialog .add-ingredient-preview {
    margin-top: 16px;
    color: var(--mud-palette-text-secondary);
}