/* Ajustes específicos das telas (entrega-detalhe). O padrão comum fica em css/apr-padrao.css. */

/* Valores comuns numa linha, com reticências e o texto inteiro no title */
.apr-dados > .apr-dados-valor.apr-dados-valor--linha {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.apr-dados > .apr-dados-valor .apr-dados-alerta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--mud-palette-warning-darken);
}

/* Mostrar/esconder conforme a largura (1280 px = Breakpoint.Lg) */
@media (min-width: 1280px) {
    .apr-mostrar-abaixo-lg { display: none !important; }
}
@media (max-width: 1279.98px) {
    .apr-so-lg-acima { display: none !important; }
}
@media (min-width: 1600px) {
    .apr-mostrar-abaixo-xl { display: none !important; }
}
@media (max-width: 1599.98px) {
    .apr-so-xl-acima { display: none !important; }
}

/* Cabeçalho dos cartões do detalhe: mesmo respiro do MudCardHeader */
.apr-detalhe-cartao > .apr-detalhe-cartao-cabecalho {
    padding: 16px 16px 8px;
}

/* Seções numeradas dentro do cartão da conferência */
.apr-conf-secao { padding-top: 20px; }
.apr-conf-secao + .apr-conf-secao { border-top: 1px solid var(--mud-palette-lines-default); margin-top: 20px; }
.apr-conf-secao-titulo {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    margin-bottom: 4px;
}
.apr-conf-aviso {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--mud-palette-warning-darken);
    font-size: .875rem;
    margin-top: 8px;
}
.apr-conf-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .8125rem;
    color: var(--mud-palette-text-secondary);
}

/* NF por EPI: miniatura + nome à esquerda, campos logo em seguida (sem vão no 1920) */
.apr-nf-lista { border-top: 1px solid var(--mud-palette-lines-default); }
.apr-nf-bloco {
    display: grid;
    grid-template-columns: minmax(240px, 360px) minmax(0, 720px);
    gap: 12px 24px;
    align-items: center;
    padding: 12px 8px;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}
