/* ── Notificações no celular ──────────────────────────────────────────────────
   Densas para não atrapalhar quem está atendendo: menos respiro, letra e ícone menores e a largura da tela,
   então o aviso ocupa uma ou duas linhas em vez de um bloco. O MainLayout já as põe embaixo no celular (em cima
   cobriam o app bar) e limita a três na tela.
   Mesmo critério de toque do resto do app: largura sozinha deixaria o tablet de fora. */
@media (max-width: 599.98px), (hover: none) and (pointer: coarse) {
    #mud-snackbar-container {
        width: calc(100% - 16px);
        max-width: 480px;
    }

    #mud-snackbar-container.mud-snackbar-location-bottom-center {
        bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }

    /* A barra do Atender tem o botão de gravar: o aviso sobe acima dela em vez de cobri-lo. */
    body:has(.atender-barra) #mud-snackbar-container.mud-snackbar-location-bottom-center {
        bottom: calc(84px + env(safe-area-inset-bottom, 0px));
    }

    /* Barra de navegação inferior: o aviso sobe acima dela. */
    body:has(.barra-inferior) #mud-snackbar-container.mud-snackbar-location-bottom-center {
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }

    /* Diálogo em tela cheia: o rodapé é dos botões dele. O aviso sobe acima da ação em vez de cobri-la; quem empilha
       os botões declara a altura do rodapé em --rodape-do-dialogo. */
    body:has(.mud-dialog-fullscreen .mud-dialog-actions) #mud-snackbar-container.mud-snackbar-location-bottom-center {
        bottom: calc(var(--rodape-do-dialogo, 64px) + env(safe-area-inset-bottom, 0px));
    }

    .mud-snackbar {
        min-width: 0;
        max-width: none;
        margin-top: 6px;
        padding: 2px 10px;
        font-size: .8125rem;
        line-height: 1.3;
    }

    .mud-snackbar .mud-snackbar-content-message {
        padding: 5px 0;
    }

    .mud-snackbar .mud-snackbar-content-action {
        padding-inline-start: 6px;
    }

    .mud-snackbar-icon {
        padding: 4px 0;
        font-size: 18px;
        margin-inline-end: 8px;
    }

    /* Automação: o que mudou já aparece na própria ficha; no aviso fica só o andamento. */
    .automacao-snack {
        gap: 2px;
    }

    .automacao-snack__descricao {
        font-size: .75rem;
    }

    .automacao-snack__trilha {
        display: none;
    }
}