/* =============================================================
 * Ecommerce › Mercado Livre › Vendas — painel analítico (29/10/2026)
 * Desenhado por assets/js/ml-vendas-painel-ui.js dentro de #mlVendasContent.
 * Só tokens da pele 2026 (portal-2026.css). As cores de gráfico (--mlv-*) seguem as regras do
 * dataviz e têm passo próprio no escuro (não é inversão):
 *   série 1 teal  #0a9492 / #1ea9a6   série 2 laranja #eb6834 / #d95926
 *   validadas com validate_palette.js (claro sobre #ffffff, escuro sobre #172120): faixa de
 *   luminosidade, croma, separação para daltonismo (ΔE 12,2 / 15,5) e contraste >= 3:1.
 *   período anterior (contexto, não série): #8a9893 (3,0:1) / #6b7a76 (3,7:1).
 * Níveis da reputação do ML: escala de status (vermelho → verde), sempre com o rótulo escrito.
 * ============================================================= */
:root{
  --mlv-s1:#0a9492; --mlv-s2:#eb6834; --mlv-ant:#8a9893; --mlv-ded:#b7c1bd; --mlv-tot:#647370;
  --mlv-rep1:#d03b3b; --mlv-rep2:#ec835a; --mlv-rep3:#fab219; --mlv-rep4:#8cc63f; --mlv-rep5:#0ca30c; --mlv-rep-off:#e4e8e6;
  --mlv-tip-bg:#05302e; --mlv-tip-ink:#eaf3ef;
}
:root[data-theme="dark"]{
  --mlv-s1:#1ea9a6; --mlv-s2:#d95926; --mlv-ant:#6b7a76; --mlv-ded:#4f5e5a; --mlv-tot:#86958f;
  --mlv-rep-off:#2b3836;
  --mlv-tip-bg:#0b1b19; --mlv-tip-ink:#e6ecea;
}

#mlVendasContent{ min-width:0; }
.mlv{ container:mlv / inline-size; display:flex; flex-direction:column; gap:14px; min-width:0; font-family:var(--font-body); color:var(--ink); }
.mlv *, #mlvGaveta *{ box-sizing:border-box; }
.mlv .mlv-mono, #mlvGaveta .mlv-mono{ font-family:ui-monospace,'JetBrains Mono',monospace; font-size:12px; }
.mlv .mlv-mut, #mlvGaveta .mlv-mut{ color:var(--ink-3); }
.mlv svg, #mlvGaveta svg{ flex:none; }

/* ---------- 1. faixa "Resumo do Mercado Livre" ---------- */
.mlv-over{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin:0 0 8px; font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); }
.mlv-over em{ font-style:normal; font-weight:600; letter-spacing:0; text-transform:none; font-size:11.5px; }
.mlv-res{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; grid-auto-flow:row dense; }
.mlv-rc{ position:relative; display:flex; flex-direction:column; gap:3px; min-width:0; padding:11px 13px 12px; background:var(--panel); border:1px solid var(--line); border-radius:12px; text-align:left; font:inherit; color:inherit; }
button.mlv-rc{ cursor:pointer; transition:border-color .12s, background .12s; }
button.mlv-rc:hover{ border-color:var(--accent-line); background:var(--accent-50); }
button.mlv-rc:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.mlv-rc--2{ grid-column:span 2; } .mlv-rc--3{ grid-column:span 3; }
.mlv-rc-l{ display:flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:var(--ink-2); line-height:1.3; }
.mlv-rc-l em{ margin-left:auto; font-style:normal; font-size:11px; font-weight:600; color:var(--ink-3); white-space:nowrap; }
.mlv-rc-v{ font-size:22px; font-weight:800; line-height:1.15; letter-spacing:-.01em; color:var(--ink); white-space:nowrap; }
.mlv-rc-v.zero{ color:var(--ink-3); }
.mlv-rc-s{ font-size:11.5px; line-height:1.35; color:var(--ink-3); }
.mlv-rc-off{ margin-top:auto; font-size:11.5px; font-weight:600; color:var(--ink-3); display:inline-flex; align-items:center; gap:6px; }
.mlv-rc-off::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--ink-deco); }
.mlv-rc--off{ background:var(--bg-2); border-style:dashed; }
.mlv-par{ display:grid; grid-template-columns:repeat(auto-fit,minmax(70px,1fr)); gap:4px 12px; margin-top:2px; }
.mlv-par > div{ min-width:0; }
.mlv-par .mlv-rc-v{ font-size:20px; }
.mlv-par small{ display:flex; align-items:center; gap:5px; font-size:11.5px; color:var(--ink-3); line-height:1.3; }
.mlv-st-dot{ width:7px; height:7px; border-radius:50%; flex:none; }
.mlv-st-dot.ruim{ background:var(--red); } .mlv-st-dot.aviso{ background:var(--amber); } .mlv-st-dot.bom{ background:var(--good); }
.mlv-flag{ display:inline-flex; align-items:center; gap:4px; width:max-content; max-width:100%; padding:2px 8px 2px 6px; border-radius:999px; font-size:11px; font-weight:700; line-height:1.4; }
.mlv-flag.ruim{ background:var(--red-soft); color:var(--red); } .mlv-flag.aviso{ background:var(--amber-soft); color:var(--amber); } .mlv-flag.bom{ background:var(--good-soft); color:var(--good); }
.mlv-flag svg{ width:12px; height:12px; }
/* reputação: termômetro de 5 níveis + taxas */
.mlv-rep{ display:grid; grid-template-columns:minmax(150px,.9fr) minmax(0,1.6fr); gap:8px 18px; align-items:center; margin-top:2px; }
.mlv-termo{ display:grid; grid-template-columns:repeat(5,1fr); gap:3px; margin:4px 0 6px; }
.mlv-termo i{ height:8px; border-radius:2px; background:var(--mlv-rep-off); }
.mlv-termo i.on{ height:12px; margin-top:-2px; border-radius:3px; box-shadow:0 0 0 2px var(--panel); }
.mlv-termo i.n1.on{ background:var(--mlv-rep1); } .mlv-termo i.n2.on{ background:var(--mlv-rep2); } .mlv-termo i.n3.on{ background:var(--mlv-rep3); } .mlv-termo i.n4.on{ background:var(--mlv-rep4); } .mlv-termo i.n5.on{ background:var(--mlv-rep5); }
.mlv-rep-nivel{ font-size:15px; font-weight:800; color:var(--ink); line-height:1.2; }
.mlv-taxas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(96px,1fr)); gap:6px 12px; }
.mlv-taxas b{ display:block; font-size:17px; font-weight:800; color:var(--ink); line-height:1.15; }
.mlv-taxas small{ display:block; font-size:11px; color:var(--ink-3); line-height:1.3; }

