/* Tabela de produtos (parte de style.css) */
/* ============================================================
   TABELA DE PRODUTOS
   ============================================================ */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
#tab-produtos td { vertical-align: middle; }
#tab-produtos th, #tab-produtos td { padding: 12px 16px; }

.cel-sku { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cel-nome { min-width: 260px; max-width: 520px; }
.prod-nome { font-weight: 600; line-height: 1.35; }
.prod-sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin-top: 4px;
    font-size: 12px;
    color: var(--texto-2);
}
.prod-cor {
    padding: 1px 8px;
    border-radius: 999px;
    border: 1px solid var(--borda);
    background: var(--superficie-2);
    font-weight: 600;
    color: var(--texto);
}
.cel-vazia { color: var(--texto-2); opacity: 0.7; }

/* Marca: logótipo (preto) sobre um azulejo branco + nome */
.marca-chip { display: inline-flex; align-items: center; gap: 10px; }
.marca-logo {
    width: 86px;
    height: 34px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #fff;
    border: 1px solid var(--borda, #e6e7e2);
    border-radius: 8px;
}
.marca-logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: brightness(0); /* os ficheiros são brancos (para fundos escuros): aqui ficam pretos */
}
.marca-nome { font-size: 13px; font-weight: 500; white-space: nowrap; }
.marca-texto-chip {
    display: inline-block;
    padding: 5px 11px;
    border-radius: 8px;
    border: 1px solid var(--borda);
    background: var(--superficie-2);
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
}

/* Stock */
.cel-stock { white-space: nowrap; }
.stock-valor { font-weight: 700; font-variant-numeric: tabular-nums; }
.stock-valor .un { margin-left: 4px; font-weight: 500; color: var(--texto-2); }
.stock-zero .stock-valor { color: var(--texto-2); font-weight: 600; }

/* Localização */
.loc-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 7px;
    background: #eef0e4;
    color: #535735;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    white-space: nowrap;
}
.loc-chip i { font-style: normal; font-weight: 400; color: #9a9d7c; }
body.dark .loc-chip { background: #343828; color: #c8cda8; }
body.dark .loc-chip i { color: #7c8160; }

/* Ações: botões só com ícone */
.actions-icones { justify-content: flex-end; gap: 6px; white-space: nowrap; }
.actions .btn-icone {
    width: 34px;
    height: 34px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
}
.actions .btn-icone svg { width: 16px; height: 16px; }
.lista-vazia { padding: 34px 16px; text-align: center; color: var(--texto-2); }


/* Cais de Descarga / produtos por arrumar */
.loc-chip.loc-cais { background: #fdf0dd; color: #a35a0b; }
.loc-chip.loc-cais i { color: #d19a52; }
body.dark .loc-chip.loc-cais { background: rgba(230, 126, 34, 0.18); color: #f0b36b; }
body.dark .loc-chip.loc-cais i { color: #c58a3e; }
.filtro-cais { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.filtro-cais .contagem {
    min-width: 20px;
    padding: 1px 7px;
    border-radius: 999px;
    background: rgba(230, 126, 34, 0.18);
    color: #a35a0b;
    font-weight: 700;
    font-size: 12px;
    text-align: center;
}
.filtro-cais.ativo { background: #535735; color: #fff; }
.filtro-cais.ativo .contagem { background: rgba(255, 255, 255, 0.2); color: #fff; }
.check-linha {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 16px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fdf6ea;
    border: 1px solid #f1dcb8;
    font-size: 13px;
    color: #6b4a1a;
    cursor: pointer;
}
.check-linha input { accent-color: #535735; width: 16px; height: 16px; }
body.dark .check-linha { background: rgba(230, 126, 34, 0.1); border-color: rgba(230, 126, 34, 0.3); color: #f0b36b; }