/*
  RDOOne — Larguras de coluna do Planejamento da Obra (ETAPA 29)

  Escopo estritamente local à tabela "Planejamento da obra" (.tarefas-grade, mesma classe/arquivo
  companheiro de tarefas-escala.css) — nunca aplicado globalmente.

  table-layout:fixed é o que torna a largura de cada coluna independente do conteúdo das linhas
  (causa raiz do bug original: "34003,2" + espaço + "h" quebrando em duas linhas porque
  table-layout:auto deixava o navegador decidir a largura pelo conteúdo). Sem <colgroup> — o
  MudTable não expõe nenhum slot para inserir um antes do <thead>, e injetar via JS depois da
  renderização entraria em conflito com o diffing do Blazor. Em vez disso, a largura é definida na
  PRÓPRIA célula de cabeçalho (MudTh) — sob table-layout:fixed, a largura da primeira linha da
  tabela já é suficiente para fixar a coluna inteira; as classes abaixo são repetidas nas células do
  corpo (MudTd) só como reforço redundante, sem depender de qual linha o navegador realmente lê.

  Larguras fixas (EAP/Ações): valor literal, nunca variável — não são redimensionáveis (conteúdo
  sempre previsível: código EAP compacto, coluna de ações com número fixo de ícones).

  Larguras redimensionáveis (Nome/Recursos/Predecessoras/Início/Duração/Término/Trabalho/Custos):
  uma variável CSS por coluna, setada inline no Style da própria MudTable em TarefasSecao.razor
  (mesmo padrão já usado por --tarefa-font-scale na ETAPA 28) — nunca duplicada em CSS por
  nível/valor. O JS de arrasto (TarefasSecao.razor.js) escreve nessas variáveis direto no DOM durante
  o pointermove; os controles +/- do cabeçalho (ETAPA 30) alteram a mesma variável via C#
  (AplicarLarguraAsync). Início/Duração/Término entraram no grupo redimensionável só na 2ª rodada da
  ETAPA 30 — antes eram fixas, mesmo padrão das outras 5 daí em diante.
*/

.tarefas-grade,
.tarefas-grade table {
    table-layout: fixed;
}

/* --- Colunas fixas --- */
/* ETAPA 30: 60px. Códigos de EAP são sempre compactos (1, 1.1, 1.10, 1.10.2) — 60px cabe
   confortavelmente sem cortar; a largura liberada foi redistribuída para "Nome da tarefa". */
.tarefas-grade th.tarefas-col-eap,
.tarefas-grade td.tarefas-col-eap {
    width: 60px;
}

.tarefas-grade th.tarefas-col-acoes,
.tarefas-grade td.tarefas-col-acoes {
    width: 260px;
    white-space: nowrap;
}

/* --- Colunas redimensionáveis --- */
/* Os valores depois da vírgula em var(...) são só o fallback para antes da primeira renderização
   (quando a MudTable ainda não escreveu --tarefa-col-*-width inline) — a fonte real dos padrões é
   LargurasPadrao em TarefasSecao.razor; os dois têm que continuar batendo. Valores da ETAPA 30. */
.tarefas-grade th.tarefas-col-nome,
.tarefas-grade td.tarefas-col-nome {
    width: var(--tarefa-col-nome-width, 300px);
}

.tarefas-grade th.tarefas-col-recursos,
.tarefas-grade td.tarefas-col-recursos {
    width: var(--tarefa-col-recursos-width, 160px);
}

.tarefas-grade th.tarefas-col-predecessoras,
.tarefas-grade td.tarefas-col-predecessoras {
    width: var(--tarefa-col-predecessoras-width, 160px);
}

.tarefas-grade th.tarefas-col-inicio,
.tarefas-grade td.tarefas-col-inicio {
    width: var(--tarefa-col-inicio-width, 110px);
}

.tarefas-grade th.tarefas-col-duracao,
.tarefas-grade td.tarefas-col-duracao {
    width: var(--tarefa-col-duracao-width, 90px);
}

.tarefas-grade th.tarefas-col-termino,
.tarefas-grade td.tarefas-col-termino {
    width: var(--tarefa-col-termino-width, 100px);
}

.tarefas-grade th.tarefas-col-trabalho,
.tarefas-grade td.tarefas-col-trabalho {
    width: var(--tarefa-col-trabalho-width, 100px);
}

.tarefas-grade th.tarefas-col-custos,
.tarefas-grade td.tarefas-col-custos {
    width: var(--tarefa-col-custos-width, 130px);
}

.tarefas-grade th.tarefas-col-quantidade,
.tarefas-grade td.tarefas-col-quantidade {
    width: var(--tarefa-col-quantidade-width, 110px);
}