/* ---------- 2. barra do período ---------- */
.mlv-barra{ display:flex; align-items:center; gap:8px 12px; flex-wrap:wrap; }
.mlv-pilulas{ display:flex; gap:6px; min-width:0; max-width:100%; overflow-x:auto; scrollbar-width:none; padding:1px; }
.mlv-pilulas::-webkit-scrollbar{ display:none; }
.mlv-pil{ flex:none; height:34px; padding:0 13px; border:1px solid var(--line-2); border-radius:999px; background:var(--panel); color:var(--ink-2); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; white-space:nowrap; transition:background .12s, border-color .12s, color .12s; }
.mlv-pil:hover{ background:var(--hover); }
.mlv-pil[aria-pressed="true"]{ background:var(--accent-50); border-color:var(--accent); color:var(--accent-ink); box-shadow:inset 0 0 0 1px var(--accent); }
.mlv-pil:focus-visible, .mlv-btn:focus-visible, .mlv-pag button:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.mlv-datas{ display:flex; align-items:center; gap:6px; }
.mlv-datas[hidden]{ display:none; }
.mlv .mlv-datas input[type="date"]{ height:34px; padding:0 12px; border:1px solid var(--line-2) !important; border-radius:999px !important; background:var(--input) !important; color:var(--ink) !important; font:inherit; font-size:12.5px; font-weight:600; color-scheme:light; }
:root[data-theme="dark"] .mlv .mlv-datas input[type="date"]{ color-scheme:dark; }
.mlv .mlv-datas input[type="date"]:focus{ outline:none !important; border-color:var(--accent) !important; box-shadow:0 0 0 3px var(--accent-soft) !important; }
.mlv-barra-fim{ margin-left:auto; display:flex; align-items:center; gap:10px; }
.mlv-atual{ font-size:12px; color:var(--ink-3); white-space:nowrap; display:inline-flex; align-items:center; gap:6px; }
.mlv-atual::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.mlv-btn{ height:34px; padding:0 14px; border:1px solid var(--line-2); border-radius:999px; background:var(--panel); color:var(--ink); font:inherit; font-size:12.5px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:7px; white-space:nowrap; text-decoration:none; }
.mlv-btn:hover{ background:var(--accent-50); border-color:var(--accent-line); color:var(--accent-ink); }
.mlv-btn[disabled]{ opacity:.6; cursor:progress; }
.mlv-btn svg{ width:15px; height:15px; }
.mlv-nota{ margin-top:-6px; font-size:12px; color:var(--ink-3); display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; }   /* (revisão de 29/10/2026): selos de aviso do servidor ao lado do período */
.mlv-nota b{ font-weight:700; color:var(--ink-2); }

