/* Páginas: responsivo por página, contagem, reservas, alertas, filtros (parte de style.css) */
/* ============================================================
   RESPONSIVO — cabeçalhos de secção, botões e tabelas em ecrãs pequenos
   ============================================================ */
.layout, main { min-width: 0; }
.tab-content { min-width: 0; overflow-x: clip; } /* clip (e não hidden): mantém a sidebar sticky */

.section-header { flex-wrap: wrap; gap: 12px 16px; }
.section-header h2 { margin: 0; }
.tree-acoes, .search-box { flex-wrap: wrap; }

@media (max-width: 900px) {
    .section-header { flex-direction: column; align-items: stretch; }
    .tree-acoes, .search-box { width: 100%; justify-content: flex-start; gap: 8px; }
    .tree-acoes .tree-contagem { flex: 1 0 100%; order: -1; }
    .tree-acoes .btn, .search-box .btn { flex: 1 1 auto; justify-content: center; white-space: nowrap; }
    .tree-acoes select, .tree-acoes input[type="text"], .tree-acoes input[type="search"] { flex: 1 1 160px; min-width: 0; }
    .search-box input { flex: 1 1 180px; min-width: 0; }
}
@media (max-width: 480px) {
    .tree-acoes .btn, .search-box .btn { flex: 1 1 calc(50% - 8px); }
    .section-header h2 { font-size: 18px; }
    .loc-filtro span { min-width: 0; flex-basis: 100%; }
}

/* Tabelas → cartões */
@media (max-width: 700px) {
    .table-container:has(.cards-mobile) { background: none; border: 0; box-shadow: none; overflow: visible; }
    table.cards-mobile, table.cards-mobile tbody { display: block; width: 100%; min-width: 0; }
    table.cards-mobile thead { display: none; }
    table.cards-mobile tr {
        display: block; margin-bottom: 10px; padding: 8px 14px;
        background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio);
        box-shadow: var(--sombra-sm);
    }
    table.cards-mobile tr.linha-unica { padding: 0; }
    table.cards-mobile td {
        display: flex; align-items: center; justify-content: space-between; gap: 14px;
        width: auto; padding: 7px 0; border: 0; border-bottom: 1px dashed var(--borda);
        text-align: right; min-width: 0; overflow-wrap: anywhere;
    }
    table.cards-mobile td:last-child { border-bottom: 0; }
    table.cards-mobile td::before {
        content: attr(data-label); flex: 0 0 34%; max-width: 40%;
        font-size: 11px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase;
        color: var(--texto-2); text-align: left;
    }
    table.cards-mobile td:not([data-label])::before, table.cards-mobile td[data-label=""]::before { display: none; }
    table.cards-mobile td.actions, table.cards-mobile td.inv-acao { justify-content: flex-end; flex-wrap: wrap; }
    table.cards-mobile td.actions::before, table.cards-mobile td.inv-acao::before { display: none; }
    table.cards-mobile td:empty { display: none; }
    table.cards-mobile .cel-nome, table.cards-mobile .cel-loc { flex-wrap: wrap; }
    table.cards-mobile .cel-nome > div, table.cards-mobile .cel-loc > * { text-align: right; }
    table.cards-mobile tfoot { display: block; }
    table.cards-mobile tfoot tr { background: transparent; border: 0; box-shadow: none; padding: 4px 14px; }
}

/* Localizações (árvore): linhas de detalhe compactas, com botões sempre visíveis */
@media (max-width: 700px) {
    #tab-localizacoes .table-container { overflow-x: visible; }
    #tab-localizacoes table, #tab-localizacoes tbody { display: block; width: 100%; min-width: 0; }
    #tab-localizacoes thead { display: none; }
    #tab-localizacoes tr { display: block; }
    #tab-localizacoes tr.detalhe {
        display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 10px 14px;
    }
    #tab-localizacoes tr.detalhe td { display: block; width: auto; padding: 0; border: 0; }
    #tab-localizacoes tr.detalhe td.actions { flex: 1 0 100%; display: flex; gap: 8px; }
    #tab-localizacoes tr.detalhe td.actions .btn { flex: 1 1 0; justify-content: center; }
}

/* Nada (ex.: tabelas largas, ícones de ordenação) pode alargar a página: corta no layout, sem criar scroll interno */
.layout, main { overflow-x: clip; }
.table-container { contain: paint; max-width: 100%; }

/* ============================================================
   LOCALIZAÇÕES — ramos recolhidos em ecrãs pequenos + etiquetas (pré-visualização e impressão)
   ============================================================ */
#tab-localizacoes tr.oculta { display: none !important; } /* sobrepõe o display:block/flex do modo telemóvel */

#etiquetas-overlay {
    position: fixed; inset: 0; z-index: 4000; display: flex; flex-direction: column; background: #3a3d30;
}
.etl-area { flex: 1; overflow: auto; padding: 20px; display: flex; justify-content: center; align-items: flex-start; }
.etiquetas-grelha {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px;
    width: 100%; max-width: 900px; padding: 16px; background: #fff; border-radius: 8px;
}
.etiqueta-loc {
    break-inside: avoid; display: flex; flex-direction: column; align-items: center; gap: 3mm;
    border: 1.5px solid #000; border-radius: 3mm; padding: 5mm; color: #000; background: #fff;
}
.etiqueta-qr { width: 42mm; height: 42mm; max-width: 100%; }
.etiqueta-texto { text-align: center; }
.etiqueta-texto b { display: block; font-size: 20pt; letter-spacing: 1px; }
.etiqueta-texto span { font-size: 9pt; }

