/* Gutter responsivo para páginas com card centralizado.
   No mobile o recuo lateral era triplo: Box (spacing) + Container (padrão do
   Mantine, 16px) + card p="xl" (32px) = ~64px por lado, espremendo o conteúdo.
   Zeramos o padding lateral do Box e reduzimos o do card; os 16px do Container
   permanecem como respiro proposital (o card não encosta na borda).

   Uso: className="mobile-flush-page" no Box externo e "mobile-flush-card" no(s)
   Paper(s) da página. */

@media (max-width: 48em) {
    .mobile-flush-page {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .mobile-flush-card {
        padding: var(--mantine-spacing-md) !important;
    }
}
