/* Pré-produção (26/09/2026) — em cima do painel-vendedor.css (pv-*). Conteúdo da
   "Verificação do designer" do Saad (card por pedido, itens com letra), visual do AutoZap. */
.pp-kpis { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; margin-bottom:14px; }
.pp-kpi { display:flex; align-items:center; gap:12px; background:var(--bg-elevated, #fff); border:0.5px solid var(--border); border-radius:12px; padding:12px 14px; min-width:0; }
.pp-kpi .ic { width:38px; height:38px; border-radius:10px; display:grid; place-items:center; flex:none; font-size:16px; }
.pp-kpi .n { font-size:21px; font-weight:800; line-height:1.1; letter-spacing:-0.02em; }
.pp-kpi .l { font-size:12px; color:var(--text-secondary); }
.pp-kpi .ic { background:var(--accent-soft, #f3e8ff); color:var(--accent); }
.pp-kpi.urg .n { color:#b3261e; }
.pp-abas { display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
.pp-abas button { display:inline-flex; align-items:center; gap:8px; border:0.5px solid var(--border); background:var(--bg-elevated, #fff); border-radius:999px; padding:8px 16px; font-weight:700; font-size:13.5px; cursor:pointer; color:var(--text-secondary); font-family:inherit; }
.pp-abas button b { background:var(--bg-hover, #f1f5f9); border-radius:999px; padding:1px 9px; font-size:12px; }
.pp-abas button.on { background:var(--accent); color:var(--on-accent, #fff); border-color:transparent; }
.pp-abas button.on b { background:rgba(255,255,255,.22); }

.pp-grade { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap:16px; }
.pp-grade > * { min-width:0; }
.pp-card { background:var(--bg-elevated, #fff); border-radius:var(--r-lg, 14px); border:0.5px solid var(--border); overflow:hidden; display:flex; flex-direction:column; min-width:0; box-shadow:var(--shadow-sm, 0 1px 3px rgba(0,0,0,.05)); }
.pp-card.urg { box-shadow:0 0 0 1.5px color-mix(in srgb, var(--red, #ff3b30) 55%, transparent); }
.pp-head { background:var(--bg-surface, var(--bg-hover, #fafafa)); color:var(--text-primary); padding:12px 16px; display:flex; flex-direction:column; gap:7px; border-bottom:0.5px solid var(--divider); }
.pp-head .l1 { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.pp-head .num { font-size:16px; font-weight:800; margin-right:2px; color:var(--accent); }
.pp-head .tag { display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; border-radius:999px; padding:3px 9px; background:var(--bg-hover, #f1f5f9); color:var(--text-secondary); }
.pp-head .tag.imp { background:var(--accent-soft, #f3e8ff); color:var(--accent); }
.pp-head .tag.cont { background:color-mix(in srgb, var(--green, #15803d) 12%, transparent); color:var(--green, #15803d); }
.pp-head .tag.urg { background:color-mix(in srgb, var(--red, #ff3b30) 12%, transparent); color:#b3261e; }
.pp-head .l2 { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:3px 14px; font-size:12.5px; }
.pp-head .l2 b { font-weight:600; color:var(--text-secondary); }
.pp-head .l2 span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.pp-faixa { border-radius:8px; padding:6px 10px; font-size:12.5px; font-weight:700; display:flex; align-items:center; gap:7px; }
.pp-faixa.atr { background:#fef2f2; color:#b3261e; }
.pp-faixa.ok { background:#ecfdf5; color:#047857; }
.pp-faixa.mat { background:var(--accent-soft, #f3e8ff); color:var(--accent); }
.pp-faixa.venc { background:#fef2f2; color:#b3261e; }
.pp-faixa.urg { background:#fef2f2; color:#b3261e; border:0.5px solid #fca5a5; }
.pp-faixa.obs { background:#fffbeb; color:#92400e; font-weight:500; }

.pp-itens { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:10px; padding:12px; }
.pp-it { border:0.5px solid var(--border); border-radius:var(--r-md, 12px); padding:8px; display:flex; flex-direction:column; gap:5px; min-width:0; position:relative; background:var(--bg-elevated, #fff); }
.pp-it .letra { position:absolute; top:6px; left:6px; width:24px; height:24px; border-radius:50%; background:var(--accent); color:var(--on-accent, #fff); font-weight:800; font-size:12px; display:grid; place-items:center; z-index:1; }
.pp-it .foto { height:120px; border-radius:8px; background:var(--bg-surface, #fafafa); display:flex; align-items:center; justify-content:center; overflow:hidden; color:#cbd5e1; font-size:26px; }
.pp-it .foto img { max-width:100%; max-height:120px; object-fit:contain; }
.pp-it .nm { font-weight:700; font-size:12.5px; line-height:1.3; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pp-it .q { font-size:12px; color:var(--text-secondary); }
.pp-it .chips { display:flex; flex-wrap:wrap; gap:4px; }
.pp-mini { display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700; border-radius:6px; padding:2px 7px; }
.pp-mini.setor { background:var(--accent-soft, #f3e8ff); color:var(--accent); }
.pp-mini.novo { background:#fef2f2; color:#b3261e; }
.pp-mini.ok { background:#dcfce7; color:#166534; }
.pp-mini.env { background:#ffedd5; color:#9a3412; }
.pp-mat { font-size:11px; border-radius:8px; padding:5px 7px; background:var(--bg-surface, var(--bg-hover, #f4f4f5)); color:var(--text-secondary); line-height:1.35; }
.pp-mat.falta { background:#fffbeb; color:#92400e; }
.pp-mat.venc { background:#fef2f2; color:#991b1b; }
.pp-mat b { font-weight:800; }
.pp-mat button { margin-top:4px; }
.pp-det { font-size:11px; background:#fef9c3; color:#713f12; border-radius:6px; padding:3px 7px; }
.pp-rod { border-top:0.5px solid var(--divider); padding:10px 14px; display:flex; flex-direction:column; gap:8px; margin-top:auto; }
.pp-rod .quando { font-size:11.5px; color:var(--text-tertiary); display:flex; gap:12px; flex-wrap:wrap; }
.pp-rod .quando .v { color:var(--green, #15803d); font-weight:700; }
.pp-rod .bts { display:flex; gap:7px; flex-wrap:wrap; }
.pp-rod .bts .ui-btn { height:34px; display:inline-flex; align-items:center; gap:7px; font-weight:700; }
/* Folhas (Mãe/Filho/Big) em botões comuns; a ação principal (liberar) vai na cor de destaque. */
.pp-b-ok { background:var(--accent) !important; color:var(--on-accent, #fff) !important; border-color:transparent !important; }
.pp-b-erro { color:#b3261e !important; }
.pp-b-erro:hover { background:#fef2f2 !important; }
.pp-mini-btn { border:0; background:var(--accent); color:var(--on-accent, #fff); border-radius:6px; font-size:10.5px; font-weight:700; padding:3px 8px; cursor:pointer; font-family:inherit; display:inline-flex; align-items:center; gap:5px; }

/* modais */
.pp-form { display:flex; flex-direction:column; gap:12px; }
.pp-form label.t { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--text-tertiary); display:block; margin-bottom:4px; }
.pp-form textarea { width:100%; min-height:90px; }
.pp-check { display:flex; flex-direction:column; gap:6px; }
.pp-check label { display:flex; align-items:center; gap:8px; font-size:13px; }
.pp-lista { margin:0; padding-left:18px; font-size:13px; color:var(--text-secondary); line-height:1.6; }
.pp-2 { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }

@media (max-width: 640px) {
    .pp-kpis { grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
    .pp-kpi { padding:10px; gap:0; }
    .pp-kpi .ic { display:none; }
    .pp-kpi .n { font-size:19px; }
    .pp-kpi .l { font-size:11px; line-height:1.25; }
    .pp-head .l2 { grid-template-columns:minmax(0, 1fr); }
    .pp-itens { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; padding:10px; }
    .pp-2 { grid-template-columns:minmax(0, 1fr); }
}
/* Reimpressão e linha do tempo (26/09/2026) */
.pp-head .tag.reimp { background:color-mix(in srgb, #c2410c 12%, transparent); color:#c2410c; border:0; cursor:pointer; font-family:inherit; }
.pp-head .tag.reimp:hover { background:color-mix(in srgb, #c2410c 20%, transparent); }
.pp-hist { display:flex; flex-direction:column; gap:2px; font-size:12.5px; }
.pp-hl { display:grid; grid-template-columns:118px minmax(0,140px) minmax(0,1fr); gap:10px; padding:7px 4px; border-bottom:0.5px solid var(--border); align-items:baseline; }
.pp-hl .q { color:var(--text-tertiary); font-variant-numeric:tabular-nums; }
.pp-hl b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pp-hl.desval { color:#c2410c; }
.pp-hl.anulada > span:last-child { text-decoration:line-through; text-decoration-color:color-mix(in srgb, currentColor 50%, transparent); }
.pp-anul { display:inline-block; text-decoration:none; font-size:10.5px; font-weight:700; color:#b3261e; background:color-mix(in srgb, #b3261e 10%, transparent); border-radius:6px; padding:1px 6px; margin-left:4px; }
@media (max-width:600px) { .pp-hl { grid-template-columns:1fr; gap:2px; } }
/* Chip do setor com a miniatura da arte dele (26/09/2026) */
.pp-mini.setor.com-arte { padding-left:3px; gap:6px; }
.pp-set-img { display:inline-flex; width:22px; height:22px; border-radius:5px; overflow:hidden; background:#fff; border:0.5px solid var(--border); flex:none; align-items:center; justify-content:center; font-size:8px; font-weight:800; color:var(--text-secondary); text-decoration:none; }
.pp-set-img img { width:100%; height:100%; object-fit:cover; }
.pp-mat-fonte{font-size:11px;opacity:.8;cursor:help}.pp-mat-fonte i{margin-right:4px}

.pp-desv{flex-basis:100%;margin-top:6px;padding:6px 10px;border-radius:8px;background:#fff7ed;color:#9a3412;font-size:12px;border:0.5px solid #fed7aa}.pp-desv i{margin-right:4px}

/* 27/09/2026: rodapé do card em fileiras que ocupam a largura toda */
.pp-rod .bts { display:flex; flex-direction:column; gap:7px; }
.pp-rod .bts-folhas { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:7px; }
.pp-rod .bts-acao { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:7px; }
.pp-rod .bts-links { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:7px; }
.pp-rod .bts-folhas .ui-btn, .pp-rod .bts-acao .ui-btn, .pp-rod .bts-links .ui-btn { width:100%; justify-content:center; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pp-faixa.env{background:#fff7ed;color:#7c2d12;border:0.5px solid #fed7aa;align-items:flex-start;line-height:1.45}.pp-faixa.env .fa-location-dot{margin-right:3px;color:#c2410c}
.pp-faixa.env{font-weight:500}.pp-faixa.env b{font-weight:700}

.pp-obsprod{margin-top:5px;font-size:11.5px;background:#f0f9ff;border:0.5px solid #bae6fd;color:#075985;border-radius:8px;padding:4px 8px}
