/* Fila de Cadastro ERP — cartão do cadastro automático e sua confirmação.
   Prefixo fcd-. Toda cor/estado nasce aqui; markup não carrega style=". */

/* ---- cartão ------------------------------------------------------------- */
.fcd-lista-topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin: 0 0 .75rem;
  color: #6c757d;
  font-size: .82rem;
}

.fcd-item {
  border-color: #dee2e6;
  background: #fff;
}
.fcd-item--ok { border-color: #b8e0c6; }
.fcd-item--ajuste { border-color: #ffe08a; }
.fcd-item--travado { border-color: #ffd8a8; }
.fcd-item .expander-header {
  align-items: center;
  gap: .75rem;
}
.fcd-resumo {
  display: flex;
  flex-direction: column;
  gap: .12rem;
  min-width: 0;
  flex: 1;
}
.fcd-resumo-linha {
  display: flex;
  align-items: center;
  gap: .35rem;
  min-width: 0;
}
.fcd-resumo-linha strong {
  overflow-wrap: anywhere;
  line-height: 1.25;
}
.fcd-resumo-meta {
  color: #6c757d;
  font-size: .76rem;
  line-height: 1.25;
}
.fcd-resumo-status {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .4rem;
  flex-wrap: wrap;
  max-width: 45%;
}
.fcd-badge,
.fcd-status {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  border-radius: 4px;
  border: 1px solid transparent;
  padding: .08rem .42rem;
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}
.fcd-badge--pref { background: #fff3bf; color: #664d03; border-color: #ffe08a; }
.fcd-badge--ajuste { background: #fff3bf; color: #664d03; border-color: #ffe08a; }
.fcd-status--pendente { background: #fff4e6; color: #9d5c00; border-color: #ffd8a8; }
/* Ja esta no ERP, mas ainda nao e um produto pronto: falta preco lancado a mao
   no Vexta. Nao pode usar o verde de "cadastrado" -- foi exatamente assim que o
   #95 passou meses parecendo concluido com os dois precos em branco. */
.fcd-status--travado { background: #fff4e6; color: #9d5c00; border-color: #ffd8a8; }
.fcd-status--ajuste { background: #fff3bf; color: #7a5b00; border-color: #ffe08a; }
.fcd-status--ok { background: #e7f5ec; color: #14653a; border-color: #a9d9bd; }
/* Cadastro e conferencia prontos, mas preco/fabricante mudou depois do cadastro
   e o criativo ainda nao deu ciencia. Azul: a espera e de outra pessoa, nao um
   problema deste analista. */
.fcd-status--ciencia { background: #e7f1ff; color: #1d4d84; border-color: #b6d4fe; }
.fcd-item--ciencia { border-color: #b6d4fe; }

.fcd-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(380px, .95fr);
  gap: .85rem;
  align-items: start;
}
.fcd-panel {
  border: 1px solid #e4e9ef;
  border-radius: 8px;
  background: #fff;
  padding: .75rem;
  min-width: 0;
}
.fcd-panel--erp {
  border-color: #b6d4fe;
  background: #f7fbff;
}
.fcd-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .65rem;
}
.fcd-panel-title {
  display: flex;
  align-items: center;
  gap: .35rem;
  font-size: .86rem;
  font-weight: 700;
  color: #212529;
}
.fcd-panel-sub {
  color: #6c757d;
  font-size: .72rem;
  line-height: 1.35;
  margin-top: .1rem;
}
.fcd-briefing-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: .85rem;
  align-items: start;
}
.fcd-briefing-info {
  line-height: 1.45;
  min-width: 0;
}
.fcd-briefing-media {
  min-height: 150px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.fcd-thumb-slot {
  width: 100%;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fcd-thumb-slot img {
  max-width: 100%;
  max-height: 180px;
  object-fit: contain;
  border-radius: 6px;
}
.fcd-observacao {
  margin-top: .45rem;
  padding: .45rem .55rem;
  border: 1px solid #d5dbe3;
  border-radius: 6px;
  background: #f8f9fa;
  color: #34495e;
}
.fcd-auditoria {
  margin-top: .55rem;
  color: #6c757d;
  font-size: .76rem;
}
.fcd-anexos {
  margin-top: .7rem;
}

.fcd-card {
  border: 1px solid #b6d4fe;
  background: #f5f9ff;
  border-radius: .5rem;
  padding: .75rem;
}
.fcd-card .card-title { margin-bottom: .5rem; }

.fcd-checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem;
  margin-bottom: .6rem;
}
.fcd-check {
  display: flex;
  align-items: flex-start;
  gap: .35rem;
  padding: .35rem .45rem;
  border: 1px solid #e4e9ef;
  border-radius: 6px;
  background: #fff;
  font-size: .74rem;
  min-width: 0;
}
.fcd-check .bi { margin-top: .08rem; color: #adb5bd; }
.fcd-check.ok .bi { color: #2b8a3e; }
.fcd-check.pend { border-color: #ffe08a; background: #fffaf0; }
.fcd-check b { color: #212529; }
.fcd-check small {
  display: block;
  color: #6c757d;
  font-size: .68rem;
  line-height: 1.25;
}

.fcd-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: .5rem;
}
.fcd-titulo {
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: #495057;
  margin: 0;
}

/* Onde o cadastro grava. Aparece SEMPRE, antes do botão — o analista nunca
   dispara sem saber a empresa/filial de destino. */
.fcd-destino {
  font-size: .7rem;
  padding: .12rem .45rem;
  border-radius: 4px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.fcd-destino--ok    { background: #e7f5ec; color: #14653a; border-color: #a9d9bd; }
.fcd-destino--erro  { background: #fdecec; color: #9d2b2b; border-color: #f0b4b4; }
.fcd-destino--carregando { background: #f1f3f5; color: #6c757d; border-color: #dee2e6; }

/* ---- campos ------------------------------------------------------------- */
.fcd-campos { margin-bottom: .5rem; }
.fcd-label {
  font-size: .74rem;
  font-weight: 600;
  color: #495057;
  margin-bottom: .1rem;
  display: block;
}
.fcd-obrig { color: #c92a2a; }

/* De onde vieram grade e medidas. Só aparece quando o briefing trouxe algo --
   o analista precisa saber que está conferindo, não digitando do zero. */
.fcd-origem { font-size: .72rem; color: #5a6b7d; margin: .35rem 0 .1rem; }
.fcd-origem b { color: #34495e; }

/* ---- recorte da grade ---------------------------------------------------- */
/* O select mostra so as grades que a categoria usa (3 em vez de 29). A nota diz
   qual e o recorte e abre a lista inteira -- sem ela o analista nao teria como
   saber que existe grade fora dali, nem como chegar nela. */
.fcd-grade-nota {
  font-size: .72rem;
  color: #5a6b7d;
  margin: -.18rem 0 .55rem;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .2rem .45rem;
}
.fcd-grade-nota b { color: #34495e; }

/* Recorte por falta de historico, nao por regra: a categoria simplesmente nao
   teve cadastro na janela. Cor diferente porque a acao do analista muda -- aqui
   ele escolhe sem rede, entao confere com mais cuidado. */
.fcd-grade-nota--aberta { color: #8a6d1f; }

.fcd-grade-link {
  border: 1px solid #cfe0f5;
  background: #fff;
  border-radius: 999px;
  padding: .05rem .42rem;
  font: inherit;
  color: #1c6fb8;
  text-decoration: none;
  cursor: pointer;
}
.fcd-grade-link:hover { color: #14508a; background: #f4f8ff; border-color: #9fc2ef; }
.fcd-grade-link:focus-visible { outline: 2px solid #1c6fb8; outline-offset: 2px; border-radius: 2px; }

/* ---- cadastrado no ERP --------------------------------------------------- */
/* Duas caras para o mesmo produto: azul quando ja passou na prova contra o
   Vexta, ambar quando falta preco ou colecao. Cor nunca informa sozinha -- o
   titulo e a lista de pendencias dizem o mesmo em texto. */
.fcd-cadastrado {
  border: 1px solid #cff4fc;
  background: #f2fbfd;
  border-radius: .5rem;
  padding: .75rem;
}
.fcd-cadastrado--travado { border-color: #ffd8a8; background: #fff9f2; }
.fcd-cadastrado-titulo {
  display: flex; align-items: center; gap: .35rem;
  font-size: .86rem; font-weight: 700; color: #212529; margin-bottom: .4rem;
}
.fcd-cadastrado--travado .fcd-cadastrado-titulo { color: #8a4b00; }

/* O que falta lancar no Vexta. Cada linha termina em acao, nao em diagnostico:
   quem le esta prestes a abrir o Vexta e resolver item a item. */
.fcd-falta { margin: .5rem 0 .1rem; }
.fcd-falta-titulo {
  font-size: .78rem; font-weight: 700; color: #8a4b00; margin-bottom: .25rem;
}
.fcd-falta-lista { list-style: none; margin: 0; padding: 0; }
.fcd-falta-item {
  display: flex; align-items: baseline; gap: .4rem;
  padding: .28rem .45rem;
  border: 1px solid #ffe3bf;
  border-radius: .3rem;
  background: #fff;
  font-size: .76rem;
  line-height: 1.35;
}
.fcd-falta-item + .fcd-falta-item { margin-top: .25rem; }
.fcd-falta-campo { font-weight: 700; color: #8a4b00; white-space: nowrap; }
.fcd-falta-acao { color: #495057; min-width: 0; }
.fcd-falta-onde { font-size: .72rem; color: #6c757d; margin-top: .35rem; }

.fcd-validar { margin-top: .55rem; display: flex; gap: .4rem; flex-wrap: wrap; }
.fcd-validar .btn { flex: 1 1 auto; }
.fcd-validar-res { margin-top: .45rem; }

/* ---- prova de preco (aba Concluidos) ------------------------------------ */
/* Briefing x Vexta lado a lado. Rotulo a esquerda, os dois valores a direita,
   cabecalho na mesma grade das celulas. Cor nunca informa sozinha: todo estado
   tem icone e texto. */
.fcd-prova { margin-top: .5rem; }
.fcd-prova-cab {
  display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap;
  margin-bottom: .3rem;
}
.fcd-prova-estado { font-size: .78rem; font-weight: 700; }
.fcd-prova-estado--ok     { color: #2b8a3e; }
.fcd-prova-estado--alerta { color: #b45309; }
.fcd-prova-estado--mudo   { color: #6b7280; }
.fcd-prova-frescor { font-size: .7rem; color: #6b7280; margin-left: auto; }

.fcd-prova-tab { width: 100%; font-size: .76rem; border-collapse: collapse; }
.fcd-prova-tab th {
  font-size: .66rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; color: #868e96; padding: .15rem .35rem;
  border-bottom: 1px solid #dee2e6;
}
.fcd-prova-tab td { padding: .22rem .35rem; border-bottom: 1px solid #f1f3f5; }
.fcd-prova-tab th:first-child, .fcd-prova-tab td:first-child { text-align: left; }
.fcd-prova-tab th:not(:first-child), .fcd-prova-tab td:not(:first-child) { text-align: right; }
.fcd-prova-tab tr:last-child td { border-bottom: none; }
.fcd-prova-rot { color: #495057; font-weight: 600; }
/* Dinheiro nao quebra linha: em 375px o "R$ 118,00" partia em duas e a coluna
   deixava de ler como numero. Se faltar largura, quem rola e a tabela dentro
   do proprio card -- a pagina nunca. */
.fcd-prova-val { font-variant-numeric: tabular-nums; white-space: nowrap; }
.fcd-prova-tabwrap { overflow-x: auto; }
.fcd-prova-val--diverge { color: #c92a2a; font-weight: 700; }
.fcd-prova-val--falta   { color: #b45309; font-weight: 600; }
.fcd-prova-val--mudo    { color: #868e96; }
.fcd-prova-acao { font-size: .72rem; color: #b45309; margin-top: .35rem; }
.fcd-prova-acao--ok { color: #2b8a3e; }
.fcd-prova-erro { font-size: .72rem; color: #b45309; margin-top: .3rem; }
/* Nota da linha: por que o numero do ERP e aquele. Ocupa a largura toda, sob a
   linha que explica, e nao come a coluna de valor. */
.fcd-prova-nota td {
  font-size: .69rem; color: #6b7280; text-align: left !important;
  padding: 0 .35rem .28rem; line-height: 1.3;
}

/* ---- lancar preco no ERP ------------------------------------------------ */
/* A acao principal do que falta: em vez de mandar a pessoa digitar no Vexta, o
   PCPFlow grava. Fica dentro da caixa do que falta, colada na lista. */
.fcd-lancar { margin-top: .45rem; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.fcd-lancar-nota { font-size: .7rem; color: #6c757d; }
.fcd-lancar-res { font-size: .74rem; margin-top: .35rem; }

/* Precos que vao ao ERP na conferencia e no resultado. Rotulo a esquerda,
   valor a direita, tabular para as casas alinharem. */
.fcd-precos { display: flex; flex-direction: column; gap: .1rem; }
.fcd-precos-linha {
  display: flex; justify-content: space-between; gap: .6rem;
  font-size: .76rem; line-height: 1.35;
}
.fcd-precos-rot { color: #495057; }
.fcd-precos-val {
  font-variant-numeric: tabular-nums; font-weight: 600;
  /* Em 375px o 'R$' se soltava do numero e a linha virava duas. */
  white-space: nowrap;
}
.fcd-precos-val--vazio { color: #b45309; font-weight: 600; }
/* Produto de promocao grava o mesmo valor no promocional. O par anda junto do
   preco, em peso menor: quem le confere de um golpe que os dois sao iguais. */
.fcd-precos-promo {
  margin-left: .45rem; font-weight: 400; color: #6c757d;
  font-size: .72rem;
}

/* ---- cores -------------------------------------------------------------- */
.fcd-cores { margin-bottom: .5rem; font-size: .78rem; }
.fcd-chip {
  display: inline-block;
  font-size: .72rem;
  padding: .1rem .4rem;
  border-radius: 4px;
  margin: 0 .25rem .25rem 0;
  border: 1px solid transparent;
}
.fcd-chip--ok   { background: #e7f5ec; color: #14653a; border-color: #a9d9bd; }
.fcd-chip--erro { background: #fdecec; color: #9d2b2b; border-color: #f0b4b4; }

/* ---- pendências: o que a rotina NÃO faz -------------------------------- */
.fcd-pend {
  border: 1px solid #ffe08a;
  background: #fffbf0;
  border-radius: .375rem;
  padding: .5rem .6rem;
  margin-bottom: .5rem;
}
.fcd-pend-titulo {
  font-size: .74rem;
  font-weight: 700;
  color: #7a5b00;
  margin-bottom: .3rem;
}
.fcd-pend-item {
  font-size: .74rem;
  color: #5c4700;
  padding: .18rem 0;
  border-top: 1px solid #ffe9b0;
}
.fcd-pend-item:first-of-type { border-top: 0; }
.fcd-pend-campo { font-weight: 600; }
.fcd-pend-acao { color: #7a5b00; }

/* ---- resultado ---------------------------------------------------------- */
.fcd-result { margin-top: .5rem; }
.fcd-result-box {
  border-radius: .375rem;
  padding: .5rem .6rem;
  font-size: .78rem;
}
.fcd-result-box--ok   { border: 1px solid #a9d9bd; background: #f0fbf4; color: #14653a; }
.fcd-result-box--erro { border: 1px solid #f0b4b4; background: #fdf4f4; color: #9d2b2b; }
.fcd-result-box--aviso{ border: 1px solid #ffe08a; background: #fffbf0; color: #7a5b00; }
.fcd-codigo {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 1rem;
  font-weight: 700;
}

/* Descrição copiável: o tracejado avisa que dá para clicar. */
.fcd-desc-copy {
  cursor: pointer;
  border-bottom: 1px dashed #adb5bd;
}
.fcd-desc-icone { font-size: .75rem; }

/* ---- ajuste de descrição e preços na própria fila -----------------------
   Modo leitura é o normal; a edição é exceção e por isso fica atrás de um
   botão. Os campos ocupam o mesmo lugar do texto que substituem, para o olho
   não ter de reencontrar a informação. */
.fcd-edit-abrir {
  margin-left: .4rem;
  padding: 0 .3rem;
  border: 0;
  background: none;
  color: #0d6efd;
  font-size: .72rem;
  cursor: pointer;
}
.fcd-edit-abrir:hover { text-decoration: underline; }
.fcd-edit {
  margin: .25rem 0 .5rem;
  padding: .55rem .6rem;
  border: 1px solid #b6d4fe;
  border-radius: .375rem;
  background: #f6faff;
}
.fcd-edit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
  gap: .4rem;
  margin-top: .45rem;
}
.fcd-edit-campo { min-width: 0; }
.fcd-edit-acoes { display: flex; gap: .4rem; margin-top: .55rem; }
.fcd-edit-nota { margin-top: .4rem; font-size: .72rem; color: #5a6b7d; }
.fcd-edit-erro { margin-top: .4rem; }

/* ---- caminho manual, secundário ----------------------------------------
   O cadastro automático é o caminho normal. O registro manual continua vivo —
   é a saída quando o ERP não responde e para categoria sem faixa de código —
   mas fechado, para não competir com o botão principal. */
.fcd-manual { margin-top: .75rem; }
.fcd-manual > summary {
  cursor: pointer;
  list-style: none;
  padding: .4rem .6rem;
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  background: #f8f9fa;
  font-size: .78rem;
  font-weight: 600;
  color: #495057;
}
.fcd-manual > summary::-webkit-details-marker { display: none; }
.fcd-manual > summary::before { content: "▸ "; }
.fcd-manual[open] > summary::before { content: "▾ "; }
.fcd-manual > summary:hover { background: #eef1f4; }
.fcd-manual-corpo {
  border: 1px solid #dee2e6;
  border-top: 0;
  border-radius: 0 0 .375rem .375rem;
  padding: .6rem;
}
.fcd-manual-motivo {
  margin-bottom: .5rem;
  font-size: .74rem;
  color: #7a5b00;
}

/* Devolver ao Criativo não é cadastro: fica separado dos dois caminhos. */
.fcd-devolver {
  margin-top: .75rem;
  padding-top: .6rem;
  border-top: 1px solid #e9ecef;
}

/* ---- mão de obra --------------------------------------------------------
   O campo do valor só existe quando a caixa está marcada, recuado sob ela para
   ler como consequência da marcação, e não como mais um campo do formulário. */
.fcd-mdo {
  margin: .1rem 0 .5rem 1.6rem;
  padding: .45rem .55rem;
  border-left: 2px solid #b6d4fe;
  background: #f6faff;
  border-radius: 0 .25rem .25rem 0;
}
.fcd-mdo-linha { display: flex; align-items: center; gap: .5rem; }
.fcd-mdo-linha .fcd-label { margin: 0; white-space: nowrap; }
.fcd-mdo-valor { max-width: 8rem; }
.fcd-mdo-nota { margin-top: .3rem; font-size: .72rem; color: #5a6b7d; }
.fcd-mdo-nota b { color: #34495e; }

/* ---- MPC: material composto do produto de mao de obra --------------------
   Sub-bloco do MDO no fluxo novo, e bloco proprio no retroativo (produto ja
   cadastrado sem MPC). O campo de sufixo so aparece quando o codigo padrao ja
   esta ocupado — o prefixo do grupo MPC e fixo e visivel. */
.fcd-mpc {
  margin: .35rem 0 .1rem 1.6rem;
  padding: .45rem .55rem;
  border-left: 2px solid #b6d4fe;
  background: #f6faff;
  border-radius: 0 .25rem .25rem 0;
}
.fcd-mpc-linha { display: flex; align-items: center; gap: .5rem; }
.fcd-mpc-linha .fcd-label { margin: 0; white-space: nowrap; }
.fcd-mpc-preco { max-width: 8rem; }
.fcd-mpc-nota { margin-top: .3rem; font-size: .72rem; color: #5a6b7d; }
.fcd-mpc-nota b { color: #34495e; }
.fcd-mpc-retro { margin-top: .6rem; }
.fcd-mpc-retro > summary {
  cursor: pointer;
  list-style: none;
  font-size: .76rem;
  font-weight: 600;
  color: #495057;
}
.fcd-mpc-retro > summary::-webkit-details-marker { display: none; }
.fcd-mpc-retro > summary::before { content: "▸ "; }
.fcd-mpc-retro[open] > summary::before { content: "▾ "; }
.fcd-mpc-retro-corpo {
  margin-top: .4rem;
  padding: .5rem .55rem;
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  background: #f8f9fa;
}
.fcd-mpc-sufixo { display: flex; align-items: center; gap: .3rem; margin-top: .45rem; }
.fcd-mpc-sufixo-prefixo {
  font-family: var(--bs-font-monospace, monospace);
  font-size: .82rem;
  color: #5a6b7d;
  background: #eef1f4;
  border: 1px solid #dee2e6;
  border-radius: .25rem;
  padding: .22rem .4rem;
}
.fcd-mpc-sufixo input { max-width: 5.5rem; }
.fcd-mpc-ocupado {
  margin-top: .45rem;
  padding: .4rem .5rem;
  border: 1px solid #ffd8a8;
  background: #fff9f0;
  color: #9d5c00;
  border-radius: .375rem;
  font-size: .76rem;
}

/* ---- fornecedores na conferência ---------------------------------------- */
.fcd-forn { margin-top: .1rem; }
.fcd-forn-linha {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: .15rem 0;
}
.fcd-forn-quem { min-width: 0; overflow-wrap: anywhere; }
.fcd-forn-papel { color: #6c7a89; font-size: .72rem; }
.fcd-forn-valor {
  flex: none;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

/* ---- erro classificado --------------------------------------------------
   Título = o que houve. Ação = o que fazer. O texto cru da API vive só dentro
   do <details>, fechado — nunca no parágrafo. */
.fcd-erro-titulo { font-weight: 600; }
.fcd-erro-acao   { margin-top: .15rem; }
.fcd-erro-tec    { margin-top: .35rem; font-size: .72rem; }
.fcd-erro-tec > summary {
  cursor: pointer;
  opacity: .75;
  list-style: none;
}
.fcd-erro-tec > summary::-webkit-details-marker { display: none; }
.fcd-erro-tec > summary::before { content: "▸ "; }
.fcd-erro-tec[open] > summary::before { content: "▾ "; }
.fcd-erro-tec pre {
  margin: .3rem 0 0;
  padding: .35rem .45rem;
  border-radius: .25rem;
  background: rgba(0, 0, 0, .05);
  font-size: .7rem;
  white-space: pre-wrap;
  word-break: break-word;
}
.fcd-erro-inline { color: #9d2b2b; }

/* ---- conferência antes de gravar --------------------------------------- */
.fcd-conf-linha {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .3rem 0;
  border-top: 1px solid #edf0f2;
  font-size: .82rem;
}
.fcd-conf-linha:first-of-type { border-top: 0; }
.fcd-conf-rotulo { color: #6c757d; }
.fcd-conf-valor  { font-weight: 600; text-align: right; }
.fcd-conf-nota   { font-weight: 400; font-size: .72rem; color: #6c757d; }
.fcd-conf-aviso {
  border: 1px solid #f0b4b4;
  background: #fdf4f4;
  color: #9d2b2b;
  border-radius: .375rem;
  padding: .5rem .6rem;
  font-size: .8rem;
  margin-top: .6rem;
}
.fcd-conf-json {
  max-height: 260px;
  overflow: auto;
  font-size: .68rem;
  line-height: 1.35;
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: .25rem;
  padding: .5rem;
  margin: 0;
}

/* ---- mudanca esperando ciencia do criativo ------------------------------ */
.fcd-ciencia-nota {
  margin-top: .5rem;
  padding: .45rem .55rem;
  border: 1px solid #b6d4fe;
  border-radius: .375rem;
  background: #eef5ff;
  color: #1d4d84;
  font-size: .76rem;
}

/* ---- filtros da aba Concluidos ------------------------------------------
   O historico inteiro nao cabe na tela nem na paciencia: por padrao chegam os
   20 mais recentes, e estes filtros recortam o resto. */
.fcd-filtros {
  border: 1px solid #e4e9ef;
  border-radius: 8px;
  background: #fff;
  padding: .6rem .7rem;
  margin-bottom: .75rem;
}
.fcd-filtros-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
  gap: .5rem;
  align-items: end;
}
.fcd-filtro-campo { min-width: 0; }
.fcd-filtro-campo .fcd-label { margin-bottom: .15rem; }
.fcd-filtros-rodape {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  flex-wrap: wrap;
  margin-top: .5rem;
}
.fcd-filtro-ativo {
  font-size: .76rem;
  color: #1d4d84;
}
.fcd-mais { margin-top: .6rem; }
.fcd-recorte {
  margin-top: .75rem;
  font-size: .74rem;
  color: #6c757d;
}

/* ---- responsivo --------------------------------------------------------- */
@media (max-width: 575.98px) {
  .fcd-lista-topo,
  .fcd-head { flex-direction: column; align-items: stretch; }
  .fcd-filtros-grid { grid-template-columns: 1fr 1fr; }
  /* No telefone o nome do produto e os selos disputavam a mesma linha: sobravam
     ~60px para o titulo e, com `overflow-wrap: anywhere`, ele quebrava letra a
     letra ("BOLS / A / MEDI / A"). Selo desce para a linha de baixo. */
  .fcd-item .expander-header { flex-wrap: wrap; align-items: flex-start; }
  .fcd-resumo { flex: 1 1 100%; }
  .fcd-resumo-linha { flex-wrap: wrap; }
  .fcd-resumo-linha strong { overflow-wrap: break-word; }
  .fcd-resumo-status { max-width: none; justify-content: flex-start; }
  .fcd-layout,
  .fcd-briefing-grid,
  .fcd-checks { grid-template-columns: 1fr; }
  .fcd-briefing-media { min-height: 0; }
  .fcd-conf-linha { flex-direction: column; gap: 0; }
  .fcd-conf-valor { text-align: left; }
}

@media (max-width: 1100px) {
  .fcd-layout { grid-template-columns: 1fr; }
  .fcd-resumo-status { max-width: none; }
}

/* ---- campo que so pode ser lido ------------------------------------------ */
/* A descricao de um produto que ja existe no ERP: ela ja e o nome de la, e
   trocar aqui faria briefing e ERP contarem historias diferentes. Cinza porque
   `readonly` sozinho tem a mesma cara de um campo editavel. */
.fcd-edit textarea[readonly], .fcd-edit input[readonly] {
  background: #f1f3f5; color: #5a6b7d; cursor: default;
}
.fcd-label-nota { font-weight: 400; color: #6c757d; text-transform: none; letter-spacing: 0; }