/* =========================================================
   O PREGÃO DA BOLSA DE HAWKINS (pregao.js) — prefixo próprio: .pg-
   Na Melvald's (lado Hawkins): o painel da cotação é um placar de LED verde e vermelho
   de corretora de 2003 pendurado no balcão; a ordem fica no lugar do antigo formulário.
   Celular: bloco "PREGÃO DA BOLSA" no mobile.css (só dentro das consultas de celular).
   O "piscar" do preço respeita o movimento reduzido e o modo desempenho.
   ========================================================= */
.pg-topo {
  --pg-led: #6dff9a; --pg-red: #ff6b5e; --pg-bg: #0d1410; --pg-line: #24352a; --pg-muted: #9fb4a6;
  display: grid; grid-template-columns: minmax(200px, 0.9fr) 1.6fr; gap: 14px 20px; align-items: center;
  margin: 0 0 18px; padding: 14px 16px; border: 3px solid #2b2b24; border-radius: 6px; background: var(--pg-bg);
  box-shadow: inset 0 0 0 1px var(--pg-line), 0 10px 22px rgba(0, 0, 0, 0.35); color: #e8f3ea;
}
.pg-preco small { display: block; font: 700 11px var(--font-small, var(--font-ui)); letter-spacing: 0.18em; color: var(--pg-muted); }
.pg-p { display: block; margin: 4px 0 2px; font: 700 clamp(30px, 4.4vw, 44px)/1 var(--font-type); color: var(--pg-led); letter-spacing: 0.02em; text-shadow: 0 0 10px rgba(109, 255, 154, 0.35); }
.pg-preco em { display: block; font: 700 14px var(--font-type); font-style: normal; color: var(--pg-muted); }
.pg-preco em.up, .pg-3l .up { color: var(--pg-led); }
.pg-preco em.down, .pg-3l .down { color: var(--pg-red); }
.pg-st { display: inline-block; margin-top: 8px; padding: 2px 8px; border: 1px solid var(--pg-led); border-radius: 3px; font: 700 11px var(--font-ui); letter-spacing: 0.12em; color: var(--pg-led); }
.pg-st-off { border-color: #ffb36b; color: #ffb36b; }
.pg-flash-up { animation: pg-up 0.9s ease-out; }
.pg-flash-down { animation: pg-down 0.9s ease-out; }
@keyframes pg-up { from { background: rgba(109, 255, 154, 0.35); } to { background: transparent; } }
@keyframes pg-down { from { background: rgba(255, 107, 94, 0.35); color: var(--pg-red); } to { background: transparent; } }
.pg-dia { min-width: 0; }
.pg-dia > small { display: block; margin-top: 6px; color: var(--pg-muted); font: 12px/1.45 var(--font-ui); }
.pg-faixa { display: flex; align-items: center; gap: 8px; font: 12px var(--font-type); color: var(--pg-muted); }
.pg-faixa i { position: relative; flex: 1; height: 8px; border-radius: 4px; background: linear-gradient(90deg, rgba(255, 107, 94, 0.5), rgba(255, 255, 255, 0.12) 50%, rgba(109, 255, 154, 0.5)); }
.pg-faixa u { position: absolute; top: -4px; width: 4px; height: 16px; margin-left: -2px; border-radius: 2px; background: #fff; text-decoration: none; }
.pg-graf { display: block; width: 100%; height: 56px; margin-top: 8px; }
.pg-graf-l { fill: none; stroke: var(--pg-led); stroke-width: 2; vector-effect: non-scaling-stroke; }
.pg-graf-ab { stroke: rgba(255, 255, 255, 0.25); stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.pg-noite { margin: 6px 0 0; font: 13px/1.45 var(--font-ui); color: #e8f3ea; }

/* ---------- a ordem (no produto da Melvald's) ---------- */
.pg-ordem { display: grid; gap: 10px; }
.pg-lado { display: flex; gap: 6px; }
.pg-lado button { flex: 1; min-height: 38px; border: 2px solid #6b5639; border-radius: 4px; background: #f6e4b6; color: #3a2a17; font: 700 14px var(--font-ui); cursor: pointer; }
.pg-lado button.on { background: #a3261c; border-color: #5e120d; color: #fff6e6; }
.pg-rapido { display: flex; flex-wrap: wrap; gap: 6px; }
.pg-rapido button { min-height: 36px; padding: 0 12px; border: 1px solid #b59a64; border-radius: 18px; background: #fffaf0; color: #3a2a17; font: 700 13px var(--font-ui); cursor: pointer; }
.pg-rapido button.on { background: #1e6b3c; border-color: #1e6b3c; color: #fff; }
.pg-rapido button:disabled { opacity: 0.45; cursor: not-allowed; }
.pg-campo { display: grid; gap: 4px; font: 13px var(--font-ui); }
.pg-campo input { min-height: 38px; padding: 0 10px; border: 1px solid #b59a64; border-radius: 4px; font: 16px var(--font-type); }
.pg-3l { margin: 0; padding: 0; list-style: none; border: 1px dashed #b59a64; border-radius: 4px; background: #fffaf0; }
.pg-3l li { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; padding: 7px 10px; border-top: 1px dotted #d9c79b; color: #2a1c12; font: 13px var(--font-ui); }
.pg-3l li:first-child { border-top: 0; }
.pg-3l b { font: 700 15px var(--font-type); text-align: right; }
.pg-3l small { grid-column: 1 / -1; color: #6a5844; }
.pg-3l .up { color: #1e6b3c; }
.pg-3l .down { color: #a3261c; }
.pg-parte, .pg-lim, .pg-aviso { margin: 0; font: 12.5px/1.45 var(--font-ui); color: #4a3a2a; }
.pg-parte.pg-alto, .pg-aviso { color: #a3261c; font-weight: 700; }
.pg-recibo { margin-top: 10px; }
.pg-adm-st { margin: 6px 0 10px; }
/* no Mundo Invertido o produto da Melvald's não aparece; o painel do admin usa as cores do painel */
.theme-upside .pg-ordem { color: inherit; }
@media (prefers-reduced-motion: reduce) { .pg-flash-up, .pg-flash-down { animation: none; } }