.apr-nf-bloco:hover { background-color: var(--mud-palette-table-hover); }
.apr-nf-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.apr-nf-item-textos {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.apr-nf-campos {
    display: grid;
    /* o CNPJ precisa de ~180 px para o rótulo "CNPJ do fornecedor" e a máscara caberem */
    grid-template-columns: minmax(110px, 1.4fr) minmax(72px, .7fr) minmax(180px, 2fr);
    gap: 12px;
    align-items: start;
}
.apr-nf-sugestao {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 4px 8px;
}
/* "Usar" fica no fim da mesma linha da sugestão: o texto quebra dentro do seu bloco, o botão não desce sozinho */
.apr-nf-sugestao > span { min-width: 0; flex: 0 1 auto; }
.apr-nf-sugestao > .mud-icon-root,
.apr-nf-sugestao > .apr-botao,
.apr-nf-sugestao > .mud-button-root { flex-shrink: 0; }
@media (max-width: 1279.98px) {
    .apr-nf-bloco { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 599.98px) {
    .apr-nf-campos { grid-template-columns: minmax(0, 1fr); }
}

/* Área de anexo do papel: arrastar e soltar (o input cobre a área e aceita o drop) */
/* A caixa e o componente ficam posicionados: o input invisível cobre só a área de anexo */
.apr-upload-papel-caixa,
.apr-upload-papel {
    position: relative;
    display: block;
}
.apr-upload-papel .apr-upload-entrada {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    cursor: pointer;
    opacity: 0;
}
.apr-upload-area {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    padding: 16px;
    border: 2px dashed var(--apr-borda-controle, #757575);
    border-radius: 6px;
    background-color: var(--mud-palette-background-gray);
}
.apr-upload-area .apr-botao { pointer-events: none; }
.apr-upload-area.apr-upload-area--ativa {
    border-color: var(--mud-palette-primary);
    background-color: rgba(var(--mud-palette-primary-rgb), .08);
}
.apr-upload-papel:focus-within .apr-upload-area {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}

/* Papel anexado */
.apr-papel-anexado {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
}
.apr-papel-anexado .apr-papel-textos { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; }

/* Legenda da assinatura (apr-partes): numa linha quando couber; senão quebra entre "nome · CPF" e "Assinada em ...",
   nunca no meio da data e hora */
.apr-legenda-assinatura { display: block; margin-top: 8px; }

/* Fotos lado a lado no diálogo de comparação */
.apr-fotos-comparacao {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.apr-fotos-comparacao.apr-fotos-comparacao--uma { grid-template-columns: minmax(0, 1fr); }
.apr-fotos-comparacao-item { margin: 0; min-width: 0; }
@media (max-width: 599.98px) {
    .apr-fotos-comparacao { grid-template-columns: minmax(0, 1fr); }
}

/* Itens entregues: fotos numa linha */
.apr-fotos-linha {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 8px;
}


/* =============================================================================
   Rodada 3
   ============================================================================= */

/* Subtítulo do cabeçalho e legenda da assinatura em partes (apr-partes, comum): nome longo cortado com reticências
   e o texto inteiro no tooltip, sem passar da largura */
.apr-partes .apr-parte.apr-parte-nome,
.apr-partes .apr-parte.apr-legenda-signatario {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
}

/* "Para conferir, falta: ..." logo abaixo do cabeçalho (primeira dobra) */
.apr-conf-falta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 8px;
    margin-top: 12px;
    padding: 6px 12px;
    border-radius: 6px;
    border-left: 4px solid var(--mud-palette-warning);
    background-color: var(--apr-ambar-claro, #FFF3E0);
    color: var(--apr-ambar-escuro, #8A4B00);
    font-size: .875rem;
}
.apr-conf-falta .apr-botao { margin-left: auto; }

/* Passos da conferência: estados que o AprPassos não tem */
/* NF de compra é opcional: não aparece como "etapa atual" */
.apr-conf-passos--nf-opcional .apr-passo:nth-child(1).apr-passo--atual {
    border-color: var(--mud-palette-lines-default);
    box-shadow: none;
}
.apr-conf-passos--nf-opcional .apr-passo:nth-child(1).apr-passo--atual .apr-passo-marcador {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-secondary);
}
/* Papel assinado pendente: único passo obrigatório, em âmbar */
.apr-conf-passos--papel-pendente .apr-passo:nth-child(3) {
    border-color: var(--mud-palette-warning);
    background: var(--apr-ambar-claro, #FFF3E0);
    box-shadow: inset 0 0 0 1px var(--mud-palette-warning);
}
.apr-conf-passos--papel-pendente .apr-passo:nth-child(3) .apr-passo-marcador {
    background: var(--mud-palette-warning);
    color: var(--mud-palette-warning-text);
}
.apr-conf-passos--papel-pendente .apr-passo:nth-child(3) .apr-passo-descricao {
    color: var(--apr-ambar-escuro, #8A4B00);
    font-weight: 600;
}
/* NF parcial: âmbar com "!" no lugar do número ou do check (não é a etapa atual) */
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1),
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1).apr-passo--atual,
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1).apr-passo--concluido {
    border-color: var(--mud-palette-warning);
    background: var(--apr-ambar-claro, #FFF3E0);
    box-shadow: none;
}
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1) .apr-passo-marcador {
    background: var(--mud-palette-warning);
    color: var(--mud-palette-warning-text);
    font-size: 0;
}
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1) .apr-passo-marcador > * { display: none; }
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1) .apr-passo-marcador::after {
    content: "!";
    font-size: .9375rem;
    font-weight: 700;
}
.apr-conf-passos--nf-parcial .apr-passo:nth-child(1) .apr-passo-descricao {
    color: var(--apr-ambar-escuro, #8A4B00);
}

/* Entrega conferida sem NF (ou com NF de parte dos EPIs): a NF é opcional e não há mais o que fazer, então o
   passo fica neutro (cinza, travessão no marcador), sem o verde de concluído nem o âmbar de pendência. */
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1),
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1).apr-passo--atual,
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1).apr-passo--concluido {
    border-color: var(--mud-palette-lines-default);
    background: none;
    box-shadow: none;
}
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1) .apr-passo-marcador {
    background: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-secondary);
    font-size: 0;
}
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1) .apr-passo-marcador > * { display: none; }
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1) .apr-passo-marcador::after {
    content: "–";
    font-size: .9375rem;
    font-weight: 700;
}
.apr-conf-passos--nf-neutra .apr-passo:nth-child(1) .apr-passo-descricao {
    color: var(--mud-palette-text-secondary);
}