.tarefas-grade td.tarefas-col-quantidade {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tarefas-grade th.tarefas-col-realizado,
.tarefas-grade td.tarefas-col-realizado {
    width: var(--tarefa-col-realizado-width, 120px);
}

/* Trabalho/Custos nunca quebram linha — a combinação de largura mínima + nowrap é o que
   efetivamente resolve o bug original (só a largura mínima, sem nowrap, ainda permitiria a
   quebra). overflow/ellipsis é um limite de segurança, não o caminho esperado (as larguras
   mínimas já foram calculadas para caber o pior caso realista sem cortar). */
.tarefas-grade td.tarefas-col-trabalho,
.tarefas-grade td.tarefas-col-custos,
.tarefas-grade td.tarefas-col-realizado {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Barra de avanço da coluna Realizado.

   Posicionada em absoluto no rodapé da própria célula, não empilhada abaixo do número: assim ela não
   acrescenta altura nenhuma à linha, e as linhas sem barra (resumo, sem apontamento, medida por
   quantidade) continuam exatamente da mesma altura das outras. O overflow:hidden que a regra acima já
   aplica à célula é o que impede a barra de vazar para a coluna vizinha.

   Azul enquanto anda, verde ao completar: são as duas cores que o app já usa para "em andamento" e
   "concluído", e a virada de cor é o que faz a linha pronta saltar aos olhos numa lista de centenas.
   O número ao lado continua sendo o valor exato — a barra é leitura de relance, não a medida. */
.tarefas-grade td.tarefas-col-realizado {
    position: relative;
}

.tarefas-barra-realizado {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    background-color: var(--mud-palette-info, #3b82f6);
    border-radius: 0 2px 2px 0;
    pointer-events: none;
}

.tarefas-barra-realizado-completa {
    background-color: var(--mud-palette-primary, #16a34a);
}

/* Predecessoras: o editor inline (ver TarefasSecao.razor, min-width:360px no formulário de
   adicionar/editar vínculo) precisa poder ultrapassar visualmente a largura fixa da coluna
   enquanto está aberto — sob table-layout:fixed, uma célula recorta o próprio conteúdo por
   padrão. Só a célula em edição ganha overflow visível; as demais linhas continuam recortando
   normalmente (nunca aplicado à coluna inteira, só à linha ativa). */
.tarefas-grade td.tarefas-col-predecessoras.editando-predecessoras {
    overflow: visible;
    position: relative;
}

/* CORREÇÃO — overflow:visible sozinho só permite o conteúdo aparecer fora da célula; ele continua
   com fundo transparente, então o texto acaba visualmente sobreposto ao conteúdo real de
   Início/Duração/Término por baixo (foi exatamente o que apareceu no print: "TI"/data/duração
   misturados). O fundo de uma célula só pinta a própria caixa da célula, nunca a área para onde o
   conteúdo transbordou — por isso o fundo opaco precisa estar na própria div que transborda
   (.predecessoras-editor-flutuante, o wrapper min-width:360px em TarefasSecao.razor), não na
   célula. z-index garante que ela pinte por cima das células vizinhas (que não têm z-index
   próprio); a sombra só reforça visualmente que é um elemento "flutuando" sobre a linha. */
.predecessoras-editor-flutuante {
    position: relative;
    z-index: 5;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* --- Manípulo de arraste (só nas colunas redimensionáveis) --- */
.tarefas-grade th.tarefas-col-redimensionavel {
    position: relative;
}

/* ETAPA 30 — reserva espaço à direita do texto do cabeçalho para os controles +/- (abaixo) não
   sobrepor o texto. Só o padding-right muda; top/bottom/left continuam vindo da regra de densidade/
   escala (tarefas-escala.css) — precisa de mais uma classe que ".tarefas-col-redimensionavel" sozinha
   para vencer em especificidade sem !important (mesma regra de 3 classes que já define o padding). */
.tarefas-grade .mud-table-head .mud-table-cell.tarefas-col-redimensionavel {
    padding-right: 26px;
}

/* Controles +/- de ajuste fino (5px por clique) — ETAPA 30. Posicionados de forma absoluta,
   verticalmente centralizados na altura do cabeçalho (não criam uma segunda linha, não aumentam a
   altura do MudTh), + em cima e - embaixo, à direita do texto. right:10px (não 4px) de propósito —
   o manípulo de arraste ao lado (.tarefas-col-resize-handle) ocupa até 7px para dentro da borda da
   coluna; um gap de 3px evita que a área de clique dos dois se sobreponha. */
.tarefas-col-ajuste {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    line-height: 1;
    z-index: 2;
}

/* all:unset remove qualquer estilo padrão de <button> do navegador (borda, fundo, padding, fonte) —
   "sem fundo permanente, sem borda pesada", como pedido; as propriedades seguintes reconstróem só o
   necessário. Tamanho pequeno de propósito (14x10px) para não competir visualmente com o texto do
   cabeçalho nem com o manípulo de arraste ao lado. */
.tarefas-col-ajuste-btn {
    all: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 10px;
    font-size: 9px;
    cursor: pointer;
    color: var(--mud-palette-text-secondary, rgba(0, 0, 0, 0.6));
    border-radius: 2px;
}

.tarefas-col-ajuste-btn:hover:not(:disabled) {
    background-color: rgba(0, 0, 0, 0.08);
    color: var(--mud-palette-primary, #16A34A);
}

.tarefas-col-ajuste-btn:disabled {
    cursor: default;
    opacity: 0.35;
}

/* CORREÇÃO — área clicável original (6px, metade dentro/metade fora da coluna) era estreita demais
   para acertar com o cursor de forma confiável. Área de clique agora tem 14px (bem mais fácil de
   "pegar"), mas o indicador VISUAL continua fino (2px, ::after) para não parecer uma barra grossa
   quando a coluna não está sendo arrastada — só fica visível/colorido no hover ou durante o arrasto. */
.tarefas-col-resize-handle {
    position: absolute;
    top: 0;
    right: -7px;
    bottom: 0;
    width: 14px;
    cursor: col-resize;
    touch-action: none;
    z-index: 3;
}

.tarefas-col-resize-handle::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
    transform: translateX(-50%);
    background-color: transparent;
}

.tarefas-col-resize-handle:hover::after,
.tarefas-col-resize-handle.arrastando::after {
    background-color: var(--mud-palette-primary, #16A34A);
    opacity: 0.6;
}

/* ETAPA 34.8.1 — pesquisa de tarefas, compartilhada entre Tabela e Gantt: campo compacto no toolbar
   comum de "Planejamento da obra" (mudou de dono — antes era exclusivo do Gantt, ver
   TarefasGanttView.razor/tarefas-gantt.css). Mesma combinação Variant.Outlined + Margin.Dense já usada
   nos campos de edição em célula desta tela (ex.: "Nome da nova tarefa").
   ETAPA 34.10.2/34.10.3 — reduções sucessivas só do <input>, que deixaram campo/contador/navegação como
   elementos soltos lado a lado (problema identificado na ETAPA 34.10.4).
   ETAPA 34.10.4 — campo + contador + navegação agora formam UM grupo visual único (.tg-grupo-pesquisa):
   uma única borda ao redor de tudo, a borda própria do <MudTextField> (fieldset outlined do MudBlazor,
   inclusive a borda verde de foco — --mud-palette-primary) fica oculta aqui dentro, e o destaque de
   foco/resultado passa a ser só a borda do grupo mudando para a mesma cor neutra (--color-info) já usada
   nos demais estados "ativos" do cabeçalho — nunca uma cor nova. Largura: só um min-width no GRUPO (não
   mais no <input>), então ele cresce automaticamente quando contador/navegação aparecem, e volta ao
   tamanho mínimo quando a pesquisa é limpa — nenhuma largura fixa "grande" para todo estado. */
.tg-grupo-pesquisa {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    min-width: 148px;
    min-height: 32px;
    padding: 0 2px 0 4px;
    border: 1px solid var(--color-border, #E5E7EB);
    border-radius: var(--radius-md, 4px);
    background: var(--color-surface, #fff);
    transition: border-color 150ms ease;
}

.tg-grupo-pesquisa:focus-within {
    border-color: var(--color-info, #3B82F6);
}

/* O <MudTextField> perde a própria borda (inclusive o contorno verde de foco do MudBlazor,
   --mud-palette-primary) — só o grupo acima desenha uma borda, para não sobrar duas bordas juntas. */
.tg-grupo-pesquisa .tg-campo-pesquisa .mud-input-outlined-border {
    border: none !important;
}

/* ETAPA 34.10.5 — 100px cortava quase todo o texto digitado: o ícone de busca (à esquerda) e o "×" de
   limpar (à direita, só aparece com texto) dividem essa largura com o próprio texto, sobrando ~20-30px
   de espaço visível — o suficiente só para um fragmento de caractere. 200px devolve espaço de sobra
   para o termo pesquisado, mesmo com os dois adornos presentes. */
.tg-campo-pesquisa {
    width: 200px;
    flex-shrink: 0;
}

.tg-divisor-pesquisa {
    height: 18px;
}

.tg-pesquisa-contagem {
    font-size: 0.7rem;
    color: var(--color-muted, #6B7280);
    white-space: nowrap;
    padding: 0 2px;
    flex-shrink: 0;
}

/* ETAPA 34.10, item 6 do pedido — ícone discreto antes do rótulo de cada card de indicador; mesmo
   MudPaper "pa-2" compacto de sempre (ETAPA 31), só ganhando esta classe extra e o ícone dentro do
   rótulo — nenhum valor/cálculo/origem de dado muda. */
.tg-card-indicador {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tg-icone-indicador {
    vertical-align: text-bottom;
    margin-right: 3px;
    opacity: 0.6;
}

/* Destaque de pesquisa na Tabela — aplicado via MudTable.RowClassFunc. Mesma cor violeta usada pelo
   Gantt (.tg-linha-encontrada*/.tg-linha-fundo-encontrada*, tarefas-gantt.css) — nova nesta paleta,
   nunca reaproveita nenhuma cor já usada por outro estado da tela. Aplicado no <td> (não no <tr>): em
   tabelas, box-shadow/background só no <tr> pode ficar coberto pelo fundo de cada célula em alguns
   navegadores — estilizar cada <td> garante cobertura confiável da linha inteira. */
.tarefas-grade tr.tarefa-linha-encontrada td {
    background: rgba(139, 92, 246, 0.08);
}

.tarefas-grade tr.tarefa-linha-encontrada-atual td {
    background: rgba(139, 92, 246, 0.16);
}

/* ETAPA 34.9 — modo "Tela inteira" do Planejamento: puramente visual, via position:fixed cobrindo toda
   a viewport, por cima da Sidebar A/Topbar (nenhuma mudança em MainLayout.razor — a sidebar continua
   existindo/funcionando, só fica coberta). O CONTEÚDO em si (toolbar, cards, Tabela/Gantt) não é
   redesenhado: é o MESMO <MudPaper> de sempre, só ganha esta classe extra quando ativo.
   z-index: acima de Drawer/AppBar (ambos usam --mud-zindex-drawer/--mud-zindex-appbar) mas abaixo de
   diálogos/modais (--mud-zindex-dialog) — um diálogo aberto durante a tela inteira (ex.: "Importar
   cronograma") continua aparecendo por cima normalmente. inset:0 já dá largura/altura = área
   disponível, sem nenhum valor fixo em px que pudesse gerar overflow.

   ETAPA 34.9.2 — display:flex;flex-direction:column (raiz sempre com altura = 100% da viewport, via
   inset:0 acima): toolbar e indicadores (os dois primeiros filhos diretos deste MudPaper — nenhuma
   classe própria alterada neles, item "não mexer no header/indicadores" do pedido) continuam com a
   altura natural de sempre (flex-grow:0, o padrão de qualquer item flex sem "flex" definido); o
   TERCEIRO filho (Gantt OU o wrapper da Tabela) é quem recebe flex:1 + min-height:0 logo abaixo — só
   ele cresce para preencher o espaço vertical restante. overflow:auto aqui vira uma rede de segurança
   (se o conteúdo total ainda assim não couber, ex. toolbar quebrando em várias linhas numa janela bem
   estreita), não o mecanismo principal de rolagem — os scrolls internos de sempre (.tg-timeline-scroll/
   .tg-painel-body no Gantt, overflow-y abaixo na Tabela) continuam sendo quem realmente rola o
   conteúdo. */
.tarefas-tela-inteira {
    position: fixed;
    inset: 0;
    z-index: calc(var(--mud-zindex-drawer, 1200) + 10);
    background: var(--color-background, #F8FAFC);
    overflow: auto;
    margin: 0 !important;
    border-radius: 0 !important;
    display: flex;
    flex-direction: column;
}

/* Causa raiz da "área vazia abaixo do Gantt": .tarefas-gantt tem height:min(600px,70vh) fixo
   (tarefas-gantt.css, ETAPA 34.1 — inalterado, continua valendo no modo normal). Este override só
   existe DENTRO de .tarefas-tela-inteira (maior especificidade, sem !important) e troca a altura FIXA
   por flex:1 — o mesmo .tarefas-gantt já é display:flex;flex-direction:column internamente (ver
   tarefas-gantt.css), então .tg-corpo (flex:1;min-height:0 lá dentro) automaticamente absorve toda a
   altura extra que .tarefas-gantt passa a receber daqui — nenhuma linha de TarefasGanttView.razor ou
   AlturaLinha muda; só o container externo cresce. */
.tarefas-tela-inteira > .tarefas-gantt {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
}

/* Mesmo princípio para a Tabela (item 4 do pedido: "o mesmo princípio deve funcionar na Tabela") — o
   wrapper não tinha altura própria antes (crescia com o conteúdo, rolando a página inteira); aqui ganha
   flex:1 + o próprio scroll vertical, para a Tabela ocupar a altura disponível sem herdar nenhuma
   altura fixa nova. */
.tarefas-tela-inteira > .tarefas-tabela-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}