#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

/* Tela de carregamento inicial (boot do WebAssembly) — usa a mesma paleta escura e
   logomarca do restante do app, para não haver nenhum flash de tela branca/genérica
   antes do Blazor terminar de baixar e iniciar. */
html, body {
    background-color: #171130;
}

.app-boot {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    background-color: #171130;
}

.app-boot-logo {
    width: 200px;
    max-width: 60vw;
    animation: app-boot-pulse 2.2s ease-in-out infinite;
}

@keyframes app-boot-pulse {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}

.loading-progress {
    position: relative;
    display: block;
    width: 4.5rem;
    height: 4.5rem;
    margin: 0;
}

    .loading-progress circle {
        fill: none;
        stroke: rgba(241, 239, 246, 0.12);
        stroke-width: 0.5rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: #9B8AFB;
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    position: static;
    text-align: center;
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.02em;
    color: #A79FCB;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Carregando");
    }

/* ============================================================================
   Design tokens — Glass Bento
   Valores centralizados dos "pesos" de vidro fosco reaproveitados por várias
   regras abaixo (glass-card, panel-glass, ramo-tile, appbar). Qualquer ajuste
   futuro de intensidade de blur/opacidade passa a ser feito aqui, num lugar só,
   em vez de garimpado por cada seletor. Só extrai os valores que já existiam —
   nenhum número mudou nesta refatoração.
   ============================================================================ */
:root {
    --glass-blur-strong: 20px;
    --glass-blur-medium: 16px;
    --glass-blur-soft: 12px;

    --glass-bg-card: rgba(255, 255, 255, .055);
    --glass-bg-panel: rgba(255, 255, 255, .045);
    --glass-bg-tile: rgba(255, 255, 255, .05);
    --glass-bg-hover: rgba(255, 255, 255, .08);

    --glass-border-card: rgba(255, 255, 255, .14);
    --glass-border-panel: rgba(255, 255, 255, .12);
    --glass-border-tile: rgba(255, 255, 255, .10);
    --glass-border-subtle: rgba(255, 255, 255, .08);

    --glass-radius-card: 20px;
    --glass-radius-tile: 16px;
}

.cursor-pointer {
    cursor: pointer;
}

/* Texto discreto de verdade — cor do token --mud-palette-text-secondary (o violeta-
   acinzentado do tema). NÃO confundir com Color="Color.Secondary" do MudBlazor: esse
   enum mapeia pra --mud-palette-secondary, o teal vívido de acento, não um cinza
   neutro. Usar Color.Secondary pra "texto discreto" foi um hábito herdado do tema
   anterior (quando Secondary era um violeta mais apagado) e ficou barulhento agora
   que Secondary é o teal usado pra sparkline/gradiente/chip positivo — dilui o que
   deveria ser um destaque. Use esta classe (sem setar Color) sempre que a intenção
   for "texto secundário/discreto", não "destaque em teal".
*/
.text-muted {
    color: var(--mud-palette-text-secondary) !important;
}

/* Fundo ambiente "Glass Bento": degradê radial violeta/teal fixo atrás de todo o app
   (mesma dupla de cores da logo do BrokerFlow), para que os painéis em vidro fosco do
   Dashboard (Home.razor.css) tenham contra o que "flutuar". Fica em html/body — o
   layout do MudBlazor (.mud-layout/.mud-main-content) é mantido transparente logo
   abaixo para não tampar o degradê com a cor sólida de --mud-palette-background. */
html, body {
    background-image:
        radial-gradient(1100px 650px at 14% -8%, rgba(123, 106, 209, .30), transparent 60%),
        radial-gradient(900px 560px at 100% 6%, rgba(58, 214, 194, .16), transparent 55%);
    background-attachment: fixed;
    background-repeat: no-repeat;
}

.mud-layout,
.mud-main-content,
.mud-drawer,
.mud-drawer-content {
    background-color: transparent !important;
}

/* AppBar em vidro fosco, para casar com o degradê de fundo em vez do bloco sólido
   que MudAppBar usaria por padrão (cor antes vinha fixa em MainLayout.razor). */
.glass-appbar {
    background-color: rgba(27, 23, 48, .55) !important;
    backdrop-filter: blur(var(--glass-blur-medium));
    -webkit-backdrop-filter: blur(var(--glass-blur-medium));
    border-bottom: 1px solid var(--glass-border-subtle);
}

/* ============================================================================
   Glass Bento — vocabulário visual compartilhado (Home, Painel Financeiro,
   Painel de Cotações e os componentes reutilizáveis em Components/Dashboard/).
   Global (não escopado a um único .razor) porque componentes MudBlazor reusáveis
   em páginas diferentes precisam da mesma classe "glass-card" disponível em
   qualquer lugar — CSS isolation por componente já cobre o que é específico de
   cada um (ex.: TrendStatCard.razor.css, GoalRing.razor.css).
   ============================================================================ */
