/* ──────────────────────────────────────────────────────────────────────────
   Modo STREAM — esconde o que identifica catalogo e fornecedor.
   ==========================================================================

   Para que serve
   --------------
   Gravar video, dar suporte com a tela compartilhada ou apresentar o sistema
   sem entregar de graca QUAIS produtos o vendedor vende, com qual variacao e
   por qual loja. O resto da tela continua intacto: numero do pedido, valor,
   status, filas e prazos seguem visiveis, que e o que se quer demonstrar.

   Por que texto e redigido, e nao desfocado
   -----------------------------------------
   Desfoque em texto curto e reversivel na pratica: basta pausar o video e
   olhar de perto, e nomes de produto tem forma muito caracteristica. Aqui o
   texto vira transparente (o glifo nunca chega a ser pintado) e uma barra
   solida ocupa o lugar. Nao ha pixel de origem para recuperar.

   Foto e desfocada de verdade (blur alto + escala) porque uma barra solida
   sobre a miniatura quebraria o alinhamento das linhas da grade.
   ────────────────────────────────────────────────────────────────────────── */

/* Barra solida no lugar do texto.
   O comprador entra aqui junto do produto: gravar a tela da conta real expoe
   nome, cidade e telefone de pessoas que nunca consentiram em aparecer num
   video publico. E dado de terceiro, nao segredo comercial — some por padrao.

   A barra usa cor FIXA, nao `currentColor`. A versao anterior fazia
   `color: transparent` e `background-color: currentColor` na mesma regra —
   e `currentColor` resolve justamente para `color`, ou seja, transparente. O
   texto sumia mas a barra nunca era desenhada. O efeito parecia certo (o dado
   nao aparece) e por isso passou na verificacao, mas uma coluna simplesmente
   VAZIA se le como defeito do sistema; a barra se le como "escondido de
   proposito", que e a mensagem certa para quem esta assistindo. */
.modo-stream .lx-stream-texto,
.modo-stream .orders-product-name,
.modo-stream .orders-product-meta,
.modo-stream .orders-store-chip > span,
.modo-stream .orders-recipient,
.modo-stream .orders-recipient-line,
.modo-stream .orders-recipient-chip,
.modo-stream .orders-more-items {
    color: transparent !important;
    /* Cinza neutro: legivel como tarja no tema claro e no escuro, sem virar
       bloco preto pesado no meio da grade. */
    background-color: rgba(100, 116, 139, 0.32);
    border-radius: 0.25rem;
    user-select: none;
    text-decoration: none !important;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

/* O link do nome do produto nao deve mais parecer clicavel: durante uma
   transmissao, clicar abriria a pagina do pedido com tudo aberto. */
.modo-stream .orders-product-name,
.modo-stream .orders-recipient {
    pointer-events: none;
    cursor: default;
}

/* Botao de copiar ao lado do telefone: copiaria o dado mascarado para a area
   de transferencia e um Ctrl+V ao vivo entregaria tudo. */
.modo-stream .orders-recipient-copy {
    pointer-events: none;
    opacity: 0.35;
}

/* Foto do produto. A escala evita a borda translucida que o blur cria ao
   puxar pixels de fora do elemento. */
.modo-stream .orders-product img,
.modo-stream .lx-stream-imagem,
.modo-stream .lx-stream-imagem img {
    filter: blur(12px) saturate(0.4);
    transform: scale(1.12);
    /* Sem isto o desfoque transborda para as celulas vizinhas. */
    clip-path: inset(0 round 0.35rem);
    pointer-events: none;
}

/* Detalhe do pedido e catalogo: os mesmos dados aparecem com outra marcacao,
   entao ganham marcadores explicitos nas views. */
/* Mesma cor fixa da regra de cima — `currentColor` aqui resolveria para o
   `color: transparent` da propria regra e a tarja nunca seria pintada. */
.modo-stream [data-stream="produto"],
.modo-stream [data-stream="loja"],
.modo-stream [data-stream="comprador"] {
    color: transparent !important;
    background-color: rgba(100, 116, 139, 0.32);
    border-radius: 0.25rem;
    user-select: none;
    text-decoration: none !important;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

.modo-stream [data-stream="foto"],
.modo-stream [data-stream="foto"] img {
    filter: blur(12px) saturate(0.4);
    transform: scale(1.12);
    clip-path: inset(0 round 0.35rem);
    pointer-events: none;
}

/* CAMPO DE FORMULARIO com dado ja preenchido.
   ---------------------------------------------------------------------------
   O modulo do afiliado trouxe um caso que as telas de pedido nao tinham: o
   dado sensivel dentro de um <input>. CNPJ do emitente, inscricao municipal,
   e-mail do contador e razao social do tomador ficam em campo preenchido, e
   `color: transparent` num input esconde o texto mas deixa o campo com cara
   de vazio — que se le como "o sistema perdeu meu cadastro".

   A tarja aqui e o proprio fundo do campo, com o texto transparente por cima.
   O caret continua funcionando: quem esta gravando ainda consegue clicar e
   editar, so nao mostra o conteudo. Ao focar, o dado volta — a pessoa precisa
   conferir o que digita, e nesse instante ela sabe que esta expondo. */
.modo-stream .lx-stream-campo {
    color: transparent !important;
    text-shadow: none;
    background-image: linear-gradient(rgba(100, 116, 139, 0.32), rgba(100, 116, 139, 0.32));
    background-clip: content-box;
    caret-color: #64748b;
}
.modo-stream .lx-stream-campo:focus {
    color: inherit !important;
    background-image: none;
}
/* Placeholder continua visivel: ele nao e dado, e instrucao. */
.modo-stream .lx-stream-campo::placeholder { color: #94a3b8; opacity: 1; }

/* Aviso permanente de que a tela esta mascarada. Existe para o proprio dono
   nao esquecer o modo ligado e concluir que o sistema quebrou — e para quem
   assiste entender que a omissao e proposital, nao falha de carregamento. */
.modo-stream .lx-stream-selo {
    display: inline-flex !important;
}

.lx-stream-selo {
    display: none;
    align-items: center;
    gap: 0.35rem;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: rgba(79, 70, 229, 0.12);
    color: #4f46e5;
    border: 1px solid rgba(79, 70, 229, 0.35);
}

/* Estado ligado do proprio botao, para o dono saber onde desligar. */
.sf-topbar-icon.lx-stream-ativo {
    color: #4f46e5;
    background: rgba(79, 70, 229, 0.12);
}

/* Impressao: etiqueta e DANFE precisam do dado verdadeiro. Mascarar aqui
   entregaria pacote com etiqueta ilegivel ao cliente. */
@media print {
    .modo-stream .orders-product-name,
    .modo-stream .orders-product-meta,
    .modo-stream .orders-store-chip > span,
    .modo-stream .orders-recipient,
    .modo-stream .orders-recipient-line,
    .modo-stream .orders-recipient-chip,
    .modo-stream .orders-more-items,
    .modo-stream .lx-stream-texto,
    .modo-stream [data-stream="produto"],
    .modo-stream [data-stream="loja"],
    .modo-stream [data-stream="comprador"] {
        color: inherit !important;
        background-color: transparent;
        opacity: 1;
    }

    .modo-stream .orders-product img,
    .modo-stream .lx-stream-imagem,
    .modo-stream .lx-stream-imagem img,
    .modo-stream [data-stream="foto"],
    .modo-stream [data-stream="foto"] img {
        filter: none;
        transform: none;
    }
}