@media print {
    body.etiquetas-aberta > *:not(#etiquetas-overlay) { display: none !important; }
    body.etiquetas-aberta #etiquetas-overlay { position: static; display: block; background: #fff; }
    body.etiquetas-aberta #etiquetas-overlay .folha-barra { display: none; }
    body.etiquetas-aberta .etl-area { display: block; padding: 0; overflow: visible; }
    body.etiquetas-aberta .etiquetas-grelha {
        display: grid; grid-template-columns: repeat(3, 1fr); gap: 6mm; max-width: none; padding: 0; border-radius: 0;
    }
}

/* ============================================================
   ETIQUETA DO PRODUTO — responsivo
   ============================================================ */
#etiqueta-overlay { --etq-escala: 2.6; }
.etq-ecra { width: calc(101.5mm * var(--etq-escala)); height: calc(50mm * var(--etq-escala)); }
.etq-ecra-escala { transform: scale(var(--etq-escala)); }
#etiqueta-overlay .folha-area { padding: 20px 16px; align-items: flex-start; }

.etq-controlo { align-items: flex-end; gap: 12px 16px; }
.etq-campo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.etq-campo label { font-size: 12px; }
.etq-par { display: flex; gap: 8px; }
.etq-campo-qtd .etq-par input { width: 120px; }
.etq-campo-copias input { width: 90px; }
.etq-nota { align-self: center; max-width: 360px; }

@media (max-width: 760px) {
    #etiqueta-overlay { overflow-y: auto; }
    #etiqueta-overlay .folha-barra { flex-direction: column; align-items: stretch; gap: 12px; padding: 12px 14px; }
    #etiqueta-overlay .folha-barra-texto span { font-size: 11px; }
    .etq-controlo { display: grid; grid-template-columns: 1fr 96px; gap: 10px; justify-content: stretch; }
    .etq-campo-qtd .etq-par input { width: 100%; min-width: 0; flex: 1 1 0; }
    .etq-campo-qtd .etq-par select { flex: 1 1 0; min-width: 0; }
    .etq-campo-copias input { width: 100%; }
    .etq-nota { grid-column: 1 / -1; max-width: none; min-width: 0; }
    #etiqueta-overlay .folha-barra-acoes { width: 100%; }
    #etiqueta-overlay .folha-barra-acoes .btn { flex: 1; justify-content: center; }
    #etiqueta-overlay .folha-area { overflow: visible; flex: 0 0 auto; padding: 16px 16px 28px; }
}
@media print { #etiqueta-overlay { --etq-escala: 1; } }

/* Admin: auditoria */
.audit-detalhe { max-width: 420px; overflow-wrap: anywhere; font-size: 12px; color: var(--texto-2); }
#admin-auditoria { max-height: 520px; overflow: auto; }

/* Arrumação / Picking */
.seg-op { display: inline-flex; border: 1px solid var(--borda); border-radius: 8px; overflow: hidden; }
.seg-op .btn { border-radius: 0; border: 0; }
.seg-op .btn.ativo { background: var(--verde); color: #fff; }
.arr-obra-campo {
    width: 100%; max-width: 420px; padding: 10px 12px; font-size: 15px;
    border: 2px solid var(--borda); border-radius: 10px; background: var(--superficie); color: var(--texto);
}
.arr-obra-campo:focus { outline: none; border-color: var(--verde); }
.arr-reservas { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.arr-reservas small { color: var(--texto-2); }
.chip-reserva {
    padding: 4px 10px; border-radius: 999px; border: 1px solid var(--verde); background: transparent;
    color: var(--texto); font-size: 12px; font-weight: 600; cursor: pointer;
}
.chip-reserva.ativa, .chip-reserva:hover { background: var(--verde); color: #fff; }
.loc-lote { margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; background: #e8e2f3; color: #4a3a73; }
body.dark .loc-lote { background: #342c4d; color: #cfc2f2; }
.etq-campo-lote input { width: 150px; }
.etq-qtd i.etq-lote { font-style: normal; font-size: 3.4mm; font-weight: 700; border: .3mm solid #000; border-radius: 1mm; padding: 0 1.5mm; }
@media (max-width: 760px) { .etq-campo-lote { grid-column: 1 / -1; } .etq-campo-lote input { width: 100%; } }

/* Etiquetas de várias paletes (receção) */
.etqm-area { display: block; overflow: auto; }
.etqm-lista { display: flex; flex-direction: column; gap: 14px; max-width: 1000px; margin: 0 auto; }
.etqm-item {
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center;
    padding: 12px; border-radius: 10px; background: #2c2f22; border: 1px solid #4a4d3e;
}
.etqm-previa { width: calc(101.5mm * 0.9); height: calc(50mm * 0.9); box-shadow: 0 6px 20px rgba(0,0,0,.4); }
.etqm-escala { transform: scale(0.9); transform-origin: top left; width: 101.5mm; height: 50mm; }
.etqm-campos { display: flex; flex-wrap: wrap; gap: 12px; color: #d4d6cb; }
.etqm-campos label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; }
.etqm-campos input, .etqm-campos select {
    height: 38px; padding: 0 10px; border-radius: 8px; border: 1px solid #4a4d3e; background: #20221a; color: #fff; font-size: 14px;
}
.etqm-campos input[data-c="quantidade"] { width: 110px; }
.etqm-campos input[data-c="lote"] { width: 150px; }
.etqm-campos input[data-c="copias"] { width: 80px; }
@media (max-width: 760px) {
    .etqm-item { grid-template-columns: 1fr; }
    .etqm-previa { width: calc(101.5mm * 0.8); height: calc(50mm * 0.8); max-width: 100%; }
    .etqm-escala { transform: scale(0.8); }
    .etqm-campos { display: grid; grid-template-columns: 1fr 1fr; }
    .etqm-campos label:first-child { grid-column: 1 / -1; }
    .etqm-campos input[data-c] { width: 100% !important; min-width: 0; }
}

/* Contagem de inventário / Reservas */
.cnt-diff { font-weight: 700; white-space: nowrap; }
.cnt-diff.ok { color: #2e7d32; }
.cnt-diff.mais { color: #1565c0; }
.cnt-diff.menos { color: #c62828; }
tr.cnt-extra { background: rgba(194, 138, 0, .08); }
.cnt-zerar { display: flex; gap: 8px; align-items: flex-start; margin: 14px 0 4px; font-size: 13px; }
.cnt-resultado { margin-top: 16px; padding: 14px; border-radius: 10px; background: var(--superficie-2); border: 1px dashed var(--verde); }
.cnt-resultado h3 { margin: 0 0 8px; font-size: 14px; }
.cnt-resultado ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.sub-linha { font-size: 12px; color: var(--texto-2); }
.stock-reservado { display: block; margin-top: 2px; font-size: 11px; font-weight: 700; color: #7a5a00; }
body.dark .stock-reservado { color: #e6cf7a; }
.produto-reservado { display: block; margin-top: 4px; font-size: 12px; color: #7a5a00; }
body.dark .produto-reservado { color: #e6cf7a; }

/* ============================================================
   CONTAGEM — responsivo
   ============================================================ */
#inv-vista-contagem .scan-barra { flex-wrap: wrap; }
#inv-vista-contagem .scan-barra input { flex: 1 1 100%; min-width: 0; }
#inv-vista-contagem .scan-barra .btn { flex: 1 1 0; justify-content: center; }
#cnt-add-produto { min-width: 0; width: 100%; padding: 9px 12px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); color: var(--texto); }
#inv-vista-contagem .qtd-linha { display: flex; gap: 8px; min-width: 0; }
#inv-vista-contagem .qtd-linha input { flex: 1 1 90px; min-width: 0; width: 100%; }
#inv-vista-contagem .qtd-linha select { flex: 0 1 auto; min-width: 0; max-width: 120px; }

@media (min-width: 701px) {
    #cnt-add-produto { min-width: 300px; }
}

@media (max-width: 700px) {
    #inv-vista-contagem .card { padding: 14px; }
    #inv-vista-contagem .section-header { margin-bottom: 12px; }
    #inv-vista-contagem .section-header .tree-acoes { width: 100%; }

    /* cada produto vira um cartão em grelha: nome em cima; registado/diferença lado a lado; contado em largura total */
    #inv-vista-contagem table.cards-mobile tr {
        display: grid; grid-template-columns: 1fr 1fr; gap: 2px 14px; padding: 12px 14px;
    }
    #inv-vista-contagem table.cards-mobile td { display: block; padding: 6px 0; border: 0; text-align: left; min-width: 0; }
    #inv-vista-contagem table.cards-mobile td::before {
        display: block; flex: none; max-width: none; margin-bottom: 2px;
    }
    #inv-vista-contagem table.cards-mobile td[data-label="Produto"] { grid-column: 1 / -1; padding-bottom: 8px; border-bottom: 1px dashed var(--borda); }
    #inv-vista-contagem table.cards-mobile td[data-label="Produto"]::before { display: none; }
    #inv-vista-contagem table.cards-mobile td[data-label="Contado"] { grid-column: 1 / -1; }
    #inv-vista-contagem table.cards-mobile td.actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; padding: 0; }
    #inv-vista-contagem table.cards-mobile td.actions:empty { display: none; }
    #inv-vista-contagem table.cards-mobile td.cnt-diff { text-align: right; }
    #inv-vista-contagem table.cards-mobile td[data-label="Registado"] + td + td { text-align: left; }

    #inv-vista-contagem .qtd-linha input { font-size: 16px; padding: 10px 12px; } /* 16px evita o zoom automático no iPhone */
    #inv-vista-contagem .qtd-linha select { max-width: 45%; }

    #inv-vista-contagem .arrumar-acoes { flex-direction: column-reverse; align-items: stretch; }
    #inv-vista-contagem .arrumar-acoes .btn { width: 100%; justify-content: center; }
    #inv-vista-contagem .arrumar-acoes .loc-nota { text-align: center; }
    #inv-vista-contagem .cnt-zerar { align-items: flex-start; }
    #inv-vista-contagem .cnt-resultado ul { padding-left: 16px; }
    #inv-vista-contagem .scan-valor { gap: 8px; }
    #inv-vista-contagem .scan-valor .btn { margin-left: auto; }
}
@media (max-width: 700px) {
    #inv-vista-contagem table.cards-mobile td[data-label="Produto"] { grid-row: 1; }
    #inv-vista-contagem table.cards-mobile td[data-label="Registado"] { grid-row: 2; grid-column: 1; }
    #inv-vista-contagem table.cards-mobile td.cnt-diff { grid-row: 2; grid-column: 2; }
    #inv-vista-contagem table.cards-mobile td[data-label="Contado"] { grid-row: 3; }
    #inv-vista-contagem table.cards-mobile td.actions { grid-row: 4; }
}

/* ============================================================
   RESERVAS — responsivo
   ============================================================ */
#tab-reservas .tree-acoes select, #tab-reservas .tree-acoes input[type="text"] { min-height: 38px; }
#reservas-pesquisa { min-width: 0; padding: 8px 12px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); color: var(--texto); }

@media (max-width: 700px) {
    #tab-reservas .tree-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    #tab-reservas .tree-acoes .tree-contagem { grid-column: 1 / -1; order: -1; }
    #tab-reservas .tree-acoes #reservas-pesquisa { grid-column: 1 / -1; width: 100%; font-size: 16px; }
    #tab-reservas .tree-acoes #btn-reserva-nova { grid-column: 1 / -1; width: 100%; justify-content: center; }

    /* cartão: obra e produto em destaque; 3 valores lado a lado; estado; ações */
    #tab-reservas table.cards-mobile tr {
        display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 12px; padding: 14px;
    }
    #tab-reservas table.cards-mobile td { display: block; padding: 4px 0; border: 0; text-align: left; min-width: 0; }
    #tab-reservas table.cards-mobile td::before { display: block; flex: none; max-width: none; margin-bottom: 2px; }
    #tab-reservas table.cards-mobile td:nth-child(1) { grid-column: 1 / -1; font-size: 15px; }
    #tab-reservas table.cards-mobile td:nth-child(2) { grid-column: 1 / -1; padding-bottom: 10px; border-bottom: 1px dashed var(--borda); }
    #tab-reservas table.cards-mobile td:nth-child(1)::before { display: none; }
    #tab-reservas table.cards-mobile td:nth-child(6) { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 8px; }
    #tab-reservas table.cards-mobile td:nth-child(6)::before { margin: 0; }
    #tab-reservas table.cards-mobile td:nth-child(6) .sub-linha { margin: 0; }
    #tab-reservas table.cards-mobile td.actions { grid-column: 1 / -1; display: flex; gap: 8px; padding: 8px 0 0; }
    #tab-reservas table.cards-mobile td.actions .btn { flex: 1; justify-content: center; }
    #tab-reservas table.cards-mobile td.actions:empty { display: none; }
    #tab-reservas table.cards-mobile tr.linha-unica { display: block; }
}

/* Formulário de reserva (modal) */
#reserva-form .qtd-linha { display: flex; gap: 8px; }
#reserva-form .qtd-linha input { flex: 1 1 auto; min-width: 0; }
#reserva-form .qtd-linha select { flex: 0 0 auto; max-width: 40%; }
#reserva-form input, #reserva-form select { max-width: 100%; box-sizing: border-box; }
@media (max-width: 480px) {
    #reserva-form input, #reserva-form select { font-size: 16px; }
    #reserva-form .btn { width: 100%; justify-content: center; }
}

/* Inventário › modo contagem */
.cnt-topo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.cnt-topo-nota { font-size: 13px; color: var(--texto-2); }

/* ============================================================
   INVENTÁRIO — responsivo
   ============================================================ */
.inv-resumo { white-space: normal; overflow-wrap: anywhere; }
#inv-pesquisa { min-width: 0; }

@media (max-width: 700px) {
    #tab-inventario .tree-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; }
    #tab-inventario .tree-acoes #inv-armazem { grid-column: 1 / -1; width: 100%; }
    #tab-inventario .tree-acoes .btn { width: 100%; justify-content: center; }
    #tab-inventario .tree-acoes #inv-contar { grid-column: 1 / -1; }
    #inv-pesquisa { width: 100%; font-size: 16px; }

    /* produto = cabeçalho do cartão; cada localização = linha por baixo */
    #tab-inventario .table-container { background: none; border: 0; box-shadow: none; overflow: visible; }
    #tab-inventario table.inv-tabela, #tab-inventario table.inv-tabela tbody { display: block; width: 100%; min-width: 0; }
    #tab-inventario table.inv-tabela thead { display: none; }
    #tab-inventario table.inv-tabela td::before { display: none !important; }
    #tab-inventario table.inv-tabela td { display: block; padding: 0; border: 0; text-align: left; min-width: 0; }
    #tab-inventario table.inv-tabela td:empty, #tab-inventario table.inv-tabela td.inv-vazio { display: none; }

    #tab-inventario tr.inv-grupo {
        display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: start;
        margin: 12px 0 0; padding: 12px 14px;
        background: var(--superficie-2); border: 1px solid var(--borda); border-bottom: 0;
        border-radius: var(--raio) var(--raio) 0 0; box-shadow: none;
    }
    #tab-inventario tr.inv-grupo td:first-child { grid-row: 1 / span 2; }
    #tab-inventario tr.inv-grupo .inv-grupo-nome { display: block; font-size: 15px; line-height: 1.3; }
    #tab-inventario tr.inv-grupo .inv-grupo-sub { display: block; margin-top: 2px; font-size: 12px; color: var(--texto-2); }
    #tab-inventario tr.inv-grupo td.inv-qtd { grid-column: 2; grid-row: 1; text-align: right; font-weight: 700; white-space: nowrap; }
    #tab-inventario tr.inv-grupo td.inv-alt { grid-column: 2; grid-row: 2; text-align: right; font-size: 12px; color: var(--texto-2); white-space: nowrap; }

    #tab-inventario tr.inv-linha {
        display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 2px 12px; align-items: center;
        margin: 0; padding: 10px 14px;
        background: var(--superficie); border: 1px solid var(--borda); border-top: 1px dashed var(--borda);
        border-radius: 0; box-shadow: none;
    }
    #tab-inventario tr.inv-linha:has(+ tr.inv-linha) { border-bottom: 0; }
    #tab-inventario tr.inv-linha:not(:has(+ tr.inv-linha)) { border-radius: 0 0 var(--raio) var(--raio); box-shadow: var(--sombra-sm); }
    #tab-inventario tr.inv-linha td:nth-child(2) { grid-column: 1; grid-row: 1 / span 2; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
    #tab-inventario tr.inv-linha td.inv-qtd { grid-column: 2; grid-row: 1; text-align: right; font-weight: 600; white-space: nowrap; }
    #tab-inventario tr.inv-linha td.inv-alt { grid-column: 2; grid-row: 2; text-align: right; font-size: 12px; color: var(--texto-2); white-space: nowrap; }
    #tab-inventario tr.inv-linha td.inv-acao { grid-column: 3; grid-row: 1 / span 2; }
    #tab-inventario tr.inv-linha td.inv-acao .btn { white-space: nowrap; }
    #tab-inventario tr.linha-unica { display: block; padding: 0; }
}

/* Telemóveis muito estreitos: o botão passa para baixo */
@media (max-width: 380px) {
    #tab-inventario tr.inv-linha { grid-template-columns: minmax(0, 1fr) auto; }
    #tab-inventario tr.inv-linha td.inv-acao { grid-column: 1 / -1; grid-row: 3; margin-top: 6px; }
    #tab-inventario tr.inv-linha td.inv-acao .btn { width: 100%; }
}

/* Alerta: mercadoria no cais há demasiado tempo */
.alerta-cais {
    margin-bottom: 18px; padding: 14px 16px; border-radius: 12px;
    background: #fff6e0; border: 1px solid #ecd28a; color: #5c4400;
}
.alerta-cais-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.alerta-cais ul { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.alerta-cais li { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 13px; }
.alerta-cais li em { font-style: normal; font-weight: 700; margin-left: auto; }
.alerta-cais small { display: block; margin-top: 6px; opacity: .8; }
body.dark .alerta-cais { background: #3a3317; border-color: #6b5d24; color: #f0dd9c; }
.nav-badge {
    margin-left: auto; min-width: 20px; padding: 1px 6px; border-radius: 999px; text-align: center;
    background: #d9822b; color: #fff; font-size: 11px; font-weight: 700; line-height: 18px;
}
.nav-badge[hidden] { display: none; }
.sidebar.collapsed .nav-badge { position: absolute; top: 4px; right: 6px; margin: 0; min-width: 16px; padding: 0 4px; font-size: 10px; line-height: 16px; }

/* Movimentações: filtros */
.mov-filtros { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; margin: -6px 0 16px; }
.mov-filtros label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: var(--texto-2); }
.mov-filtros input, .mov-filtros select {
    height: 38px; padding: 0 10px; border: 1px solid var(--borda); border-radius: 8px;
    background: var(--superficie); color: var(--texto); font-size: 14px; min-width: 0;
}
@media (max-width: 700px) {
    .mov-filtros { display: grid; grid-template-columns: 1fr 1fr; }
    .mov-filtros label:nth-child(4), .mov-filtros .btn { grid-column: 1 / -1; }
    .mov-filtros input, .mov-filtros select { width: 100%; font-size: 16px; }
}

/* Movimentações anuladas */
tr.mov-anulado td { color: var(--texto-2); text-decoration: line-through; text-decoration-color: rgba(0,0,0,.25); }
tr.mov-anulado td .sub-linha, tr.mov-anulado td.actions { text-decoration: none; }

/* Palete (código próprio) e sugestões de destino */
.loc-palete { margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; background: #dff0e3; color: #1f5a2b; font-family: ui-monospace, Consolas, monospace; }
body.dark .loc-palete { background: #1f3a26; color: #a9e1b5; }
.arr-sugestoes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0; }
.arr-sugestoes small { color: var(--texto-2); }
.chip-sugestao {
    display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 6px 10px; border-radius: 10px;
    border: 1px solid var(--verde); background: var(--superficie); color: var(--texto); cursor: pointer; text-align: left;
}
.chip-sugestao b { font-size: 14px; letter-spacing: .5px; }
.chip-sugestao span { font-size: 11px; color: var(--texto-2); }
.chip-sugestao:hover { background: var(--verde); color: #fff; }
.chip-sugestao:hover span { color: rgba(255,255,255,.85); }

/* Etiquetas: opção "identificar paletes" */
.etq-opcao { display: inline-flex; align-items: center; gap: 8px; color: #d4d6cb; font-size: 13px; font-weight: 600; cursor: pointer; }
.etq-opcao input { width: 18px; height: 18px; accent-color: #a3a678; }
.etqm-identificar { margin: 0 auto 0 12px; }
@media (max-width: 760px) { .etq-opcao { grid-column: 1 / -1; } .etqm-identificar { margin: 0; } }

/* ============================================================
   PEDIDOS DE PICKING
   ============================================================ */
.pedidos-grelha { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.pedido-card {
    display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; cursor: pointer;
    background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-sm);
}
.pedido-card:hover, .pedido-card:focus-visible { border-color: var(--verde); outline: none; }
.pedido-card.pedido-concluido, .pedido-card.pedido-cancelado { opacity: .75; }
.pedido-topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pedido-obra { font-size: 15px; font-weight: 600; }
.pedido-meta { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--texto-2); flex-wrap: wrap; }
.pedido-notas { font-size: 12px; color: var(--texto-2); }
.pedido-barra { height: 8px; border-radius: 999px; background: var(--borda); overflow: hidden; }
.pedido-barra span { display: block; height: 100%; background: var(--verde); border-radius: 999px; transition: width .3s; }

.ped-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 14px; }
.ped-codigo { font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--texto-2); }
.ped-obra-grande { font-size: 20px; font-weight: 700; }
.ped-progresso { min-width: 160px; text-align: right; }
.ped-progresso b { font-size: 22px; }
.ped-linhas-lista { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; }
.ped-linha-card { padding: 14px 16px; }
.ped-linha-card .ped-linha-topo { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; cursor: pointer; }
.ped-linha-card.ativa { border-color: var(--verde); box-shadow: 0 0 0 2px rgba(83, 87, 53, .25); }
.ped-linha-card.feita { opacity: .65; }
.ped-linha-card.feita header { cursor: default; }
.ped-qtds { text-align: right; white-space: nowrap; }
.ped-origens { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.ped-origens small { color: var(--texto-2); }
.chip-origem {
    display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 6px 12px; border-radius: 10px;
    border: 1px solid var(--borda); background: var(--superficie-2); color: var(--texto); cursor: pointer; text-align: left;
}
.chip-origem b { font-size: 14px; letter-spacing: .5px; }
.chip-origem span { font-size: 11px; color: var(--texto-2); }
.chip-origem.ativa { border-color: var(--verde); background: var(--verde); color: #fff; }
.chip-origem.ativa span { color: rgba(255,255,255,.85); }
.ped-separar { margin-top: 12px; padding: 12px; border-radius: 10px; background: var(--superficie-2); border: 1px dashed var(--verde); }
.ped-separar-origem { font-size: 14px; margin-bottom: 10px; }
.ped-separar-origem small { color: var(--texto-2); margin-left: 6px; }
.ped-separar-linha { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; }
.ped-separar-linha .qtd-linha { display: flex; gap: 8px; flex: 1 1 200px; min-width: 0; }
.ped-separar-linha .qtd-linha input { flex: 1 1 90px; min-width: 0; font-size: 16px; padding: 10px 12px; }
.ped-separar-linha .btn { min-width: 130px; justify-content: center; }

.ped-linha { display: grid; grid-template-columns: minmax(0, 1fr) 90px 90px 36px; gap: 8px; margin-bottom: 8px; }
.ped-linha input, .ped-linha select {
    min-width: 0; padding: 9px 10px; border: 1px solid var(--borda); border-radius: 8px; background: var(--superficie); color: var(--texto); font-size: 14px;
}
@media (max-width: 560px) {
    .ped-linha { grid-template-columns: 1fr 1fr 36px; }
    .ped-linha .ped-produto { grid-column: 1 / -1; }
    .ped-linha input, .ped-linha select { font-size: 16px; }
    .ped-cabecalho { align-items: flex-start; }
    .ped-progresso { text-align: left; width: 100%; }
    .ped-linha-card .ped-linha-topo { flex-direction: column; }
    .ped-qtds { text-align: left; }
    .ped-separar-linha .btn { width: 100%; }
}

/* Modal obrigatório (mudança da palavra-passe temporária): sem botão de fechar */
.modal.modal-obrigatorio .close-btn { display: none; }
.modal.modal-obrigatorio { backdrop-filter: blur(6px); }

/* Admin: criação de utilizador com envio de acesso por email */
.adm-opcao {
    display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 14px; padding: 12px 14px; cursor: pointer;
    border: 1px solid var(--borda); border-radius: 10px; background: var(--superficie-2); font-size: 14px;
}
.adm-opcao input { margin-top: 3px; width: 18px; height: 18px; accent-color: var(--verde); flex: 0 0 auto; }
.adm-opcao small { display: block; margin-top: 2px; color: var(--texto-2); font-weight: 400; }
.adm-acesso { display: grid; gap: 10px; margin: 14px 0; padding: 14px; border-radius: 10px; background: var(--superficie-2); border: 1px dashed var(--verde); }
.adm-acesso small { display: block; color: var(--texto-2); }
.adm-acesso code { font-size: 18px; letter-spacing: 1.5px; font-weight: 700; user-select: all; }

/* Aviso de nova versão (PWA) */
.aviso-versao {
    position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 7000;
    display: flex; align-items: center; gap: 14px; padding: 10px 14px; border-radius: 12px;
    background: #20221a; color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.35); font-size: 14px;
}
.aviso-versao button { border: 0; border-radius: 8px; padding: 8px 12px; background: #a3a678; color: #20221a; font-weight: 700; cursor: pointer; }

/* Login: "Esqueci a minha palavra-passe" */
.login-esqueci { margin: 14px 0 0; text-align: center; font-size: 13px; }
.login-esqueci a { color: inherit; opacity: .8; text-decoration: underline; text-underline-offset: 3px; }
.login-esqueci a:hover { opacity: 1; }
.login-painel { display: flex; flex-direction: column; gap: 10px; }
.login-painel-titulo { margin: 0; font-size: 18px; }
.login-painel-texto { margin: 0; font-size: 14px; line-height: 1.5; }
.login-painel-dica { display: block; margin-top: 4px; opacity: .7; font-size: 12px; }
.login-painel-msg { min-height: 18px; margin: 0; font-size: 13px; }
.login-painel-msg.erro { color: #c0392b; }

/* Login ⇄ recuperação: transição (o ecrã desliza e desvanece; os elementos entram em cascata) */
@keyframes loginEntraAvancar { from { opacity: 0; transform: translateX(22px); filter: blur(3px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes loginEntraRecuar  { from { opacity: 0; transform: translateX(-22px); filter: blur(3px); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes loginSaiAvancar   { from { opacity: 1; transform: none; filter: blur(0); } to { opacity: 0; transform: translateX(-16px); filter: blur(2px); } }
@keyframes loginSaiRecuar    { from { opacity: 1; transform: none; filter: blur(0); } to { opacity: 0; transform: translateX(16px); filter: blur(2px); } }
@keyframes loginFilho        { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.anim-entra-avancar { animation: loginEntraAvancar .34s cubic-bezier(.2, .8, .2, 1) both; }
.anim-entra-recuar  { animation: loginEntraRecuar .34s cubic-bezier(.2, .8, .2, 1) both; }
.anim-sai-avancar   { animation: loginSaiAvancar .17s ease-in both; pointer-events: none; }
.anim-sai-recuar    { animation: loginSaiRecuar .17s ease-in both; pointer-events: none; }
.anim-entra-avancar > *, .anim-entra-recuar > * { animation: loginFilho .4s cubic-bezier(.2, .8, .2, 1) both; }
.anim-entra-avancar > :nth-child(1), .anim-entra-recuar > :nth-child(1) { animation-delay: .04s; }
.anim-entra-avancar > :nth-child(2), .anim-entra-recuar > :nth-child(2) { animation-delay: .09s; }
.anim-entra-avancar > :nth-child(3), .anim-entra-recuar > :nth-child(3) { animation-delay: .14s; }
.anim-entra-avancar > :nth-child(4), .anim-entra-recuar > :nth-child(4) { animation-delay: .19s; }
.anim-entra-avancar > :nth-child(n+5), .anim-entra-recuar > :nth-child(n+5) { animation-delay: .24s; }
@media (prefers-reduced-motion: reduce) {
    .anim-entra-avancar, .anim-entra-recuar, .anim-sai-avancar, .anim-sai-recuar,
    .anim-entra-avancar > *, .anim-entra-recuar > * { animation: none; }
}

/* Rodapé (login e aplicação) */
.login-rodape p { margin: 2px 0; }
.login-rodape a { color: inherit; text-decoration: underline; text-underline-offset: 2px; opacity: .85; }
.login-rodape a:hover { opacity: 1; }
.rodape-app {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 18px;
    margin: 32px 0 8px; padding-top: 16px;
    border-top: 1px solid rgba(139, 139, 90, .25);
    font-size: 12px; color: var(--texto-2, #6b6f64);
}
.rodape-app a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.rodape-app a:hover { color: var(--verde, #535735); }
body.dark .rodape-app { color: #a6a998; }
@media print { .rodape-app { display: none; } }

/* Modal de Privacidade / Cookies */
.modal.modal-legal .modal-content { max-width: 760px; width: calc(100% - 32px); max-height: 85vh; overflow-y: auto; }
.legal-corpo h1 { margin: 0 0 4px; font-size: 22px; }
.legal-corpo h2 { margin: 22px 0 6px; font-size: 16px; }
.legal-corpo p, .legal-corpo li { font-size: 14px; line-height: 1.6; }
.legal-corpo ul { padding-left: 20px; }
.legal-corpo .atualizado { opacity: .7; font-size: 12.5px; margin: 0 0 10px; }
.legal-corpo a { color: var(--verde, #535735); }
body.dark .legal-corpo a { color: #c8cba0; }
.legal-corpo .tabela-rolar { overflow-x: auto; }
.legal-corpo table { width: 100%; border-collapse: collapse; font-size: 13px; }
.legal-corpo th, .legal-corpo td { text-align: left; padding: 7px 8px; border-bottom: 1px solid rgba(139, 139, 90, .3); vertical-align: top; }
.legal-a-carregar { opacity: .7; }

/* Rodapé fixo ao fundo da página: encosta ao fundo do ecrã quando o conteúdo é curto
   e fica depois do conteúdo quando é longo (nunca sobrepõe) */
.layout > main { display: flex; flex-direction: column; min-height: calc(100vh - var(--header-h, 80px)); min-height: calc(100dvh - var(--header-h, 80px)); }
.layout > main > * { flex-shrink: 0; }
.rodape-app { margin-top: auto; padding-top: 16px; }
.layout > main > .tab-content + .rodape-app, .layout > main > .rodape-app { margin-top: auto; }
@media (max-width: 600px) {
    .rodape-app { flex-direction: column; align-items: center; gap: 2px; text-align: center; margin-bottom: 0; }
}

/* Login: mostrar/ocultar palavra-passe */
.campo-password { position: relative; }
.campo-password input { padding-right: 44px; }
.ver-password {
    position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
    width: 34px; height: 34px; display: grid; place-items: center;
    background: transparent; border: 0; border-radius: 8px; cursor: pointer;
    color: var(--texto-2, #6b6f64); opacity: .75;
    transition: opacity .15s ease, background-color .15s ease;
}
.ver-password:hover, .ver-password:focus-visible { opacity: 1; background: rgba(139, 139, 90, .15); outline: none; }
/* palavra-passe oculta = olho fechado; visível = olho aberto */
.ver-password .olho-aberto { display: none; }
.ver-password.ativo .olho-fechado { display: none; }
.ver-password.ativo .olho-aberto { display: block; }

/* Faixa de luz a atravessar o cartão na transição (como o hover do botão "Iniciar sessão") */
.login-container { position: relative; isolation: isolate; }
.login-container::after {
    content: ''; position: absolute; inset: 0; z-index: 5; pointer-events: none;
    background: linear-gradient(105deg, transparent 30%, rgba(139, 139, 90, .22) 50%, transparent 70%);
    transform: translateX(-120%); opacity: 0;
}
body.dark .login-container::after {
    background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .10) 50%, transparent 70%);
}
.login-container.varrer-avancar { overflow: hidden; }
.login-container.varrer-recuar { overflow: hidden; }
.login-container.varrer-avancar::after { animation: loginVarrerAvancar .7s ease both; }
.login-container.varrer-recuar::after { animation: loginVarrerRecuar .7s ease both; }
@keyframes loginVarrerAvancar { from { transform: translateX(-120%); opacity: 1; } to { transform: translateX(120%); opacity: 1; } }
@keyframes loginVarrerRecuar  { from { transform: translateX(120%); opacity: 1; } to { transform: translateX(-120%); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .login-container::after { display: none; } }

/* Importação inteligente: tipo de documento detetado */
.import-tipo { border: 1px solid var(--borda, #e6e7e2); border-left: 4px solid #535735; border-radius: 10px; padding: 14px 16px; margin-bottom: 16px; background: var(--superficie, #fff); }
.import-tipo.atencao { border-left-color: #e67e22; background: rgba(230, 126, 34, .06); }
.import-tipo-topo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.import-tipo-etiqueta { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-2, #6b6f64); }
.import-tipo-conf { font-size: 12px; padding: 2px 8px; border-radius: 999px; background: rgba(83, 87, 53, .14); color: #535735; }
.import-tipo-sinais { margin: 6px 0 0; font-size: 12px; color: var(--texto-2, #6b6f64); }
.import-tipo-aviso { margin: 8px 0 0; font-size: 13px; color: #b9650f; font-weight: 600; }
.import-tipo-escolha { display: block; margin-top: 12px; font-size: 12px; color: var(--texto-2, #6b6f64); }
.import-tipo-escolha select { display: block; margin-top: 4px; min-width: 260px; max-width: 100%; }
.import-tipo-acao { margin: 8px 0 0; font-size: 13px; }
body.dark .import-tipo-conf { color: #c8cba0; background: rgba(200, 203, 160, .15); }
body.dark .import-tipo-aviso { color: #f0b36b; }

.int-tabela td { vertical-align: top; }
.int-tabela tr.linha-excluida { opacity: .45; }
.int-locs { min-width: 280px; }
.int-loc { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.int-loc select { flex: 1 1 auto; min-width: 0; }
.novo-chip { background: rgba(192, 57, 43, .12); color: #c0392b; }
.import-acoes { margin-top: 16px; display: flex; gap: 10px; }
.import-nota.erro { color: #c0392b; background: rgba(192, 57, 43, .08); border-color: rgba(192, 57, 43, .3); }