.obra-detalhes-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 20px;
    padding: 12px;
}

.obra-detalhe-colaboradores { flex-basis: 220px; }
.obra-colaboradores-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.obra-colaboradores-tags .tag-orcamento { white-space: normal; overflow-wrap: anywhere; }

.obra-formulario { width: 540px; max-width: 100%; padding: 18px; box-sizing: border-box; display: flex; flex-direction: column; gap: 14px; }
.obra-formulario > label { display: flex; flex-direction: column; gap: 7px; font-size: 12px; color: #52616e; }
.obra-formulario input[type="search"], .obra-formulario select { box-sizing: border-box; width: 100%; min-width: 0; }
.obra-usuarios { max-height: 320px; overflow-y: auto; }
.obra-usuario { display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid #dce1e6; }
.obra-usuario input { flex: 0 0 auto; }
.obra-usuario span { display: flex; flex-direction: column; gap: 4px; text-align: left; }
.obra-usuario small, .obra-selecao { color: #697985; font-size: 11px; }
.obra-erro { color: #9c4747; font-size: 12px; }

.acompanhamento .checklist-pdf-fixo {
    position: fixed;
    right: max(18px, env(safe-area-inset-right));
    bottom: max(18px, env(safe-area-inset-bottom));
    z-index: 100;
    margin: 0;
    padding: 12px 18px;
    border-radius: 8px;
    background: #526877;
    color: #fff;
    opacity: .55;
    transition: opacity 180ms ease;
}
.acompanhamento .checklist-pdf-fixo:hover,
.acompanhamento .checklist-pdf-fixo:focus-visible { opacity: 1; transform: none; }
.acompanhamento { padding-bottom: 70px; }
@media print { .checklist-pdf-fixo { display: none; } }

.obra-detalhe {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 130px;
    flex: 1 1 130px;
}

.obra-detalhe > strong {
    color: #596773;
    font-size: 11px;
    font-weight: 600;
}

.obra-detalhe > .despesa,
.obra-detalhe > .credito {
    align-self: flex-start;
    white-space: nowrap;
}

.tabela-obras {
    font-size: 12px;
    min-width: 100%;
    background-color: white;
    border-collapse: collapse;
}

.tabela-obras thead {
    box-shadow: 0 1px 0 #ccc;
    top: 0;
    position: sticky;
    background-color: #d2d2d2;
    z-index: 10;
}

.tabela-obras thead input {
    width: 100%;
}

.tabela-obras th {
    background-color: #deeaf6;
    font-weight: lighter;
    border: solid 1px #d2d2d2;
    padding: 8px;
}

.tabela-obras td {
    text-align: center;
    padding: 8px;
    border: 1px solid #d2d2d2;
}

.acompanhamento {
    height: 100%;
    width: 100%;
    overflow-x: auto;
    display: flex;
    align-items: start;
    justify-content: start;
    flex-direction: column;
    background-color: white;
}

.dias-uteis {
    font-size: 4rem;
    color: red;
}

.painel-1-tarefas {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 20px;
}

.riscado {
    text-decoration: line-through
}

.tabela-especialidade {
    border-collapse: collapse;
    margin-bottom: 1rem;
}

.tabela-tarefas {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5rem;
}

.tabela-tarefas table td:nth-child(3),
.tabela-tarefas table th:nth-child(3) {
    width: 35vw;
}

.tabela-tarefas td {
    padding: 8px;
    border: solid 1px #a7a7a7;
}

.tabela-tarefas table {
    display: table-row;
    min-width: max-content;
    border-collapse: collapse;
}

.tabTarefas {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5rem;
}

.tabTarefas table td:nth-child(3),
.tabTarefas table th:nth-child(3) {
    width: 35vw;
}

.tabTarefas td {
    padding: 8px;
    border: solid 1px #a7a7a7;
}

.janela-alteracoes {
    overflow: auto;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    gap: 4px;
    max-width: 420px;
    max-height: 180px;
}

/* Históricos (obras e colaboradores): popup quase da altura da tela, descontando o título e a margem. */
.popup.popup-historico .janela { max-height: calc(100vh - 7.5rem); max-height: calc(100dvh - 7.5rem); }
.popup-historico .janela-alteracoes { max-height: 320px; }

/* Cada frase do histórico: leitura confortável, sem cor de alerta. */
.tag-alteracao {
    display: inline-block;
    padding: 4px 8px;
    border: 1px solid #dfe5ea;
    border-radius: 8px;
    background-color: #f6f8fa;
    color: #3f4d58;
    line-height: 1.4;
    text-align: left;
}

.tag-alteracao b { font-weight: 600; color: #2f3d48; }
.historico-antes { color: #8a5a52; text-decoration: line-through; text-decoration-color: #d9b3ad; }
.historico-depois { color: #2f6a46; font-weight: 600; }
.historico-ref { font-style: normal; }
.historico-pessoa { display: inline-block; padding: 3px 8px; border-radius: 8px; background: #eef3f7; color: #3f4d58; font-weight: 600; }

@media screen and (orientation: landscape),
screen and (min-aspect-ratio: 13/9) {

    .painel-1-tarefas {
        flex-direction: row;
    }

}
.popup-itens-obra .popup-janela-fora { width: min(1100px, 96vw); max-width: 96vw; }
/* O resumo fica fora da área que rola; só a tabela rola (nos dois sentidos), com o cabeçalho fixo. */
.popup-itens-obra .janela { width: 100%; padding: 0; display: flex; flex-direction: column; overflow: hidden; }
.obra-itens-orcamento { width: 100%; padding: 0; color: #4b5965; box-sizing: border-box; display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.obra-itens-resumo { flex: none; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 12px 16px; font-size: 12px; background: #fff; border-bottom: 1px solid #e3e7ea; }
.obra-itens-recorte { flex: 1 1 auto; min-height: 0; max-height: none; overflow: auto; overscroll-behavior: contain; border: 0; border-radius: 0; }
.obra-itens-recorte .tabela { min-width: 650px; }
/* Sticky nas células (e não só no thead): é o que o Safari/iOS respeita. */
.obra-itens-recorte .tabela thead th { position: sticky; top: 0; z-index: 2; background-color: #f3f3f3; box-shadow: inset 0 -1px 0 #ccc; }
.obra-itens-recorte td:nth-child(n+5) { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.obra-itens-orcamento > p { padding: 0 16px; font-size: 11px; color: #78838c; line-height: 1.6; }
.obra-total-zerado { display: inline-block; padding: 4px 8px; border: 1px solid #edc3c3; border-radius: 6px; background: #fceaea; color: #a52f2f; font-weight: 600; }