/* ── Feature Compras (pedido de compra) ─────────────────────────────────── */
.ped { display: flex; flex-direction: column; height: 100%; padding: 20px 24px; gap: 14px; overflow: auto; }
.ped-nota { color: var(--text-muted); font-size: 12px; margin: 0; line-height: 1.5; }
.ped-spacer { flex: 1; }
.ped-muted { color: var(--text-muted); font-size: 12px; }
.ped-muted.erro, #pc-msg.erro { color: var(--danger); }

.ped-cab { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.ped-field { display: flex; flex-direction: column; gap: 5px; position: relative; }
.ped-field.ped-obs { grid-column: 1 / -1; }
.ped-field label { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-subtle); }
.ped-field input, .ped-field select {
  height: 36px; padding: 0 10px; background: var(--surface); color: var(--text);
  border: 1px solid var(--border); border-radius: var(--radius-sm, 6px); font-family: inherit; font-size: 13px;
}
.ped-field input:focus, .ped-field select:focus { outline: none; border-color: var(--accent); }

/* type-ahead */
.ped-ta { position: relative; }
.ped-ta-list {
  display: none; position: absolute; z-index: 30; left: 0; top: 100%;
  min-width: 100%; max-width: 420px; max-height: 260px; overflow: auto; margin-top: 3px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm, 6px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.20);
}
.ped-ta-item { padding: 7px 10px; font-size: 13px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ped-ta-item:hover { background: var(--accent-glow); color: var(--accent); }

.ped-secao { border: 1px solid var(--border); border-radius: var(--radius-sm, 6px); padding: 4px 12px; }
.ped-secao > summary { cursor: pointer; font-size: 12px; font-weight: 600; color: var(--text-subtle); padding: 6px 0; text-transform: uppercase; letter-spacing: 0.04em; }
.ped-secao[open] > summary { margin-bottom: 8px; }
.ped-secao .ped-cab { padding-bottom: 8px; }

.ped-itens-cab { display: flex; align-items: center; gap: 12px; }
.ped-itens-cab h3 { margin: 0; font-size: 14px; color: var(--text); }
.ped-itenswrap { border: 1px solid var(--border); border-radius: var(--radius-md, 8px); overflow: visible; }
.ped-itens-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ped-itens-table th {
  text-align: left; padding: 8px 10px; background: var(--bg-elevated); border-bottom: 1px solid var(--border);
  font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-subtle);
}
.ped-itens-table td { padding: 6px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
.ped-itens-table .num { text-align: right; }
.ped-itens-table td.num input { text-align: right; }
.ped-itens-table input {
  height: 32px; padding: 0 8px; background: var(--surface); color: var(--text);
  border: 1px solid var(--border); border-radius: 6px; font-family: inherit; font-size: 13px;
}
.ped-itens-table input:focus { outline: none; border-color: var(--accent); }
.ped-prod input { width: 100%; min-width: 200px; }
.ped-itens-table td.ped-ta { position: relative; }
.ped-itens-table td.ped-ta input { width: 100%; min-width: 120px; }
.pc-total-item { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--text); }

.ped-rodape { display: flex; align-items: center; gap: 14px; padding-top: 4px; }
.ped-total { font-size: 14px; color: var(--text-muted); }
.ped-total b { color: var(--text); font-size: 16px; }