.cotacoes-perdidas-vendas {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cotacoes-perdidas-vendas__erro {
  padding: 12px;
  background: var(--danger-bg);
  color: var(--danger-text);
  border-radius: 8px;
  border: 1px solid var(--danger-border);
}

.cotacoes-perdidas-vendas__vazio {
  padding: 12px;
  background: var(--color-surface);
  color: var(--color-muted);
  border-radius: 8px;
  border: 1px solid var(--color-border);
  text-align: center;
}

.cotacoes-perdidas-vendas__grade {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 10px;
  overflow-x: auto;
  padding: 0;
}

.cotacoes-perdidas-vendas__tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: 10px;
}

.cotacoes-perdidas-vendas__tabela thead th {
  text-align: left;
  color: var(--color-muted);
  padding: 8px 10px;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg-strong);
  font-weight: 700;
  white-space: nowrap;
}

.cotacoes-perdidas-vendas__tabela tbody td {
  padding: 6px 10px;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-ink);
  word-break: break-word;
}

.cotacoes-perdidas-vendas__tabela tbody tr:hover {
  background: var(--color-surface-panel);
}

.cotacoes-perdidas-vendas__paginacao {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px;
  background: var(--color-surface);
  border-top: 1px solid var(--color-border);
  margin-top: 0;
}

.cotacoes-perdidas-vendas__btn-paginacao {
  height: 26px;
  padding: 0 12px;
  border-radius: 7px;
  border: 1px solid var(--color-border);
  background: var(--color-bg);
  color: var(--color-ink);
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
}

.cotacoes-perdidas-vendas__btn-paginacao:hover:not(:disabled) {
  background: var(--color-surface-panel);
  border-color: var(--color-border-soft);
}

.cotacoes-perdidas-vendas__btn-paginacao:disabled {
  color: var(--color-disabled);
  cursor: not-allowed;
  background: var(--color-bg-strong);
}

.cotacoes-perdidas-vendas__info-pagina {
  font-size: 10px;
  color: var(--color-muted);
  white-space: nowrap;
}

/* Badge "EMP. {N}" — mesmo formato literal já usado no drill-down de KPI
   da Visão Geral, valores copiados do inline style existente, não
   aproximados. (Cotações Abertas deixou de ter a coluna Empresa em
   23/09/2026, telas-vendas-do-python-novo.) */
.cotacoes-perdidas-vendas__badge-empresa {
  font-size: 8.5px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--success-bg);
  color: var(--success-text);
}

/* "Valor Perdido" — cor de atenção copiada literalmente do painel Python
   original (static/js/main.js, loadCotacoesPerdidas: "color: var(--danger-border)"
   aplicado à coluna valor_total), não uma aproximação nova de paleta. */
.cotacoes-perdidas-vendas__valor-perdido {
  font-weight: 700;
  color: var(--danger-border);
}

/* ── Painel (telas-vendas-do-python-novo, bloco 5) ─────────────────────
   Medidas do Python de 23/09/2026 (N/static/css/style.css:1722-1818). Os
   blocos comuns (card, indicador, barras, tabela) estão em
   painel-cotacoes-vendas.css; aqui ficam só as grades desta tela. */

.cotacoes-perdidas-vendas__painel {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Faixa de cima: indicadores · Produto · Vendedor Interno · Vendedor
   Externo — :1722-1734 */
.cotacoes-perdidas-vendas__faixa-cima {
  display: grid;
  grid-template-columns: 155px minmax(320px, 1.4fr) minmax(220px, 1fr) minmax(220px, 1fr);
  gap: 10px;
  min-height: 248px;
}

/* Indicadores empilhados — :1736-1746 */
.cotacoes-perdidas-vendas__kpis {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__kpi {
  height: 74px;
  padding: 6px 4px;
}

/* A coluna tem 155px, como no Python, e os números daqui são os maiores do
   painel: "R$ 282.090.963,64" e "7.995.369,52" (Qtde Itens com fração) passavam
   4px de cada lado do cartão no tamanho comum do painel. Medido no pixel em
   29/09/2026. */
.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__kpi .painel-cotacoes-vendas__kpi-numero {
  font-size: 1.25rem;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__kpi .painel-cotacoes-vendas__kpi-numero--moeda {
  font-size: 0.95rem;
}

/* Cards Produto / Vendedores — :1748-1777 */
.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__card-barras {
  height: 248px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__barras-produto,
.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__barras-vendedor {
  max-height: 210px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__barras-produto .painel-cotacoes-vendas__barra {
  grid-template-columns: minmax(110px, 150px) 1fr auto;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__barras-vendedor .painel-cotacoes-vendas__barra {
  grid-template-columns: minmax(75px, 105px) 1fr auto;
}

/* Faixa de baixo: Motivo · matriz por cliente — :1779-1818 */
.cotacoes-perdidas-vendas__faixa-baixo {
  display: grid;
  grid-template-columns: 52% 48%;
  gap: 10px;
  min-height: 325px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__card-motivo {
  height: 325px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__barras-motivo {
  max-height: 285px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__barras-motivo .painel-cotacoes-vendas__barra {
  grid-template-columns: minmax(130px, 175px) 1fr auto;
}

/* Aviso do motivo vazio: abaixo das barras, dentro do card. */
.cotacoes-perdidas-vendas__aviso-motivo {
  margin: 6px 0 0;
  font-size: 0.72rem;
  color: var(--color-muted);
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__card-matriz {
  height: 325px;
  padding: 0;
  overflow: hidden;
}

/* Colunas da matriz — N/templates/index.html:1899-1901 */
.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__matriz-cliente {
  max-width: 260px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__matriz-qtde {
  width: 55px;
  text-align: center;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__matriz-valor {
  width: 115px;
  font-weight: 600;
  text-align: right;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__silhueta-barras,
.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__silhueta-matriz {
  min-height: 120px;
}

/* Listagem de itens: recurso nosso, abaixo do painel, largura toda. */
.cotacoes-perdidas-vendas__itens {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cotacoes-perdidas-vendas .cotacoes-perdidas-vendas__titulo-itens {
  margin: 4px 0 0;
}

@media (max-width: 1199px) {
  .cotacoes-perdidas-vendas__faixa-cima {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}

@media (max-width: 1099px) {
  .cotacoes-perdidas-vendas__faixa-baixo {
    grid-template-columns: 1fr;
  }
}