.glass-card {
    background: var(--glass-bg-card);
    backdrop-filter: blur(var(--glass-blur-strong));
    -webkit-backdrop-filter: blur(var(--glass-blur-strong));
    border: 1px solid var(--glass-border-card) !important;
    border-radius: var(--glass-radius-card) !important;
}

/* MudPaper aplica sua própria sombra; zera aqui pro vidro não ganhar uma segunda
   camada de fundo opaco por baixo do blur. */
.glass-card.mud-paper {
    box-shadow: none;
}

.glass-hero {
    background: linear-gradient(135deg, rgba(155, 138, 251, .20), rgba(58, 214, 194, .10)) !important;
}

.hero-label {
    font-size: .8125rem;
    color: var(--mud-palette-text-secondary);
    margin-bottom: 6px;
}

.hero-value {
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}

/* TrendStatCard com Selected="true" (cards de KPI que dobram de filtro clicável, ex.
   Insureds/List.razor) — contorno na cor do card em vez do preenchimento sólido que
   esse padrão usava antes; mantém o vidro fosco visível por baixo. */
.trend-selected {
    border-width: 2px !important;
}

.trend-ring-primary { border-color: var(--mud-palette-primary) !important; }
.trend-ring-secondary { border-color: var(--mud-palette-secondary) !important; }
.trend-ring-tertiary { border-color: var(--mud-palette-tertiary) !important; }
.trend-ring-success { border-color: var(--mud-palette-success) !important; }
.trend-ring-warning { border-color: var(--mud-palette-warning) !important; }
.trend-ring-error { border-color: var(--mud-palette-error) !important; }
.trend-ring-info { border-color: var(--mud-palette-info) !important; }

/* Grid bento do topo da Home: Prêmio Líquido, Comissões e Renovações efetivadas
   (os 3 indicadores com comparação de período real) + Tarefas, Prospecções e
   Aniversariantes (contadores do período de renovação selecionado mais abaixo),
   todos no mesmo tamanho de tile. Global (não em Home.razor.css/::deep) pelo
   mesmo motivo do .kpi-grid logo abaixo: regra CSS-isolada com ::deep não estava
   pegando no elemento, os cards caíam pro comportamento padrão de <div> (bloco,
   empilhado em 100% de largura) em vez do grid. */
.hero-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
}

@media (max-width: 960px) {
    .hero-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 600px) {
    .hero-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Grade de tiles de indicador — 4 colunas (2 em telas estreitas). Usado pela Home,
   Painel Financeiro e qualquer tela nova que precise de uma fileira de TrendStatCard. */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

@media (max-width: 960px) {
    .kpi-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Linha de filtro de período (botões + MudDateRangePicker) — o picker reserva 16px de
   margin-top pro label flutuante (regra própria do MudBlazor, .mud-input-text-with-label),
   o que empurra o texto/ícone dele ~8px abaixo do centro da própria caixa. Como o
   align-center da linha só centraliza a caixa inteira do picker (não o conteúdo visível
   dela), o texto ficava visualmente mais baixo que o rótulo dos botões ao lado. */
.period-filter-row .mud-input-control {
    margin-top: -8px;
}

/* Tiles de indicador da Home (hero-grid + kpi-grid) — reduzidos pra bater com o
   tamanho compacto dos side-tile (Tarefas/Prospecções/Aniversariantes): mesma
   ordem de padding/gap e fontes equivalentes ao h5/caption padrão do MudBlazor. */
.home-stats .ramo-tile {
    padding: 10px 8px;
    gap: 2px;
}

.home-stats .ramo-tile .mud-icon-root {
    font-size: 1.25rem;
    margin-bottom: 0;
}

.home-stats .ramo-tile .mud-typography-h4 {
    font-size: 1.5rem !important;
}

.home-stats .ramo-tile .mud-typography-h6 {
    font-size: 1.5rem !important;
}

.home-stats .ramo-tile .mud-typography-caption {
    font-size: .75rem !important;
}

.kpi-tile {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.kpi-tile .kpi-value {
    font-variant-numeric: tabular-nums;
}

/* Tiles de ramo (Renovações) e afins — cartões menores e mais soltos que o
   glass-card principal, para não competir visualmente com os painéis maiores. */
.ramo-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 4px;
    padding: 16px 8px;
    border-radius: var(--glass-radius-tile);
    background: var(--glass-bg-tile);
    border: 1px solid var(--glass-border-tile);
    height: 100%;
    box-sizing: border-box;
}

.ramo-tile .mud-icon-root {
    margin-bottom: 2px;
}

/* Tiles clicáveis (Tarefas / Prospecções / Aniversariantes e afins) — mesmo vidro
   fosco dos painéis principais, só que compactos. Opacidade um pouco acima de
   --glass-bg-hover (.08) de propósito: tile menor precisa de um pouco mais de
   contraste no hover pra não passar despercebido. */
.side-tile:hover {
    background: rgba(255, 255, 255, .09) !important;
}

/* RenewalHeatmap (Components/Dashboard) — global em vez de escopado no .razor.css do
   componente: uma versão anterior escopada com ::deep não estava batendo de forma
   confiável nesta base (ver .hero-grid acima), então esse componente também migrou
   pra cá por segurança. max-width trava o tamanho das células pra não ficarem
   gigantes/desproporcionais quando o card é mais largo que 7 quadradinhos de ~44px. */
.heatmap-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
    font-size: .625rem;
    color: var(--mud-palette-text-secondary);
    text-align: center;
    margin-bottom: 6px;
    max-width: 320px;
}

.heatmap-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
    max-width: 320px;
}

