/* ============================================================
   Dashboard: checklist de primeiros passos e números (#592)
   ============================================================ */

.grade-metricas {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1rem;
    margin: 1rem 0 1.5rem;
}

/* Galeria de avatares do vídeo com influenciador (#499) */
.galeria-grade { display: flex; flex-wrap: wrap; gap: 12px; }
.avatar-da-galeria { margin: 0; padding: 8px; display: flex; flex-direction: column; align-items: center; gap: 4px;
    border: 1px solid var(--mud-palette-lines-default); border-radius: 8px; }
.avatar-da-galeria.selecionado { border-color: var(--mud-palette-primary); box-shadow: 0 0 0 2px var(--mud-palette-primary); }
.avatar-da-galeria img { object-fit: cover; border-radius: 50%; }

/* Editor do influenciador (#499) */
.modos-do-influenciador, .prompts-padrao, .cenarios-sugeridos { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.rotulos-na-tela { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin: 12px 0; }
.resumo-da-oferta { margin: 8px 0; padding-left: 18px; }

/* Biblioteca de referências virais (#498) */
.linha-de-cadastro { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; flex-wrap: wrap; }
.campo-url-referencia { flex: 1 1 320px; }
.miniatura-referencia { object-fit: cover; border-radius: 6px; background: var(--mud-palette-background-gray, #eee); }
.mensagem-da-referencia { display: block; margin-top: 4px; }
.metricas-referencia { white-space: nowrap; }
.detalhe-do-formato { padding: 8px 4px; }
.blocos-do-formato { margin: 4px 0 8px 20px; }

/* ============================================================
   Painel de receita do /dashboard (#505)
   ============================================================ */

.receita-filtros {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    margin: .5rem 0 1rem;
}

.receita-filtros label { display: flex; flex-direction: column; gap: .25rem; font-size: .85rem; }

.receita-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1rem;
    margin: 0 0 1.5rem;
}

.receita-seletor { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0 1rem; }

.receita-seletor .botao-ds[aria-pressed="true"] {
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
}

.receita-grade-graficos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.receita-drilldown {
    margin: 1rem 0 1.5rem;
    padding: 1rem;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
}

.receita-drilldown-topo { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }

.receita-insights ul { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: .5rem; }

.receita-insight {
    display: flex;
    gap: .5rem;
    align-items: flex-start;
    padding: .5rem .75rem;
    border-radius: 6px;
    border-left: 4px solid var(--mud-palette-info);
    background: var(--mud-palette-background-gray, rgba(127, 127, 127, .08));
}

.receita-insight--alerta { border-left-color: var(--mud-palette-error); }
.receita-insight--destaque { border-left-color: var(--mud-palette-success); }

.receita-funil-etapas { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: .5rem; }

.receita-funil-etapa {
    position: relative;
    display: flex;
    gap: .75rem;
    align-items: baseline;
    padding: .5rem .75rem;
    z-index: 0;
}

.receita-funil-barra {
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--largura);
    z-index: -1;
    border-radius: 6px;
    background: var(--mud-palette-primary);
    opacity: .18;
}

.receita-funil-nome { min-width: 5rem; }

.mapa-calor-tabela { border-collapse: separate; border-spacing: 2px; width: 100%; font-size: .75rem; }
.mapa-calor-tabela th { font-weight: 500; text-align: left; white-space: nowrap; }
.mapa-calor-hora { text-align: center; }

.mapa-calor-celula {
    height: 1.6rem;
    border-radius: 3px;
    background: color-mix(in srgb, var(--mud-palette-primary) calc(var(--intensidade) * 100%), transparent);
    outline: 1px solid var(--mud-palette-lines-default);
    outline-offset: -1px;
}

.mapa-calor-oculto {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}