/* ---------- 3. KPIs (stat tiles) ---------- */
.mlv-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(172px,1fr)); gap:10px; }
.mlv-kpi{ display:flex; flex-direction:column; min-width:0; padding:12px 14px 10px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.mlv-kpi-l{ font-size:12px; font-weight:600; color:var(--ink-2); }
.mlv-kpi-v{ margin-top:3px; font-size:24px; font-weight:800; line-height:1.15; letter-spacing:-.015em; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mlv-kpi-v small{ font-size:13px; font-weight:700; color:var(--ink-3); letter-spacing:0; margin-left:4px; }
.mlv-kpi-d{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:4px; font-size:11.5px; color:var(--ink-3); min-height:18px; }
.mlv-delta{ display:inline-flex; align-items:center; gap:3px; font-weight:800; font-size:12px; white-space:nowrap; }
.mlv-delta svg{ width:11px; height:11px; }
.mlv-delta.bom{ color:var(--good); } .mlv-delta.ruim{ color:var(--red); } .mlv-delta.neutro{ color:var(--ink-3); font-weight:700; }
.mlv-spark{ position:relative; height:30px; margin-top:8px; cursor:crosshair; }
.mlv-spark svg{ display:block; width:100%; height:100%; overflow:visible; }
.mlv-spark path{ fill:none; stroke:var(--mlv-ant); stroke-width:1.75; stroke-linejoin:round; stroke-linecap:round; }
.mlv-spark i{ position:absolute; left:100%; width:8px; height:8px; margin:-4px 0 0 -4px; border-radius:50%; background:var(--mlv-s1); box-shadow:0 0 0 2px var(--panel); pointer-events:none; }

/* ---------- cartões de gráfico ---------- */
.mlv-linha{ display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:12px; }
.mlv-card{ min-width:0; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:14px 16px 14px; transition:opacity .2s; }
.mlv-card-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px 16px; flex-wrap:wrap; margin-bottom:10px; }
.mlv .mlv-card-t{ margin:0; font-size:14px !important; font-weight:700; color:var(--ink) !important; letter-spacing:-.005em; line-height:1.3; }   /* o escuro gerado pinta todo h2 de teal */
.mlv-card-s{ margin-top:2px; font-size:12px; color:var(--ink-3); line-height:1.4; }
.mlv-card-s b{ color:var(--ink-2); font-weight:700; }
.mlv-card-a{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.mlv-leg{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--ink-2); }
.mlv-leg span{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.mlv-leg i{ display:inline-block; width:10px; height:10px; border-radius:2px; }
.mlv-leg i.linha{ width:16px; height:2px; border-radius:1px; }
.mlv-leg i.s1{ background:var(--mlv-s1); } .mlv-leg i.s2{ background:var(--mlv-s2); } .mlv-leg i.ant{ background:var(--mlv-ant); }
.mlv-vista{ border:0; background:none; padding:2px 0; font:inherit; font-size:12px; font-weight:700; color:var(--accent-ink); cursor:pointer; white-space:nowrap; }
.mlv-vista:hover{ text-decoration:underline; }
.mlv-plot{ position:relative; height:232px; }
.mlv-plot--p{ height:232px; }
.mlv-plot--abc{ height:250px; }
/* tooltip compartilhado (chartTooltipHtml) dentro do gráfico: sem as bordas de td globais do portal */
.mlv-plot [id^="tip-"] td{ border:0 !important; background:none !important; }
.mlv-ocupado{ opacity:.5; pointer-events:none; }

/* ---------- tabelas ---------- */
.mlv-tabwrap{ overflow-x:auto; border:1px solid var(--line); border-radius:10px; }
.mlv-tab{ width:100%; border-collapse:collapse; font-size:12.5px; font-variant-numeric:tabular-nums; }
/* bordas com !important: o portal-2026-dark.css (gerado) põe borda em todo td/th do tema escuro */
.mlv-tab th{ position:static; padding:8px 10px; background:var(--bg-2); border:0 !important; border-bottom:1px solid var(--line) !important; font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-3); text-align:left; white-space:nowrap; }
.mlv-tab td{ padding:8px 10px; border:0 !important; border-top:1px solid var(--line-soft) !important; color:var(--ink); vertical-align:top; }
.mlv-tab tbody tr:first-child td{ border-top:0 !important; }
.mlv-tab .r{ text-align:right; white-space:nowrap; } .mlv-tab .c{ text-align:center; }
.mlv-tab tfoot td{ border-top:1px solid var(--line) !important; font-weight:700; background:var(--bg-2); }

/* ---------- 5. para onde vai cada R$ 100 ---------- */
.mlv-casc{ display:grid; grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr); gap:14px 28px; align-items:start; }
.mlv-casc-l{ display:flex; flex-direction:column; gap:7px; }
.mlv-casc-r{ display:grid; grid-template-columns:minmax(110px,150px) minmax(0,1fr) 128px; align-items:center; gap:12px; font-size:12.5px; }
.mlv-casc-r > span:first-child{ color:var(--ink-2); font-weight:600; }
.mlv-casc-r.total > span:first-child, .mlv-casc-r.margem > span:first-child{ color:var(--ink); font-weight:700; }
.mlv-casc-trilho{ position:relative; height:20px; border-radius:3px; }
.mlv-casc-trilho::before{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--line-soft); }
.mlv-casc-trilho b{ position:absolute; top:2px; bottom:2px; border-radius:3px; background:var(--mlv-ded); min-width:2px; }
.mlv-casc-r.total .mlv-casc-trilho b{ background:var(--mlv-tot); }
.mlv-casc-r.margem .mlv-casc-trilho b{ background:var(--mlv-s1); }
.mlv-casc-r.margem.neg .mlv-casc-trilho b{ background:var(--red); }
.mlv-casc-r > em{ font-style:normal; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.mlv-casc-r > em b{ font-weight:800; color:var(--ink); }
.mlv-casc-r > em small{ display:block; font-size:11px; color:var(--ink-3); }
.mlv-casc-zero{ position:absolute; top:-3px; bottom:-3px; width:1px; background:var(--line-2); }
.mlv-casc-lado{ display:flex; flex-direction:column; gap:10px; padding:12px 14px; background:var(--bg-2); border-radius:10px; }
.mlv-casc-lado .grande{ font-size:28px; font-weight:800; letter-spacing:-.02em; line-height:1.05; color:var(--ink); }
.mlv-casc-lado .grande.neg{ color:var(--red); }
.mlv-casc-lado p{ margin:0; font-size:12.5px; color:var(--ink-2); line-height:1.45; }
.mlv-casc-lado p b{ color:var(--ink); }

/* ---------- 6. top anúncios + curva ABC ---------- */
.mlv-top{ display:grid; grid-template-columns:minmax(0,2.3fr) minmax(250px,1fr); gap:16px; align-items:start; }
.mlv-tab--top{ min-width:600px; } .mlv-tab--top.com-margem{ min-width:670px; }
.mlv-tab--top td{ vertical-align:middle; }
.mlv-pos-m{ display:none; }
.mlv-tit{ display:block; max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.mlv-sub{ display:flex; gap:8px; align-items:center; margin-top:1px; font-size:11px; color:var(--ink-3); }
.mlv-mlb{ font-family:ui-monospace,'JetBrains Mono',monospace; font-size:11px; font-weight:600; color:var(--accent-ink); text-decoration:none; }
.mlv-mlb:hover{ text-decoration:underline; }
.mlv-barrinha{ display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.mlv-barrinha i{ position:relative; width:44px; height:6px; border-radius:3px; background:var(--line-soft); overflow:hidden; }
.mlv-barrinha i b{ position:absolute; left:0; top:0; bottom:0; border-radius:3px; background:var(--mlv-s1); }
.mlv-classe{ display:inline-grid; place-items:center; width:22px; height:22px; border-radius:6px; font-size:11.5px; font-weight:800; }
.mlv-classe.A{ background:var(--brand-strong); color:var(--on-accent); }
.mlv-classe.B{ background:var(--accent-soft); color:var(--accent-ink); }
.mlv-classe.C{ background:var(--chip); color:var(--ink-2); }
.mlv-abc-nota{ margin-top:8px; font-size:11.5px; color:var(--ink-3); line-height:1.45; }

/* ---------- 7. pedidos ---------- */
.mlv-busca{ display:flex; align-items:center; gap:8px; height:34px; width:min(320px,100%); padding:0 12px; border:1px solid var(--line-2); border-radius:999px; background:var(--input); color:var(--ink-3); }
.mlv-busca:focus-within{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
/* especificidade acima do input[type="search"]{… !important} do portal-2026.css, que carrega depois */
.mlv .mlv-busca input[type="search"], .mlv .mlv-busca input[type="search"]:focus{ flex:1; min-width:0; height:100%; min-height:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; outline:0 !important; background:transparent !important; box-shadow:none !important; font:inherit; font-size:12.5px; color:var(--ink) !important; }
.mlv .mlv-busca input[type="search"]::-webkit-search-cancel-button{ cursor:pointer; }
.mlv-busca svg{ width:15px; height:15px; }
.mlv-tab--ped{ min-width:860px; }
.mlv-tab--ped th, .mlv-tab--ped td{ padding-left:7px; padding-right:7px; }
.mlv-tab--ped th:first-child, .mlv-tab--ped td:first-child{ padding-left:12px; } .mlv-tab--ped th:last-child, .mlv-tab--ped td:last-child{ padding-right:12px; }
.mlv-tab--ped .mlv-mono{ font-size:11px; }
.mlv-tab--ped tbody tr{ cursor:pointer; }
.mlv-tab--ped tbody tr:hover td{ background:var(--accent-50) !important; }
.mlv-tab--ped tbody tr:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
.mlv-tab--ped tbody tr.cancelado td:not(:last-child){ color:var(--ink-3); }
.mlv-itens{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:3px; min-width:170px; max-width:215px; }
.mlv-itens li{ display:flex; align-items:baseline; gap:6px; min-width:0; }
.mlv-itens li > b{ flex:none; font-weight:800; color:var(--ink); }
.mlv-itens li > span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mlv-itens li > em{ flex:none; font-style:normal; font-family:ui-monospace,'JetBrains Mono',monospace; font-size:11px; color:var(--ink-3); }
.mlv-sel{ display:inline-flex; align-items:center; gap:4px; padding:2px 8px 2px 6px; border-radius:999px; font-size:11px; font-weight:700; white-space:nowrap; line-height:1.45; }
.mlv-sel svg{ width:12px; height:12px; }
.mlv-sel.bom{ background:var(--good-soft); color:var(--good); }
.mlv-sel.aviso{ background:var(--amber-soft); color:var(--amber); }
.mlv-sel.ruim{ background:var(--red-soft); color:var(--red); }
.mlv-sel.neutro{ background:var(--chip); color:var(--ink-2); }
.mlv-neg{ color:var(--red); font-weight:700; }
.mlv-pag{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; font-size:12px; color:var(--ink-3); }
.mlv-pag > div{ display:flex; gap:6px; }
.mlv-pag button{ height:30px; min-width:34px; padding:0 10px; border:1px solid var(--line); border-radius:999px; background:var(--panel); color:var(--ink-2); font:inherit; font-weight:700; cursor:pointer; }
.mlv-pag button:disabled{ opacity:.4; cursor:default; }
.mlv-vazio{ padding:28px 12px; text-align:center; font-size:12.5px; color:var(--ink-3); }

/* ---------- dica (sparkline e cascata) ---------- */
#mlvTip{ position:fixed; z-index:10060; pointer-events:none; opacity:0; transition:opacity .1s; background:var(--mlv-tip-bg); color:var(--mlv-tip-ink); border-radius:10px; padding:8px 11px; font:12px/1.4 var(--font-body); box-shadow:0 12px 28px rgba(8,20,16,.35); max-width:260px; }
#mlvTip b{ display:block; font-size:13px; font-weight:800; font-variant-numeric:tabular-nums; }
#mlvTip span{ opacity:.75; }

/* ---------- gaveta do pedido ---------- */
#mlvGaveta{ position:fixed; inset:0; z-index:10040; display:flex; justify-content:flex-end; }
#mlvGaveta .mlv-gv-fundo{ position:absolute; inset:0; background:rgba(14,35,29,.42); opacity:0; transition:opacity .18s; }
#mlvGaveta .mlv-gv{ position:relative; width:580px; max-width:100%; height:100%; display:flex; flex-direction:column; background:var(--panel); border-left:1px solid var(--line); box-shadow:var(--e3); transform:translateX(24px); opacity:0; transition:transform .2s var(--ease), opacity .2s; outline:none; color:var(--ink); font-family:var(--font-body); }
#mlvGaveta.aberta .mlv-gv-fundo{ opacity:1; }
#mlvGaveta.aberta .mlv-gv{ transform:none; opacity:1; }
#mlvGaveta .mlv-gv-h{ display:flex; align-items:flex-start; gap:12px; padding:16px 18px 13px; border-bottom:1px solid var(--line-soft); }
#mlvGaveta .mlv-gv-over{ font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); }
#mlvGaveta .mlv-gv-t{ margin:1px 0 0; font-size:18px !important; font-weight:800; letter-spacing:-.01em; color:var(--ink) !important; font-family:ui-monospace,'JetBrains Mono',monospace !important; }
#mlvGaveta .mlv-gv-m{ display:flex; align-items:center; gap:6px 10px; flex-wrap:wrap; margin-top:6px; font-size:12px; color:var(--ink-3); }
#mlvGaveta .mlv-gv-x{ margin-left:auto; width:34px; height:34px; flex:none; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--ink-2); cursor:pointer; }
#mlvGaveta .mlv-gv-x:hover{ background:var(--hover); }
#mlvGaveta .mlv-gv-x svg{ width:16px; height:16px; }
#mlvGaveta .mlv-gv-b{ flex:1; overflow:auto; padding:14px 18px 22px; display:flex; flex-direction:column; gap:18px; }
#mlvGaveta .mlv-gv-f{ display:flex; gap:8px; flex-wrap:wrap; padding:12px 18px; border-top:1px solid var(--line-soft); }
#mlvGaveta .mlv-sec-t{ display:flex; align-items:center; gap:8px; margin:0 0 8px; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); }
#mlvGaveta .mlv-sec-t .mlv-sel{ letter-spacing:0; text-transform:none; }
#mlvGaveta .mlv-gv-itens{ display:flex; flex-direction:column; border:1px solid var(--line); border-radius:10px; overflow:hidden; }
#mlvGaveta .mlv-gv-item{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:4px 10px; align-items:baseline; padding:9px 12px; border-top:1px solid var(--line-soft); font-size:12.5px; }
#mlvGaveta .mlv-gv-item:first-child{ border-top:0; }
#mlvGaveta .mlv-gv-item > b{ font-weight:800; }
#mlvGaveta .mlv-gv-item > div{ min-width:0; }
#mlvGaveta .mlv-gv-item > div > span{ display:block; font-weight:600; overflow-wrap:anywhere; }
#mlvGaveta .mlv-gv-item > div > small{ display:flex; gap:8px; flex-wrap:wrap; margin-top:2px; font-size:11px; color:var(--ink-3); }
#mlvGaveta .mlv-gv-item > em{ font-style:normal; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; font-weight:700; }
#mlvGaveta .mlv-gv-item > em small{ display:block; font-weight:500; font-size:11px; color:var(--ink-3); }
#mlvGaveta .mlv-kv{ display:grid; grid-template-columns:1fr 1fr; gap:0 18px; margin:0; font-size:12.5px; }
#mlvGaveta .mlv-kv > div{ display:flex; justify-content:space-between; gap:10px; padding:6px 0; border-bottom:1px solid var(--line-soft); min-width:0; }
#mlvGaveta .mlv-kv dt{ color:var(--ink-3); white-space:nowrap; }
#mlvGaveta .mlv-kv dd{ margin:0; font-weight:600; text-align:right; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
#mlvGaveta .mlv-kv > div.cheia{ grid-column:1 / -1; }
#mlvGaveta .mlv-up{ border:1px solid var(--accent-line); border-radius:12px; background:var(--accent-50); padding:12px 14px 14px; display:flex; flex-direction:column; gap:12px; }
#mlvGaveta .mlv-up-h{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap; }
#mlvGaveta .mlv-up-h h3{ margin:0; font-size:14px !important; font-weight:800; color:var(--ink) !important; }
#mlvGaveta .mlv-up-h p{ margin:2px 0 0; font-size:11.5px; color:var(--ink-3); }
#mlvGaveta .mlv-campos{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
#mlvGaveta .mlv-campo{ background:var(--panel); border:1px solid var(--line); border-radius:9px; padding:7px 10px; min-width:0; }
#mlvGaveta .mlv-campo.cheio{ grid-column:1 / -1; }
#mlvGaveta .mlv-campo small{ display:flex; justify-content:space-between; gap:8px; font-size:10.5px; font-weight:600; color:var(--ink-3); }
#mlvGaveta .mlv-campo small code{ font-family:ui-monospace,'JetBrains Mono',monospace; font-size:10px; color:var(--ink-3); }
#mlvGaveta .mlv-campo b{ display:block; margin-top:2px; font-size:13px; font-weight:700; color:var(--ink); overflow-wrap:anywhere; }
#mlvGaveta .mlv-campo b em{ font-style:normal; font-weight:500; color:var(--ink-3); }
#mlvGaveta .mlv-campo pre{ margin:3px 0 0; white-space:pre-wrap; font:600 12px/1.45 ui-monospace,'JetBrains Mono',monospace; color:var(--ink); overflow-wrap:anywhere; }
#mlvGaveta .mlv-up .mlv-tabwrap{ background:var(--panel); }
#mlvGaveta .mlv-lista{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
#mlvGaveta .mlv-lista li{ display:flex; gap:8px; align-items:flex-start; font-size:12.5px; line-height:1.45; color:var(--ink-2); }
#mlvGaveta .mlv-lista li svg{ width:15px; height:15px; margin-top:2px; }
#mlvGaveta .mlv-lista.avisos li svg{ color:var(--amber); }
#mlvGaveta .mlv-lista.conf li svg{ color:var(--ink-3); }
#mlvGaveta .mlv-sub-t{ font-size:11px; font-weight:700; color:var(--ink-2); margin:0 0 6px; }
#mlvGaveta .mlv-sub-t .mlv-mut{ font-weight:500; }
/* (revisão de 29/10/2026): conta do pedido — itens (ML → pedido + IPI) e, na mesma coluna da direita, soma, IPI, desconto
   ou acréscimo, total do pedido e a venda no ML com o selo; números tabulares para a conta fechar de relance */
#mlvGaveta .mlv-tab--conta th, #mlvGaveta .mlv-tab--conta td{ padding:7px 8px; }
#mlvGaveta .mlv-tab--conta th:first-child, #mlvGaveta .mlv-tab--conta td:first-child{ padding-left:10px; }
#mlvGaveta .mlv-tab--conta th:last-child, #mlvGaveta .mlv-tab--conta td:last-child{ padding-right:10px; }
#mlvGaveta .mlv-tab--conta tbody td{ vertical-align:baseline; white-space:nowrap; }
#mlvGaveta .mlv-tab--conta tbody td small{ display:block; font-size:10.5px; font-weight:500; color:var(--ink-3); }
#mlvGaveta .mlv-tab--conta .seta{ margin-right:4px; color:var(--ink-3); font-weight:600; }
#mlvGaveta .mlv-tab--conta tbody td small.aviso{ color:var(--amber); font-weight:700; }
#mlvGaveta .mlv-conta .mlv-lista{ margin-top:8px; }
/* cor com !important: o portal-2026-dark.css (gerado) pinta todo tfoot td de teal com !important */
#mlvGaveta .mlv-tab--conta tfoot td{ padding-top:3px; padding-bottom:3px; border-top:0 !important; background:none; font-weight:600; color:var(--ink-2) !important; }
#mlvGaveta .mlv-tab--conta tfoot tr:first-child td{ padding-top:9px; border-top:1px solid var(--line) !important; }
#mlvGaveta .mlv-tab--conta tfoot td:last-child{ min-width:104px; color:var(--ink) !important; }
#mlvGaveta .mlv-tab--conta tfoot em{ font-style:normal; font-weight:500; color:var(--ink-3); }
#mlvGaveta .mlv-tab--conta tfoot code{ margin-left:4px; font-family:ui-monospace,'JetBrains Mono',monospace; font-size:10px; font-weight:500; color:var(--ink-3); }
#mlvGaveta .mlv-tab--conta tfoot .op{ float:left; width:12px; margin-right:6px; text-align:center; font-weight:800; color:var(--ink-3); }
#mlvGaveta .mlv-tab--conta tfoot tr.nada td{ color:var(--ink-3) !important; }
#mlvGaveta .mlv-tab--conta tfoot tr.total td{ padding-top:7px; padding-bottom:7px; border-top:1px solid var(--line-2) !important; font-size:14px; font-weight:800; color:var(--ink) !important; }
#mlvGaveta .mlv-tab--conta tfoot tr.ml td{ padding-top:7px; padding-bottom:8px; background:var(--bg-2); font-weight:700; color:var(--ink) !important; }
#mlvGaveta .mlv-tab--conta tfoot tr.ml td:first-child{ white-space:normal; }
#mlvGaveta .mlv-tab--conta tfoot tr.ml .mlv-sel{ margin-right:8px; vertical-align:1px; }
/* (revisão de 29/10/2026): os selos novos da conta são longos ("fecha com acréscimo: conferir no primeiro pedido"); quebram em vez de alargar a tabela */
#mlvGaveta .mlv-tab--conta tfoot tr.ml .mlv-sel{ white-space:normal; text-align:left; }

/* ---------- larguras (pela largura do painel, não da janela) ---------- */
@container mlv (max-width: 1080px){
  .mlv-res{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mlv-rc--3{ grid-column:span 2; }
  .mlv-top{ grid-template-columns:minmax(0,1fr); }
  .mlv-plot--abc{ height:220px; }
}
@container mlv (max-width: 860px){
  .mlv-linha{ grid-template-columns:minmax(0,1fr); }
  .mlv-casc{ grid-template-columns:minmax(0,1fr); }
  .mlv-rep{ grid-template-columns:minmax(0,1fr); }
}
@container mlv (max-width: 620px){
  .mlv-res{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mlv-rc--2, .mlv-rc--3{ grid-column:span 2; }
  .mlv-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .mlv-kpi{ padding:10px 12px 8px; }
  .mlv-kpi-v{ font-size:20px; }
  .mlv-barra-fim{ margin-left:0; width:100%; justify-content:space-between; }
  .mlv-datas{ width:100%; } .mlv-datas input{ flex:1; min-width:0; }
  .mlv-card{ padding:12px 12px; }
  .mlv-plot, .mlv-plot--p{ height:200px; }
  .mlv-casc-r{ grid-template-columns:minmax(0,1fr) 112px; gap:4px 10px; }
  .mlv-casc-r > .mlv-casc-trilho{ grid-column:1 / -1; grid-row:2; }
  .mlv-busca{ width:100%; height:44px; }
  .mlv-pil, .mlv-btn{ height:40px; }
  .mlv-rc--fim{ grid-column:span 2; }
  /* anúncios viram cartões */
  .mlv-top .mlv-tabwrap{ border:0; overflow:visible; }
  .mlv-tab--top, .mlv-tab--top.com-margem{ min-width:0; }
  .mlv-tab--top thead{ display:none; }
  .mlv-tab--top tbody{ display:flex; flex-direction:column; }
  .mlv-tab--top tbody tr{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px 10px; padding:10px 0; border-top:1px solid var(--line-soft); }
  .mlv-tab--top tbody tr:hover td{ background:none !important; }
  .mlv-tab--top tbody tr:first-child{ border-top:0; padding-top:0; }
  .mlv-tab--top td{ display:flex; flex-direction:column; align-items:flex-start; gap:1px; padding:0; border:0 !important; text-align:left; min-width:0; }
  .mlv-tab--top td::before{ content:attr(data-l); font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); }
  .mlv-tab--top td.pos{ display:none; }
  .mlv-tab--top td.anuncio{ grid-column:1 / -1; }
  .mlv-tab--top td.anuncio::before{ content:none; }
  .mlv-tab--top .mlv-tit{ max-width:100%; }
  .mlv-pos-m{ display:inline; color:var(--ink-3); }
  .mlv-tab--top .mlv-barrinha i{ display:none; }
  /* pedidos viram cartões */
  .mlv-tabwrap--ped{ border:0; overflow:visible; }
  .mlv-tab--ped{ min-width:0; }
  .mlv-tab--ped thead{ display:none; }
  .mlv-tab--ped tbody{ display:flex; flex-direction:column; gap:8px; }
  .mlv-tab--ped tbody tr{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
  .mlv-tab--ped tbody td{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; padding:3px 0; border:0 !important; min-width:0; }
  .mlv-tab--ped tbody td::before{ content:attr(data-l); font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); }
  .mlv-tab--ped tbody td.larga{ grid-column:1 / -1; flex-direction:column; align-items:stretch; }
  .mlv-tab--ped .mlv-itens{ min-width:0; max-width:none; }
  .mlv-tab--ped tbody tr:hover td{ background:none !important; }
}
@media (max-width: 620px){
  #mlvGaveta .mlv-kv, #mlvGaveta .mlv-campos{ grid-template-columns:minmax(0,1fr); }
  #mlvGaveta .mlv-gv-b{ padding:12px 14px 20px; }
  /* (revisão de 29/10/2026): a conta cabe em 390 px sem rolar — menos respiro e a quantidade quebra sobre o código */
  #mlvGaveta .mlv-up{ padding:12px 10px 12px; }
  #mlvGaveta .mlv-tab--conta{ font-size:12px; }
  #mlvGaveta .mlv-tab--conta th, #mlvGaveta .mlv-tab--conta td{ padding-left:4px; padding-right:4px; }
  #mlvGaveta .mlv-tab--conta th:first-child, #mlvGaveta .mlv-tab--conta td:first-child{ padding-left:8px; }
  #mlvGaveta .mlv-tab--conta th:last-child, #mlvGaveta .mlv-tab--conta td:last-child{ padding-right:8px; }
  #mlvGaveta .mlv-tab--conta th{ letter-spacing:.02em; }
  #mlvGaveta .mlv-tab--conta tbody td:first-child{ white-space:normal; }
  #mlvGaveta .mlv-tab--conta .seta{ margin-right:2px; }
  #mlvGaveta .mlv-tab--conta tfoot td:last-child{ min-width:0; }
  #mlvGaveta .mlv-tab--conta tfoot .op{ width:10px; margin-right:3px; }
  /* (revisão de 29/10/2026): com a coluna CFOP nos itens, o selo da origem quebra para a tabela caber em 390 px */
  #mlvGaveta .mlv-up .mlv-tab:not(.mlv-tab--conta) .mlv-sel{ white-space:normal; }
}
@media (prefers-reduced-motion: reduce){
  #mlvGaveta .mlv-gv, #mlvGaveta .mlv-gv-fundo, .mlv-card{ transition:none; }
}