/* Barra "Repetir / Salvar NF" com a largura do bloco da NF: Salvar NF fica no fim do campo CNPJ */
.apr-nf-barra { max-width: 1120px; }

/* Itens entregues: Item, Qtd, Tipo e Fotos juntos; a sobra fica no fim da linha */
.apr-itens-entregues .mud-table-head .apr-col-item { width: 240px; }
.apr-itens-entregues .mud-table-head .apr-col-tipo { width: 260px; }
.apr-itens-entregues .mud-table-head .apr-col-fotos { width: 240px; }
.apr-itens-entregues .mud-table-root .mud-table-row .mud-table-cell.apr-col-sobra { padding: 0; }
@media (min-width: 1600px) {
    .apr-itens-entregues .mud-table-head .apr-col-item { width: 260px; }
}
/* Segunda linha do Tipo: até 2 linhas, quebrando entre palavras */
.apr-itens-entregues .apr-tipo-detalhe {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    word-break: normal;
    overflow-wrap: normal;
    font-size: .75rem;
    line-height: 1.3;
}
.apr-fotos-celula {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

/* Detalhes técnicos: cartão recolhível no mesmo estilo dos outros cartões */
.apr-detalhes-tecnicos .mud-expand-panel-header { padding: 16px; }
.apr-detalhes-tecnicos .mud-expand-panel-header .apr-cartao-cabecalho { flex: 1 1 auto; }
.apr-detalhes-tecnicos .mud-expand-panel-content { padding: 0 16px 16px; }
.apr-tec-secao { min-width: 0; }
.apr-tec-secao-titulo { margin-bottom: 8px; }
.apr-tec-secao-titulo .ml-auto { margin-left: auto; }
.apr-tec-mapa {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid var(--mud-palette-lines-default);
}
.apr-tec-subtitulo {
    margin: 16px 0 6px;
    color: var(--mud-palette-text-secondary);
    font-weight: 600;
}

/* Aparelho e auditoria: rótulos numa linha, botões Copiar alinhados numa coluna */
.apr-detalhe-auditoria .apr-dados { grid-template-columns: minmax(130px, 180px) minmax(0, 1fr); }
@media (min-width: 1366px) {
    .apr-detalhe-auditoria .apr-dados { grid-template-columns: minmax(160px, 240px) minmax(0, 1fr); }
}
.apr-detalhe-auditoria .apr-dados > .apr-dados-rotulo {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.apr-detalhe-auditoria .apr-dados-codigo > .apr-dados-codigo-texto { flex: 0 1 40ch; }

/* =============================================================================
   Rodada 4
   ============================================================================= */

/* "Sem NF": a NF é opcional, então o chip fica neutro (texto cinza, borda clara); o laranja fica só para o que
   bloqueia a conferência (status, faixa "Para conferir, falta" e passo 3) */
.mud-chip.apr-chip-sem-nf {
    color: var(--mud-palette-text-secondary);
    border-color: var(--mud-palette-lines-inputs);
}
.mud-chip.apr-chip-sem-nf .mud-chip-icon { color: var(--mud-palette-text-secondary); }

/* CNPJ com máscara: o MudTextField não pinta o erro sozinho; o contêiner marca a borda e mostra a mensagem */
.apr-nf-cnpj { min-width: 0; }
.apr-nf-cnpj.apr-nf-cnpj--erro .mud-input-outlined-border { border-color: var(--mud-palette-error) !important; border-width: 2px; }
.apr-nf-cnpj.apr-nf-cnpj--erro .mud-input-label { color: var(--mud-palette-error) !important; }
.apr-nf-cnpj .apr-texto-erro { margin-left: 14px; }
