/* sim-orcamento.css: estilo só da simulação orcamento (S-04), fiel a QuotesSection.tsx e
   KanbanColumn.tsx do SHA 1b7e991. Peças que não estão em sim.css porque são específicas desta tela. */

.ar-app .orc-grade { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; block-size: 100%; min-block-size: 0; padding: 20px; }
.ar-app .orc-col { min-inline-size: 0; min-block-size: 0; overflow: clip; }
.ar-app .orc-col--funil { display: flex; flex-direction: column; }

.ar-app .orc-coluna { inline-size: 300px; max-inline-size: 100%; display: flex; flex-direction: column; overflow: clip; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); box-shadow: var(--shadow-sm); margin-block-start: 12px; }
.ar-app .orc-coluna-topo { block-size: 4px; background: var(--orc-cor, var(--primary)); }
.ar-app .orc-coluna-cab { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-block-end: 1px solid var(--border); }
.ar-app .orc-dot { inline-size: 10px; block-size: 10px; border-radius: 50%; background: var(--orc-cor, var(--primary)); flex-shrink: 0; }
.ar-app .orc-coluna-titulo { flex: 1 1 auto; font-size: var(--text-sm); }
.ar-app .orc-cont { padding: 1px 6px; border-radius: 999px; background: var(--surface-2); font-size: var(--text-xs); font-weight: 600; color: var(--text-muted); }
.ar-app .orc-soma { font-size: var(--text-xs); font-weight: 600; color: var(--text-muted); }
.ar-app .orc-coluna-corpo { display: flex; flex-direction: column; gap: 10px; padding: 10px; }

.ar-app .orc-painel { display: flex; flex-direction: column; min-block-size: 0; overflow-y: hidden; }
.ar-app .orc-painel-corpo { padding-block-start: 4px; }
.ar-app .orc-orcamentos-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-block-end: 12px; }
.ar-app .orc-card-titulo { font-size: var(--text-lg); }
.ar-app .orc-sub { font-size: var(--text-sm); color: var(--text-muted); }

.ar-app .orc-lista { display: flex; flex-direction: column; gap: 10px; }
.ar-app .orc-linha { padding: 14px; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.ar-app .orc-linha-topo { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ar-app .orc-linha-info { min-inline-size: 0; }
.ar-app .orc-linha-cab { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ar-app .orc-numero { font-size: var(--text-xs); color: var(--text-muted); }
.ar-app .orc-chip { display: inline-flex; padding: 1px 8px; border: 1px solid; border-radius: 999px; font-size: var(--text-xs); font-weight: 600; }
.ar-app .orc-chip--rascunho { color: var(--text-muted); border-color: var(--border); background: var(--surface-2); }
.ar-app .orc-chip--primary { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 30%, transparent); background: color-mix(in srgb, var(--primary) 10%, transparent); }
.ar-app .orc-desconto-badges:empty { display: none; }
.ar-app .orc-titulo { font-size: var(--text-sm); color: var(--text); }
.ar-app .orc-meta { margin-block-start: 3px; font-size: var(--text-xs); color: var(--text-muted); }
.ar-app .orc-meta--vend { margin-block-start: 1px; }
.ar-app .orc-linha-valor { text-align: end; flex-shrink: 0; }
.ar-app .orc-total { font-size: var(--text-xl); }
.ar-app .orc-desconto-nota { display: block; margin-block-start: 2px; font-size: var(--text-xs); color: var(--text-subtle); }

.ar-app .orc-acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-block-start: 12px; padding-block-start: 12px; border-block-start: 1px solid var(--border); }
.ar-app .orc-sep { inline-size: 1px; block-size: 20px; background: var(--border); margin: 0 2px; }
.ar-app .ar-botao--fantasma { background: transparent; color: var(--text-muted); }
.ar-app .orc-recusado { color: var(--danger); }
.ar-app .orc-oculto { opacity: 0; transform: translateY(4px); pointer-events: none; }

/* compacta: sem o .orc-grade (não há painel ao lado); o próprio ar-app vira a coluna única,
   com a coluna do funil de altura limitada para sobrar espaço para a linha abaixo dela (D-A9-B35-03:
   a raia do funil tem rolagem própria no produto, KanbanColumn.tsx:70, então cortá-la aqui é fiel). */
.ar-app[data-sim-variante="compacta"] { display: flex; flex-direction: column; gap: 14px; padding: 16px; }
.ar-app[data-sim-variante="compacta"] .orc-coluna { margin-block-start: 0; max-block-size: 224px; }
.ar-app .orc-linha-compacta { padding: 0; flex: 1 1 auto; min-block-size: 0; overflow: clip; }
.ar-app .orc-linha--compacta .orc-total { font-size: var(--text-lg); }
.ar-app .orc-linha--compacta { padding: 12px; }

/* arranjo estreito (celular): coluna vira cartões empilhados; a linha vem abaixo sem os botões
   (06-SIMULACOES 5, S-04: "sem os botões de ação, fora do recorte") */
.ar-app[data-sim-arranjo="estreito"] .orc-grade { display: flex; flex-direction: column; gap: 16px; }
.ar-app[data-sim-arranjo="estreito"] .orc-coluna { inline-size: 100%; max-block-size: 210px; }
.ar-app[data-sim-arranjo="estreito"] .orc-acoes { display: none; }
/* o total é o dado mais importante da linha: no recorte estreito ele vem logo depois da situação,
   antes da meta menos essencial (itens, validade, vendedor), para nunca ser o que o corte esconde */
.ar-app[data-sim-arranjo="estreito"] .orc-linha-topo { flex-direction: column; }
.ar-app[data-sim-arranjo="estreito"] .orc-linha-valor { order: -1; text-align: start; margin-block: 4px 2px; }
.ar-app[data-sim-arranjo="estreito"] .orc-total { font-size: var(--text-lg); }