.heatmap-cell {
    aspect-ratio: 1;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .625rem;
    font-variant-numeric: tabular-nums;
    color: var(--mud-palette-text-secondary);
}

.heatmap-cell-today {
    outline: 2px solid var(--mud-palette-secondary);
    color: var(--mud-palette-text-primary);
}

.heatmap-legend {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    font-size: .6875rem;
    color: var(--mud-palette-text-secondary);
}

.heatmap-swatch {
    width: 13px;
    height: 13px;
    border-radius: 4px;
}

/* Painéis de conteúdo padrão do resto do sistema (MudPaper Elevation="1" Class="pa-4
   rounded-lg", usado em ~130 telas de cadastro/listagem/financeiro): mesma família
   visual do Glass Bento, só mais opaca e com menos blur — telas densas de formulário
   precisam de mais contraste que os cards de indicador da Home. */
.mud-paper.mud-elevation-1.panel-glass,
.mud-paper.mud-elevation-2.panel-glass {
    background: var(--glass-bg-panel);
    backdrop-filter: blur(var(--glass-blur-soft));
    -webkit-backdrop-filter: blur(var(--glass-blur-soft));
    border: 1px solid var(--glass-border-panel);
    box-shadow: none;
}

/* Campos preenchidos (Variant.Filled): caixa 100% arredondada, sem sublinhado,
   com leve tingimento na cor primária em vez do cinza neutro padrão do Material.
   Usa a variável --mud-palette-primary-rgb (gerada pelo MudBlazor a partir do
   Primary do tema) em vez de um rgb fixo, para acompanhar automaticamente
   qualquer troca futura da cor primária. */
.mud-input.mud-input-filled {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.06);
    border-radius: 10px;
}

.mud-input.mud-input-filled:hover {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.1);
}

.mud-input.mud-input-filled.mud-focused {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.08);
}

.mud-input.mud-input-filled.mud-disabled {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.04);
}

.mud-input.mud-input-filled.mud-input-underline:before,
.mud-input.mud-input-filled.mud-input-underline:after {
    border-bottom: none;
}

/* Busca rápida da AppBar (Components/QuickSearch.razor) — campo + dropdown de resultados
   posicionado por baixo, sobre o vidro fosco da AppBar. */
.quick-search {
    position: relative;
    width: 560px;
}

.quick-search-input .mud-input-slot {
    margin-top: 0;
}

.quick-search-input .mud-input-slot.mud-input-root-filled.mud-input-root-margin-dense {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.quick-search-input .mud-input-adornment-start.mud-input-root-filled-shrink {
    margin-top: 0 !important;
}

.quick-search-results {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    width: 100%;
    max-height: 420px;
    overflow-y: auto;
    z-index: 1300;
    padding-bottom: 6px;
}

/* Sobrescreve o vidro fosco translúcido de .glass-card: a lista de resultados fica sobre
   os cards do Dashboard, que "vazavam" por trás do blur e atrapalhavam a leitura. Fundo
   sólido (cor --mud-palette-surface do tema) em vez de backdrop-filter. */
.quick-search-results.glass-card {
    background: var(--mud-palette-surface);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(255, 255, 255, .14);
}

.quick-search-item:hover {
    background: rgba(255, 255, 255, .07);
}

/* Botões preenchidos/outlined totalmente arredondados (pill), no lugar do
   cantos levemente arredondados padrão do Material. MudIconButton fica de fora
   (classe .mud-icon-button é distinta), então ícones isolados continuam como estão. */
.mud-button-filled,
.mud-button-outlined {
    border-radius: 999px;
}

/* Chips sempre em formato pill, reforçando os estados semânticos (Ativa/Pausada/
   Agendada etc.) usados nas listagens. */
.mud-chip {
    border-radius: 999px !important;
}

/* Cabeçalho de tabela/grid com leve tingimento na cor primária (em vez de cinza
   neutro) e linha em hover também tingida — aplica-se a toda MudTable/MudDataGrid
   do sistema a partir deste único arquivo. */
.mud-table-head .mud-table-cell {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.04);
}

.mud-table-row:hover .mud-table-cell {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.05);
}

/* Reforça o espaçamento vertical das linhas em todo MudDataGrid com Dense="true" (usado em
   todas as listagens do sistema) — o padding 6px do próprio modo "dense" do MudBlazor ainda
   deixava a tabela com bastante respiro entre linhas; aqui fica mais compacto. Mantém o
   padding horizontal (16px/24px) como está, só a altura da linha muda.
   !important necessário: o MudBlazor define esse padding via seletores responsivos mais
   específicos (ex.: .mud-xs-table.mud-table-dense .mud-table-cell, com 2 classes no
   ancestral), que vencem por especificidade mesmo carregando depois no arquivo. */
.mud-table-dense .mud-table-cell {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
}

/* HeaderStyle="text-align:center" (usado nas colunas "Ações"/Status de todas as listagens em
   MudDataGrid) só centraliza o <th> em si — o título fica dentro de um wrapper interno do
   MudBlazor (.column-header, com justify-content:space-between; ou .mud-table-sort-label nas
   colunas ordenáveis, com justify-content:flex-start) que ignora esse text-align. Reforça a
   centralização nesse wrapper só para as colunas que já pediram texto centralizado. */
th[style*="text-align:center"] .column-header,
th[style*="text-align:center"] .mud-table-sort-label {
    /* !important necessário: o MudBlazor aplica justify-content nesses wrappers via seletor
       mais específico (.mud-data-grid .mud-table-cell .column-header), que vence mesmo com
       [style] + classe no seletor acima. */
    justify-content: center !important;
}

/* MudTabs com Color="Color.Primary" (ex.: toggles Ramos/Seguradoras e Ramos/Produtores
   do Dashboard): por padrão o MudBlazor pinta a barra INTEIRA de roxo sólido com texto
   branco nas duas abas (classe .mud-tabs-tabbar-primary), o que passa a impressão de um
   único botão em vez de um seletor. Aqui viramos isso num segmented control: track neutro
   tingido de primária, e só a aba ativa ganha o pill sólido. */
.mud-tabs-tabbar-primary {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.08);
    color: var(--mud-palette-text-secondary);
    padding: 10px 4px 4px;
    gap: 4px;
}

.mud-tabs-tabbar-primary .mud-tab {
    border-radius: 999px;
    min-height: 34px;
    color: inherit;
}

.mud-tabs-tabbar-primary .mud-tab.mud-tab-active {
    background-color: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
}

.mud-tabs-tabbar-primary .mud-tab-slider {
    display: none;
}

/* Grid "Carteira" da Home (Mix de Carteira / Produção por Ramo): espaço extra entre a
   barra de abas principal (Visão Geral/Renovações/Carteira) e os cards do painel. O
   MudGrid usa margin-top negativo no container pra cancelar o padding-top que os
   MudGrid-item recebem (gap entre linhas do grid) — aqui aumentamos só o padding-top
   dos itens desta grid específica (via a classe "carteira-grid", não a classe padrão
   ".mud-grid-spacing-xs-6" sozinha, que é usada por praticamente todo MudGrid sem
   Spacing explícito no resto do app), então a diferença sobra como respiro visível
   acima da primeira linha, sem afetar nenhum outro grid do sistema. */
.carteira-grid.mud-grid-spacing-xs-6 > .mud-grid-item {
    padding-top: 45px;
}

/* MudDatePicker/MudDateRangePicker (ex.: "Escolher período" no Dashboard): quando o
   campo âncora é estreito, o popover às vezes herda uma largura menor que os 310px
   que a grade do calendário (dom.-sáb., 7 colunas) precisa, cortando os últimos dias
   da semana e forçando scroll horizontal dentro do próprio popover. Garante que o
   popover do picker nunca fique mais estreito que o calendário que ele contém. */
.mud-picker-popover-paper {
    min-width: 340px !important;
}

/* Cabeçalho do calendário (MudDatePicker/MudDateRangePicker): o texto com a data/
   intervalo selecionado ("qua., 01 jul. - sex., 31 jul.") usa por padrão fonte de
   34px, grande demais para o popover de 340px — quebra em duas linhas. Reduz para
   caber em uma linha só, em qualquer tela que use esses pickers. */
.mud-picker-toolbar .mud-button-date {
    font-size: 1rem !important;
    white-space: nowrap;
}