/* DROP OS — visual v2, Fase 3: conteúdo das abas do grupo "Vender" do painel do lojista (admin.html).
   Abas: overview, funil, products, orders, relatorios, adquirentes, rastreio, customers, leads, recuperacao, remarketing,
   mais a saudação, a faixa do Telegram, os modais de pedido/produto e o ms-modal (criar loja).
   Origem: dropchck (Lovable) — OverviewSection, OrderSections, ProductsSection, AcquirersSection, ConversionRing,
   MerchantInsights, camada .merchant-* de src/index.css e components/ui (table, badge, card, button, input, dialog, tabs).
   Regras: tudo escopado em html[data-ui="v2"]; nenhum ID/classe muda; nenhuma regra aqui define `display` de elemento
   que o JS mostra/esconde (só de pseudo-elementos e de contêineres de layout que o JS nunca alterna).
   Os temas data-appearance do v1 ficam neutros nestas telas: as variáveis e superfícies abaixo vencem os seletores deles
   (dois IDs + !important). Gerado por gen-vender.cjs a partir deste arquivo (macros html[data-ui="v2"] body.dropos-workspace html[data-ui="v2"][data-theme="light"] body.dropos-workspace html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) html[data-ui="v2"][data-theme="light"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) @LM). */

html[data-ui="v2"] {
  --v2i-inbox: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpolyline%20points%3D%2722%2012%2016%2012%2014%2015%2010%2015%208%2012%202%2012%27%2F%3E%3Cpath%20d%3D%27M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z%27%2F%3E%3C%2Fsvg%3E");
  --v2i-arrow-up-right: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M7%207h10v10%27%2F%3E%3Cpath%20d%3D%27M7%2017%2017%207%27%2F%3E%3C%2Fsvg%3E");
  --v2i-trophy: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%209H4.5a2.5%202.5%200%200%201%200-5H6%27%2F%3E%3Cpath%20d%3D%27M18%209h1.5a2.5%202.5%200%200%200%200-5H18%27%2F%3E%3Cpath%20d%3D%27M4%2022h16%27%2F%3E%3Cpath%20d%3D%27M10%2014.66V17c0%20.55-.47.98-.97%201.21C7.85%2018.75%207%2020.24%207%2022%27%2F%3E%3Cpath%20d%3D%27M14%2014.66V17c0%20.55.47.98.97%201.21C16.15%2018.75%2017%2020.24%2017%2022%27%2F%3E%3Cpath%20d%3D%27M18%202H6v7a6%206%200%200%200%2012%200V2Z%27%2F%3E%3C%2Fsvg%3E");
  --v2i-download: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M21%2015v4a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2v-4%27%2F%3E%3Cpolyline%20points%3D%277%2010%2012%2015%2017%2010%27%2F%3E%3Cline%20x1%3D%2712%27%20x2%3D%2712%27%20y1%3D%2715%27%20y2%3D%273%27%2F%3E%3C%2Fsvg%3E");
  --v2i-chevron-down-mut: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27hsl(240%2C7%25%2C64%25)%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m6%209%206%206%206-6%27%2F%3E%3C%2Fsvg%3E");
  --v2i-search-mut: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27hsl(240%2C7%25%2C64%25)%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2711%27%20cy%3D%2711%27%20r%3D%278%27%2F%3E%3Cpath%20d%3D%27m21%2021-4.3-4.3%27%2F%3E%3C%2Fsvg%3E");
  --v2-v-ease: cubic-bezier(0, 0, .2, 1);
}

/* ======================================================================================================
   1. Paleta do v1 trocada pela do Lovable SÓ dentro das abas Vender e dos modais delas.
      As outras abas (Fases 4 e 5) continuam com a paleta do v1 — nada de "claro pela metade" nelas.
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) {
  --bg: hsl(var(--v2-background)); --panel: hsl(var(--v2-card)); --panel2: hsl(var(--v2-muted));
  --card: hsl(var(--v2-card)); --card2: hsl(var(--v2-muted)); --surface-2: hsl(var(--v2-muted));
  --line: hsl(var(--v2-border)); --line2: hsl(var(--v2-border)); --line-2: hsl(var(--v2-input)); --line-hot: hsl(var(--v2-primary) / .3);
  --ink: hsl(var(--v2-foreground)); --ink-2: hsl(var(--v2-foreground)); --text: hsl(var(--v2-foreground));
  --mut: hsl(var(--v2-muted-foreground)); --muted: hsl(var(--v2-muted-foreground)); --dim: hsl(var(--v2-muted-foreground)); --muted-2: hsl(var(--v2-muted-foreground));
  --red: hsl(var(--v2-primary)); --red2: hsl(var(--v2-primary-deep)); --red-deep: hsl(var(--v2-primary-deep)); --red-b: hsl(var(--v2-primary-glow));
  --red-soft: hsl(var(--v2-primary) / .08); --brand: hsl(var(--v2-primary)); --brand3: hsl(var(--v2-primary)); --brand-hover: hsl(var(--v2-primary) / .9);
  --brand2: hsl(var(--v2-primary-deep)); --brand-dark: hsl(var(--v2-primary-deep)); --grad: hsl(var(--v2-primary));
  --glow: none; --glow-sm: none; --lift: none; --focus: 0 0 0 2px hsl(var(--v2-primary) / .2);
  --ok: hsl(var(--v2-success)); --warn: hsl(var(--v2-warning));
  --r: var(--v2-radius); --r-sm: calc(var(--v2-radius) - 2px); --h: 40px;
  --mono: var(--v2-font-mono); --dw-font: var(--v2-font-sans);
  --shadow-md: var(--v2-merchant-shadow); --shadow-lg: 0 25px 50px -12px hsl(var(--v2-primary) / .05);
  --dw-scene: hsl(var(--v2-background)); --dw-scene-line: hsl(var(--v2-border)); --dw-scene-card: hsl(var(--v2-card)); --studio-radius: var(--v2-radius);
  --dw-edge: hsl(var(--v2-border)); --dw-accent: hsl(var(--v2-primary));
  color: hsl(var(--v2-foreground)); color-scheme: dark;
}
html[data-ui="v2"][data-theme="light"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView), html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) { color-scheme: light; }

/* Texto base: Manrope, sem o letter-spacing/uppercase de terminal do v1 */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(h1, h2, h3, h4) { font-family: var(--v2-font-sans) !important; font-weight: 700 !important; color: hsl(var(--v2-foreground)) !important; letter-spacing: normal !important; text-transform: none !important; text-shadow: none !important; animation: none !important; }
/* títulos de página dentro das abas = SectionHeading do Lovable (.merchant-main h2.font-display: Rajdhani 2rem 700) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(h1, h2) { font-family: var(--v2-font-display) !important; font-size: 2rem !important; line-height: 1.15 !important; }
/* títulos de seção (h2 dentro dos painéis dos Relatórios) = .merchant-section-title */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rp-panel h2 { font-family: var(--v2-font-sans) !important; font-size: .95rem !important; line-height: 1.4 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .muted { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.mono, code) { font-family: var(--v2-font-mono) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .num { font-family: var(--v2-font-sans) !important; font-weight: 600 !important; color: hsl(var(--v2-foreground)) !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) a:not(.btn) { color: hsl(var(--v2-primary)); }

/* ======================================================================================================
   2. Superfícies: Card do Lovable (rounded-lg, border, bg-card, sombra merchant) — sem gradiente, brilho nem neon
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.panel, .vg-card, .rt-card, .rp-panel, .rmk-card, .card-item, .rc-painel, .acc-gate) {
  background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important;
  border-radius: var(--v2-radius) !important; box-shadow: var(--v2-merchant-shadow) !important;
  color: hsl(var(--v2-card-foreground)); backdrop-filter: none !important; filter: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.panel, .vg-card, .rt-card, .rp-panel, .rmk-card, .card-item, .rc-painel)::before,
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.panel, .vg-card, .rt-card, .rp-panel, .rmk-card, .card-item, .rc-painel)::after { content: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .dw-motion-card:hover { translate: none !important; border-color: hsl(var(--v2-border)) !important; box-shadow: var(--v2-merchant-shadow) !important; }
/* Títulos de seção (.merchant-section-title: .95rem / 700) e subtítulos (text-xs muted) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-card, .panel, .rp-panel, .rt-card) > h3,
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-card, .panel) .ov-rank-head > h3 {
  font-size: .95rem !important; font-weight: 700 !important; line-height: 1.4 !important; margin: 0 0 .25rem !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.c-sub, .vg-sub, .rp-help) { font-size: 12px !important; color: hsl(var(--v2-muted-foreground)) !important; font-family: var(--v2-font-sans) !important; letter-spacing: normal !important; }

/* ======================================================================================================
   3. KPIs (.merchant-kpi): card 8px, padding 1.25rem, rótulo 12px, ícone 30px muted, valor Rajdhani 2.2rem 700.
      Faturamento = tom success (borda superior + valor verde), Pagos = tom primary.
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi, .rz-card, .rp-kpi, .rt-stat, .acc-stat) {
  position: relative; min-width: 0; padding: 1.25rem !important; margin: 0 !important;
  background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important;
  border-radius: 8px !important; box-shadow: var(--v2-merchant-shadow) !important; color: hsl(var(--v2-card-foreground)) !important;
  transform: none !important; translate: none !important; filter: none !important; animation: none !important; overflow: hidden;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi, .rz-card, .rp-kpi, .rt-stat, .acc-stat)::before,
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi, .rz-card, .rp-kpi, .rt-stat, .acc-stat)::after { content: none !important; animation: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi, .rz-card, .rp-kpi):hover { border-color: hsl(var(--v2-border)) !important; box-shadow: var(--v2-merchant-shadow) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi.rev, .rz-card.rz-ok) { border-top: 2px solid hsl(var(--v2-success) / .6) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-kpi:nth-child(2), html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rz-card.rz-accent { border-top: 2px solid hsl(var(--v2-primary) / .6) !important; }
/* Grade dos KPIs (.merchant-kpis: gap .85rem; 4 colunas no lg, 2 abaixo) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-kpis {
  gap: .85rem !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; overflow: visible !important; margin: 0 !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-kpis > * { border-radius: 8px !important; border: 1px solid hsl(var(--v2-border)) !important; background: hsl(var(--v2-card)) !important; box-shadow: var(--v2-merchant-shadow) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-kpis > .vg-kpi.rev { border-top: 2px solid hsl(var(--v2-success) / .6) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-kpis > .vg-kpi:nth-child(2) { border-top: 2px solid hsl(var(--v2-primary) / .6) !important; }
/* rótulo + ícone */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-kpi .k-top { gap: .5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-lab, .rz-k, .rp-kpi > span, .rt-stat .l) {
  font-family: var(--v2-font-sans) !important; font-size: 12px !important; font-weight: 500 !important; line-height: 16px !important;
  text-transform: none !important; letter-spacing: normal !important; color: hsl(var(--v2-muted-foreground)) !important; animation: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-ico, .rz-ic) {
  position: static !important; float: none; width: 30px !important; height: 30px !important; border-radius: 6px !important; border: 0 !important;
  background: hsl(var(--v2-muted)) !important; color: hsl(var(--v2-muted-foreground)) !important; box-shadow: none !important; animation: none !important; transform: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rz-card .rz-ic { position: absolute !important; top: 1.25rem !important; right: 1.25rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-ico, .rz-ic) svg { width: 16px !important; height: 16px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi.rev .k-ico, .rz-ok .rz-ic) { background: hsl(var(--v2-success) / .1) !important; color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(#overviewContent .vg-kpi:nth-child(2) .k-ico, .rz-accent .rz-ic) { background: hsl(var(--v2-primary) / .08) !important; color: hsl(var(--v2-primary)) !important; }
/* valor */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-val, .rz-v, .rp-kpi > b, .rt-stat .n) {
  font-family: var(--v2-font-display) !important; font-size: 2.2rem !important; font-weight: 700 !important; line-height: 1.15 !important;
  letter-spacing: normal !important; margin-top: 1rem !important; overflow-wrap: anywhere; font-variant-numeric: normal !important;
  color: hsl(var(--v2-foreground)) !important; -webkit-text-fill-color: currentColor !important; background: none !important;
  text-shadow: none !important; filter: none !important; animation: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi.rev .k-val, .rz-v.rz-green) { color: hsl(var(--v2-success)) !important; }
/* nota abaixo do valor (text-[11px] muted, mt-3) e variação */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-dica, .rz-s, .rp-kpi > small) { font-family: var(--v2-font-sans) !important; font-size: 11px !important; line-height: 1.45 !important; color: hsl(var(--v2-muted-foreground)) !important; margin-top: .5rem !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rz-s.rz-green { color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-kpi .k-var { font-family: var(--v2-font-sans) !important; font-size: 11px !important; font-weight: 500 !important; margin-top: .75rem !important; padding: 0 !important; background: none !important; border: 0 !important; animation: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-kpi .k-var.up { color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-kpi .k-var.down { color: hsl(var(--v2-destructive)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-kpi .k-var.flat { color: hsl(var(--v2-muted-foreground)) !important; }

/* ======================================================================================================
   4. Botões (ui/button): default = primary; outline; ghost; sm = 36px; raio 8; hover sobe 2px; active 0.97
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn, .details-btn, .rc-fbt, .vg-pill, .plat-btn),
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn, .ms-ghost, .ms-go) {
  align-items: center; justify-content: center; gap: .5rem; white-space: nowrap;
  height: 40px !important; min-height: 40px !important; padding: 0 1.25rem !important; margin: 0;
  border: 1px solid hsl(var(--v2-input)) !important; border-radius: var(--v2-radius) !important;
  background: hsl(var(--v2-background)) !important; color: hsl(var(--v2-foreground)) !important; box-shadow: none !important;
  font-family: var(--v2-font-sans) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 20px !important;
  letter-spacing: normal !important; text-transform: none !important; text-shadow: none !important; filter: none !important;
  transition: all .2s var(--v2-v-ease) !important; transform: none; cursor: pointer;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn, .details-btn, .rc-fbt, .vg-pill, .plat-btn):hover:not(:disabled),
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn, .ms-ghost):hover:not(:disabled) {
  background: hsl(var(--v2-accent) / .5) !important; border-color: hsl(var(--v2-accent)) !important; color: hsl(var(--v2-accent-foreground)) !important; transform: translateY(-2px);
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn, .details-btn, .rc-fbt, .vg-pill, .plat-btn):active:not(:disabled), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn, .ms-ghost, .ms-go):active:not(:disabled) { transform: scale(.97); }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn, .details-btn, .rc-fbt, .vg-pill, .plat-btn):focus-visible, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn, .ms-ghost, .ms-go):focus-visible {
  outline: none !important; box-shadow: 0 0 0 2px hsl(var(--v2-background)), 0 0 0 4px hsl(var(--v2-ring)) !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn, .details-btn, .rc-fbt, .vg-pill, .plat-btn):disabled, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn, .ms-go):disabled { opacity: .5 !important; pointer-events: none; transform: none !important; }
/* default (primary) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn.brand, .btn.pri, .btn.primary, .btn-primary, .rc-fbt.on, .vg-pill.on, .rc-gerar, .btn.on),
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn.brand, .btn.pri, .btn-primary, .ms-go) {
  background: hsl(var(--v2-primary)) !important; border-color: transparent !important; color: hsl(var(--v2-primary-foreground)) !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn.brand, .btn.pri, .btn.primary, .btn-primary, .rc-fbt.on, .vg-pill.on, .rc-gerar, .btn.on):hover:not(:disabled),
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.btn.brand, .btn.pri, .btn-primary, .ms-go):hover:not(:disabled) {
  background: hsl(var(--v2-primary) / .9) !important; border-color: transparent !important; color: hsl(var(--v2-primary-foreground)) !important;
  box-shadow: 0 10px 15px -3px hsl(var(--v2-primary) / .2), 0 4px 6px -4px hsl(var(--v2-primary) / .2) !important; transform: translateY(-2px);
}
/* filtros do remarketing: o JS marca o ativo por cor no style (#fe2c55 / #16a34a / #334155) -> Button default */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .btn:is([style*="background:#fe2c55"], [style*="background:#16a34a"], [style*="background:#334155"]) {
  background: hsl(var(--v2-primary)) !important; border-color: transparent !important; color: hsl(var(--v2-primary-foreground)) !important;
}
/* sm (h-9 px-4) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn.sm, .btn.small, .details-btn, .vg-pill, .rc-fbt, .plat-btn), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .btn.sm { height: 36px !important; min-height: 36px !important; padding: 0 1rem !important; }
/* destrutivo: texto destructive (Trash2 do Lovable usa text-destructive no ghost) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .btn.danger:not(.pri):not(.brand) { color: hsl(var(--v2-destructive)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .btn.danger:not(.pri):not(.brand):hover:not(:disabled) { background: hsl(var(--v2-destructive) / .08) !important; border-color: hsl(var(--v2-destructive) / .3) !important; color: hsl(var(--v2-destructive)) !important; }
/* .btn.is-loading: mantém o giro do v1 visível no tema */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .btn.is-loading { color: transparent !important; }

/* ======================================================================================================
   5. Campos (ui/input): h-10, rounded-xl, borda input/80, fundo background/80, px-4, text-sm; hover primary/30; foco anel primary/20
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), select, textarea),
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), select, textarea) {
  min-height: 40px !important; height: auto; border: 1px solid hsl(var(--v2-input) / .8) !important; border-radius: .75rem !important;
  background-color: hsl(var(--v2-background) / .8) !important; color: hsl(var(--v2-foreground)) !important; box-shadow: none !important;
  font-family: var(--v2-font-sans) !important; font-size: 14px !important; font-weight: 400 !important; letter-spacing: normal !important; line-height: 20px !important;
  padding-left: 1rem !important; padding-right: 1rem !important; transition: all .3s ease-out !important; outline: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), select),
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]), select) { height: 40px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) select, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) select { padding-right: 2.25rem !important; -webkit-appearance: none; appearance: none;
  background-image: var(--v2i-chevron-down-mut) !important; background-repeat: no-repeat !important; background-position: right .75rem center !important; background-size: 16px 16px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) textarea, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) textarea { padding-top: .5rem !important; padding-bottom: .5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :where(input, select, textarea):where(:hover:not(:disabled):not(:focus)), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :where(input, select, textarea):where(:hover:not(:disabled):not(:focus)) { border-color: hsl(var(--v2-primary) / .3) !important; background-color: hsl(var(--v2-background)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :where(input, select, textarea):where(:focus), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :where(input, select, textarea):where(:focus) { border-color: hsl(var(--v2-primary) / .5) !important; box-shadow: 0 0 0 2px hsl(var(--v2-primary) / .2) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(input, textarea)::placeholder, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(input, textarea)::placeholder { color: hsl(var(--v2-muted-foreground) / .6) !important; font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(input, select, textarea):disabled, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(input, select, textarea):disabled { opacity: .5 !important; cursor: not-allowed; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) input[type=date], html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) input[type=date] { color-scheme: inherit; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(input[type=checkbox], input[type=radio]), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(input[type=checkbox], input[type=radio]) { accent-color: hsl(var(--v2-primary)); }
/* Busca com lupa (SearchBox: ícone 16px à esquerda, pl-9) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) input.search:not([type=date]):not([type=datetime-local]):not([type=number]):not([placeholder^="🔍"]), html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) input[type=search]:not([placeholder^="🔍"]) {
  padding-left: 2.25rem !important; background-image: var(--v2i-search-mut) !important; background-repeat: no-repeat !important;
  background-position: .75rem center !important; background-size: 16px 16px !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.field, .rp-filter, .rc-lbl) > label, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .field label, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) label.rc-lbl, html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .ms-mb label {
  font-family: var(--v2-font-sans) !important; font-size: 14px !important; font-weight: 500 !important; color: hsl(var(--v2-foreground)) !important; letter-spacing: normal !important; text-transform: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.help, .hint), html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .hint { color: hsl(var(--v2-muted-foreground)) !important; font-size: 12px !important; }

/* Barra de filtros (flex-wrap gap-3) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .toolbar { gap: .75rem !important; margin-bottom: 1.5rem !important; animation: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .toolbar input.search { flex: 1 1 240px; min-width: 0 !important; max-width: 24rem; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .per { gap: .5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .per .sep { font-family: var(--v2-font-sans) !important; color: hsl(var(--v2-muted-foreground)) !important; font-size: 12px !important; }

/* ======================================================================================================
   6. Tabelas (.merchant-table / .merchant-main table): th .65rem 500 muted em fundo muted/60, td 1rem com borda; hover muted/35
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.table-wrap, .rp-table-wrap) { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow-x: auto !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .panel.table-wrap { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table { width: 100%; border-collapse: collapse !important; font-size: .8rem !important; background: transparent !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table thead th, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table > tr:first-child > th {
  text-align: left; white-space: nowrap; padding: .85rem .75rem !important; background: hsl(var(--v2-muted) / .6) !important;
  color: hsl(var(--v2-muted-foreground)) !important; border: 0 !important; border-bottom: 0 !important;
  font-family: var(--v2-font-sans) !important; font-size: .65rem !important; font-weight: 500 !important; letter-spacing: normal !important; text-transform: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table tbody td {
  padding: 1rem .75rem !important; border: 0 !important; border-bottom: 1px solid hsl(var(--v2-border)) !important; background: transparent !important;
  color: hsl(var(--v2-foreground)) !important; font-family: var(--v2-font-sans) !important; font-size: .8rem !important; vertical-align: middle;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table tbody tr { transition: background-color .15s var(--v2-v-ease) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table tbody tr:hover { background: hsl(var(--v2-muted) / .35) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table tbody td .muted { font-size: 12px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table tbody td .num { white-space: nowrap; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) table tbody td.mono { font-family: var(--v2-font-mono) !important; font-size: .75rem !important; }

/* ======================================================================================================
   7. Selos de status (Status do DemoUi): rounded-md, px-2 py-1, text-xs 500, fundo tom/10, ponto 6px
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .badge {
  align-items: center; gap: 0 !important; height: auto !important; padding: .25rem .5rem !important;
  border: 0 !important; border-radius: calc(var(--v2-radius) - 2px) !important; white-space: nowrap;
  background: hsl(var(--v2-warning) / .1) !important; color: hsl(var(--v2-warning)) !important;
  font-family: var(--v2-font-sans) !important; font-size: 12px !important; font-weight: 500 !important; line-height: 16px !important;
  letter-spacing: normal !important; text-transform: none !important; box-shadow: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .badge::before { content: ''; display: inline-block; vertical-align: middle; margin-right: .375rem; width: 6px; height: 6px; border-radius: 9999px; background: currentColor; flex: none; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.badge.pay-pix, .badge.b-on, .badge.green, .badge.ok) { background: hsl(var(--v2-success) / .1) !important; color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.badge.b-off, .badge.pay-card, .badge.muted) { background: hsl(var(--v2-muted)) !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.badge.danger, .badge.red) { background: hsl(var(--v2-destructive) / .1) !important; color: hsl(var(--v2-destructive)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.badge.blue) { background: hsl(var(--v2-conversion) / .1) !important; color: hsl(var(--v2-conversion)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.badge.amber) { background: hsl(var(--v2-warning) / .1) !important; color: hsl(var(--v2-warning)) !important; }
/* select de status do pedido no formato do selo (tom pelo status) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .status-select {
  height: 32px !important; min-height: 32px !important; border-radius: calc(var(--v2-radius) - 2px) !important; border: 0 !important;
  padding: 0 1.375rem 0 .5rem !important; font-size: 12px !important; font-weight: 500 !important; font-family: var(--v2-font-sans) !important;
  letter-spacing: normal !important; text-transform: none !important; background-color: hsl(var(--v2-warning) / .1) !important; color: hsl(var(--v2-warning)) !important;
  background-position: right .45rem center !important; background-size: 14px 14px !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .status-select.st-paid { background-color: hsl(var(--v2-success) / .1) !important; color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .status-select.st-shipped { background-color: hsl(var(--v2-conversion) / .1) !important; color: hsl(var(--v2-conversion)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .status-select.st-canceled { background-color: hsl(var(--v2-destructive) / .1) !important; color: hsl(var(--v2-destructive)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .status-select option { background: hsl(var(--v2-popover)); color: hsl(var(--v2-popover-foreground)); }
/* "Ver" do pedido: Button ghost icon com ArrowUpRight */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .details-btn { width: 40px !important; min-width: 40px; padding: 0 !important; border-color: transparent !important; background: transparent !important; font-size: 0 !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .details-btn::after { content: ''; display: inline-block; vertical-align: middle; flex: none; width: 16px !important; height: 16px !important; background: currentColor; -webkit-mask: var(--v2i-arrow-up-right) center / 16px no-repeat; mask: var(--v2i-arrow-up-right) center / 16px no-repeat; }

/* ======================================================================================================
   8. Cartões do celular (lista do Lovable: rounded-lg border bg-card p-4)
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .card-item { padding: 1rem !important; margin-bottom: .75rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .card-item:hover { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .card-item .ci-name { font-weight: 600 !important; font-size: 14px !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .card-item .ci-row { font-size: 13px !important; border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .card-item .ci-row .k { color: hsl(var(--v2-muted-foreground)) !important; font-family: var(--v2-font-sans) !important; text-transform: none !important; letter-spacing: normal !important; }

/* ======================================================================================================
   9. Estado vazio (Empty: ícone Inbox 32px, texto text-sm muted, py-16)
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.empty, .vg-vazio, .ag-vazio, .pp-empty) {
  color: hsl(var(--v2-muted-foreground)) !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
  font-family: var(--v2-font-sans) !important; font-size: 14px !important; line-height: 20px !important; text-align: center; animation: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .empty { padding: 4rem 1rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .empty::before {
  width: 32px !important; height: 32px !important; margin: 0 auto .5rem !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  background: hsl(var(--v2-muted-foreground)) !important; animation: none !important;
  -webkit-mask: var(--v2i-inbox) center / 32px no-repeat; mask: var(--v2i-inbox) center / 32px no-repeat;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-vazio .ic { filter: grayscale(1); opacity: .6; animation: none !important; }

/* Barras de progresso (.merchant-progress: trilho muted, valor primary, 6–8px, raio 3) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.rp-track, .l-fbar) { height: 8px !important; background: hsl(var(--v2-muted)) !important; border: 0 !important; border-radius: 3px !important; box-shadow: none !important; overflow: hidden; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.rp-track > i, .l-fbar > *) { background: hsl(var(--v2-primary)) !important; border-radius: 3px !important; box-shadow: none !important; }

/* ======================================================================================================
   10. Visão geral: saudação ("Boa tarde, Dono" = merchant-page-title), filtros de período, gráfico, ranking, donut
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-head { margin-bottom: 1.75rem !important; align-items: flex-end !important; gap: 1rem !important; animation: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-hi {
  font-family: var(--v2-font-display) !important; font-size: 2.3rem !important; font-weight: 700 !important; line-height: 1.15 !important;
  letter-spacing: normal !important; color: hsl(var(--v2-foreground)) !important; animation: none !important; text-shadow: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-hi::before {
  content: 'VISÃO GERAL DA LOJA'; display: block; margin-bottom: .5rem; font-family: var(--v2-font-sans); font-size: .65rem; font-weight: 400;
  line-height: 1.5; color: hsl(var(--v2-muted-foreground));
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-hi .vg-typed { font: inherit !important; color: inherit !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-hi .vg-cursor { color: hsl(var(--v2-primary)) !important; font-family: var(--v2-font-display) !important; font-weight: 400 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-sub { font-size: 14px !important; line-height: 20px !important; margin-top: .5rem !important; }
/* Filters do Lovable: botões sm separados (default / outline), sem a cápsula do v1 */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-pills { gap: .5rem !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-pill { font-family: var(--v2-font-sans) !important; font-size: 14px !important; text-transform: none !important; letter-spacing: normal !important; }
/* linhas e grades do overview (.merchant-overview-grid / .merchant-analytics-grid usam gap 2rem) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent { gap: 1.5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-linha { gap: 1.5rem !important; margin-top: 0 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-row, .vg-row3, .ov-conversion-row) { gap: 1.5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-card { padding: 1.5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-card > .c-sub { margin-bottom: 1.5rem !important; }
/* gráfico de faturamento (AreaChart do Lovable: linha primary 2.5px, área primary .18 → 0, grade tracejada) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart .ln { stroke-width: 2.5 !important; filter: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart #vgGrad stop { stop-color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart #vgFill stop:first-child { stop-color: hsl(var(--v2-success) / .18) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart #vgFill stop:last-child { stop-color: hsl(var(--v2-success) / 0) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-donut #vgGrad2 stop { stop-color: hsl(var(--v2-conversion)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart :is(.gl, line.grid, .grid line) { stroke: hsl(var(--v2-border)) !important; stroke-dasharray: 3 5; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart text { fill: hsl(var(--v2-muted-foreground)) !important; font-family: var(--v2-font-sans) !important; font-size: 11px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-chart .dt { fill: hsl(var(--v2-success)) !important; stroke: hsl(var(--v2-card)) !important; }
/* donut de conversão (ConversionRing: trilho muted 18, valor --conversion com ponta redonda, 1.7rem 800) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-donut svg circle:first-of-type { stroke: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-donut svg circle:not(:first-of-type) { stroke: hsl(var(--v2-conversion)) !important; filter: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-donut .mid b { font-family: var(--v2-font-sans) !important; font-size: 1.7rem !important; font-weight: 800 !important; color: hsl(var(--v2-foreground)) !important; line-height: 1 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-donut .mid span { font-family: var(--v2-font-sans) !important; font-size: .5rem !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: normal !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-leg { font-family: var(--v2-font-sans) !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-leg > span { background: hsl(var(--v2-muted) / .5) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: calc(var(--v2-radius) - 2px) !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-leg i[style*="#ff3b52"] { background: hsl(var(--v2-conversion)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-leg i[style*="#1c1c22"] { background: hsl(var(--v2-muted)) !important; border-color: hsl(var(--v2-border)) !important; }
/* funil de conversão: barras primary sobre trilho muted (merchant-progress) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-bar { background: hsl(var(--v2-muted)) !important; box-shadow: none !important; border-radius: 6px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-bar > div { background: hsl(var(--v2-primary)) !important; opacity: 1 !important; border-radius: 6px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-bar span { text-shadow: none !important; font-family: var(--v2-font-sans) !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-num { background: hsl(var(--v2-muted)) !important; color: hsl(var(--v2-foreground)) !important; border: 1px solid hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-lbl > span:first-child { color: hsl(var(--v2-muted-foreground)) !important; opacity: 1 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-right > div:first-child { color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-num { font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-lbl { color: hsl(var(--v2-foreground)) !important; font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #funilBox .funil-maxdrop { font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-funil :is(.cl-s, .cl-t, .t-meta, .t-st, .t-dir) { font-family: var(--v2-font-sans) !important; }
/* últimas transações / mais vendidos (merchant-recent-order: linhas com divisória) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-tx, .vg-rank) { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-tx, .vg-rank) :is(.t-val, .r-val, .val) { font-family: var(--v2-font-sans) !important; font-weight: 600 !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-tx, .vg-rank) :is(.t-meta, .t-st, .r-nome + *, .n) { font-family: var(--v2-font-sans) !important; letter-spacing: normal !important; }
/* mapa de leads por estado */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .lm-mapa path:not([fill]), html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .lm-mapa svg > path { stroke: hsl(var(--v2-card)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.lm-barra, .lm-item .trk) { background: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.lm-uf, .lm-sig) { font-family: var(--v2-font-sans) !important; }
/* ranking (RankingPodium: avatar 38px muted, 1º em warning, degraus muted com Rajdhani) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ov-ranking .ov-rank-head { align-items: center !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ov-ranking :is(.ov-rank-period, .ov-rank-status) { color: hsl(var(--v2-muted-foreground)) !important; font-family: var(--v2-font-sans) !important; font-size: 12px !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ov-ranking .ov-rank-head > h3::before {
  content: ''; display: inline-block; width: 16px; height: 16px; margin-right: .5rem; vertical-align: -2px; background: hsl(var(--v2-warning));
  -webkit-mask: var(--v2i-trophy) center / 16px no-repeat; mask: var(--v2i-trophy) center / 16px no-repeat;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-avatar { background: hsl(var(--v2-muted)) !important; border: 1px solid hsl(var(--v2-border)) !important; color: hsl(var(--v2-muted-foreground)) !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-place-1 .dp-avatar { color: hsl(var(--v2-warning)) !important; border-color: hsl(var(--v2-warning) / .5) !important; background: hsl(var(--v2-warning) / .08) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-initials { font-family: var(--v2-font-sans) !important; color: inherit !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-crown { color: hsl(var(--v2-warning)) !important; text-shadow: none !important; filter: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-name { font-family: var(--v2-font-sans) !important; font-size: 12px !important; font-weight: 600 !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-value { font-family: var(--v2-font-sans) !important; font-size: 12px !important; font-weight: 600 !important; color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium :is(.dp-place-1, .dp-place-2, .dp-place-3) .dp-step {
  background: hsl(var(--v2-muted)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: 6px 6px 0 0 !important;
  color: hsl(var(--v2-foreground)) !important; font-family: var(--v2-font-display) !important; font-size: 1.6rem !important; font-weight: 700 !important;
  box-shadow: none !important; text-shadow: none !important; background-image: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium .dp-place-1 .dp-step { border-color: hsl(var(--v2-warning) / .35) !important; color: hsl(var(--v2-warning)) !important; background: hsl(var(--v2-warning) / .08) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium :is(.dp-place-4, .dp-place-5) { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .drop-podium :is(.dp-place-4, .dp-place-5) .dp-step { font-family: var(--v2-font-sans) !important; color: hsl(var(--v2-muted-foreground)) !important; background: none !important; border: 0 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ov-rank-dica { border-color: hsl(var(--v2-border)) !important; color: hsl(var(--v2-muted-foreground)) !important; border-radius: var(--v2-radius) !important; }
/* alertas e avisos do overview (gateway único, fotos quebradas, recuperação) — tons do Lovable */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(#gwWarnBanner, #gwAlerta, #fbRecBanner, .imgh-alerta, .gwal) {
  background: hsl(var(--v2-warning) / .08) !important; border: 1px solid hsl(var(--v2-warning) / .3) !important; border-radius: var(--v2-radius) !important;
  color: hsl(var(--v2-foreground)) !important; box-shadow: none !important; background-image: none !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-clarity { border-radius: var(--v2-radius) !important; }

/* Lovable: as seções de dados da Visão geral, Relatórios e Adquirentes ficam soltas no fundo (sem card),
   separadas por borda inferior (.merchant-overview-grid / .merchant-analytics-grid: padding-block 1.5rem, border-bottom). */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-card, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rp-panel, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #adquirentesView > .panel {
  background: transparent !important; border: 0 !important; border-bottom: 1px solid hsl(var(--v2-border)) !important; border-radius: 0 !important;
  box-shadow: none !important; padding: 0 0 1.5rem !important;
}
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #adquirentesView > .panel { padding-top: 0 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #overviewContent .vg-card .vg-vazio { background: hsl(var(--v2-muted) / .35) !important; border-radius: var(--v2-radius) !important; }

/* ======================================================================================================
   11. Pedidos: grade de resumo como .merchant-kpis (gap .85rem)
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #ordResumo { gap: .85rem !important; padding: 0 !important; background: transparent !important; border: 0 !important; margin-bottom: 1.5rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #ordResumo .rz-v { margin-top: 1rem !important; }

/* ======================================================================================================
   12. Recuperador (.rc-*), Remarketing, Funil, Leads, Relatórios, Rastreio, Adquirentes, Produtos
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-wrap > h2, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-head h2 { font-family: var(--v2-font-display) !important; font-size: 2rem !important; font-weight: 700 !important; line-height: 1.15 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-in { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-item { background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: var(--v2-radius) !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-item:hover, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-item.on { border-color: hsl(var(--v2-primary) / .3) !important; background: hsl(var(--v2-primary) / .05) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-n { font-family: var(--v2-font-display) !important; color: hsl(var(--v2-primary)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-fbt .rc-n, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-fbt b { font-family: var(--v2-font-sans) !important; color: inherit !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rmk-wa { background: hsl(var(--v2-success)) !important; color: hsl(var(--v2-success-foreground)) !important; border-color: transparent !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rmk-wa:hover:not(:disabled) { background: hsl(var(--v2-success) / .9) !important; color: hsl(var(--v2-success-foreground)) !important; box-shadow: 0 10px 15px -3px hsl(var(--v2-success) / .2) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ag-num, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ag-n { font-family: var(--v2-font-display) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ag-ponto { background: hsl(var(--v2-success)) !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.rp-hero h1, .rp-hero h2) { font-family: var(--v2-font-display) !important; font-size: 2rem !important; font-weight: 700 !important; line-height: 1.15 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rp-hero .cap, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .sc-eyebrow { font-family: var(--v2-font-sans) !important; font-size: .65rem !important; font-weight: 400 !important; letter-spacing: normal !important; text-transform: uppercase !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rp-filter { background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: var(--v2-radius) !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rp-state-details { background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: var(--v2-radius) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.rp-demographics span, .rp-demographics > *) { background: hsl(var(--v2-muted)) !important; border: 0 !important; color: hsl(var(--v2-muted-foreground)) !important; border-radius: calc(var(--v2-radius) - 2px) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rt-head { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rt-phone { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-fstep { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.l-kpis .t, .l-kpis .n, .fn, .fv) { font-family: var(--v2-font-sans) !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-kpis .n { font-family: var(--v2-font-display) !important; font-weight: 700 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .thumb, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .thumb-fb { border-radius: calc(var(--v2-radius) - 2px) !important; border-color: hsl(var(--v2-border)) !important; background: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .thumb-fb { font-family: var(--v2-font-sans) !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.p-sku, .p-skuvar, .link-chip) { font-family: var(--v2-font-mono) !important; }

/* Produtos: chips de link por plataforma (pequenos) e linha da prévia ativa */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .plat-btn { height: 28px !important; min-height: 28px !important; padding: 0 .625rem !important; font-size: 12px !important; gap: .375rem !important; border-radius: calc(var(--v2-radius) - 2px) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .plat-btn:hover:not(:disabled) { transform: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .plat-copy { gap: .375rem !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) tr.pp-on { background: hsl(var(--v2-primary) / .05) !important; box-shadow: none !important; outline: 0 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) tr.pp-on > td { background: transparent !important; }
/* preço do produto = font-display text-xl bold do card do Lovable */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(#productsBody, #productsCards) .num { font-family: var(--v2-font-display) !important; font-size: 1.15rem !important; font-weight: 700 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) tr.pp-on > td:first-child { box-shadow: inset 2px 0 hsl(var(--v2-primary)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .p-var, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .p-vars > * { background: hsl(var(--v2-muted)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: calc(var(--v2-radius) - 2px) !important; color: hsl(var(--v2-foreground)) !important; font-family: var(--v2-font-sans) !important; }

/* Recuperador: painel dividido (lista | ficha) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-wrap { background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: var(--v2-radius) !important; box-shadow: var(--v2-merchant-shadow) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-lista { border-color: hsl(var(--v2-border)) !important; background: transparent !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-painel { background: hsl(var(--v2-muted) / .4) !important; border: 0 !important; border-left: 1px solid hsl(var(--v2-border)) !important; border-radius: 0 !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-head { font-family: var(--v2-font-sans) !important; font-size: .65rem !important; font-weight: 500 !important; letter-spacing: normal !important; text-transform: none !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-item.on { box-shadow: inset 2px 0 hsl(var(--v2-primary)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-selo { font-family: var(--v2-font-sans) !important; border-radius: calc(var(--v2-radius) - 2px) !important; font-weight: 500 !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-selo.pend { background: hsl(var(--v2-muted)) !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-selo.pago { background: hsl(var(--v2-success) / .1) !important; color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rc-selo.comp { background: hsl(var(--v2-warning) / .1) !important; color: hsl(var(--v2-warning)) !important; }
/* aviso do recuperador: o JS escolhe o tom pelo style (erro = vinho, normal = vermelho 7%) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #recAviso { border-radius: var(--v2-radius) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #recAviso:is([style*="rgb(42, 20, 22)"], [style*="#2a1416"]) { background: hsl(var(--v2-destructive) / .1) !important; border-color: hsl(var(--v2-destructive) / .35) !important; color: hsl(var(--v2-destructive)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #recAviso:is([style*="rgba(255, 37, 52, 0.07)"], [style*="rgba(255,37,52,.07)"]) { background: hsl(var(--v2-primary) / .05) !important; border-color: hsl(var(--v2-primary) / .2) !important; color: hsl(var(--v2-foreground)) !important; }
/* Pedidos sem resultado (.ord-vazio) = Empty do Lovable */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ord-vazio { padding: 4rem 1rem !important; gap: .5rem !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ord-vazio .ov-ic { width: 32px !important; height: 32px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: hsl(var(--v2-muted-foreground)) !important; animation: none !important; margin: 0 !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ord-vazio .ov-ic svg { width: 0 !important; height: 0 !important; position: absolute; opacity: 0; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ord-vazio .ov-ic::before { content: ''; width: 32px; height: 32px; background: currentColor; -webkit-mask: var(--v2i-inbox) center / 32px no-repeat; mask: var(--v2i-inbox) center / 32px no-repeat; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ord-vazio b { font-size: 14px !important; font-weight: 400 !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .ord-vazio .ov-btn { border-radius: var(--v2-radius) !important; border: 1px solid hsl(var(--v2-input)) !important; background: hsl(var(--v2-background)) !important; color: hsl(var(--v2-foreground)) !important; box-shadow: none !important; font-family: var(--v2-font-sans) !important; }
/* Leads: barras do funil de captura */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-fbar i { background: hsl(var(--v2-primary)) !important; box-shadow: none !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-fstep:nth-child(2) .l-fbar i { background: hsl(var(--v2-primary) / .75) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-fstep:nth-child(3) .l-fbar i { background: hsl(var(--v2-success)) !important; }
/* Produtos: nomes das variações e prévia do celular (moldura do .merchant-studio-phone) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .p-var .pv-n { color: hsl(var(--v2-foreground)) !important; font-weight: 600; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .p-var { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #ppAside .pp-phone { border: 6px solid hsl(var(--v2-border)) !important; border-radius: 36px !important; background: hsl(var(--v2-card)) !important; box-shadow: var(--v2-merchant-shadow) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #ppAside .pp-phone::before { background: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #ppAside .pp-name { font-family: var(--v2-font-sans) !important; color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #ppAside .pp-empty { color: hsl(var(--v2-muted-foreground)) !important; background: hsl(var(--v2-card)) !important; }

/* Mapa de leads, KPIs de leads, avisos: textos com cor fixa clara -> tokens */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.lm-num, .lm-nome, .lm-resumo b) { color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.lm-resumo, .lm-dica, .lm-leg) { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .lm-item [style*="color:#cbd5e1"], html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .lm-item :is(span, b) { color: hsl(var(--v2-foreground)); }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.lm-sig, .lm-item .n, .vg-rank .n) { color: hsl(var(--v2-warning)) !important; background: hsl(var(--v2-warning) / .1) !important; border-color: hsl(var(--v2-warning) / .3) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .lm-barra { background: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .lm-barra > i { background: hsl(var(--v2-primary)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-kpis .t { font-family: var(--v2-font-sans) !important; font-size: 12px !important; text-transform: none !important; letter-spacing: normal !important; color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-kpis .lk { background: hsl(var(--v2-card)) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: 8px !important; box-shadow: var(--v2-merchant-shadow) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .imgh-t { color: hsl(var(--v2-warning)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-kpis .n { color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-kpis .green .n, html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .l-kpis > .green .n { color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #puxStatus[style*="rgb(22, 163, 74)"] { color: hsl(var(--v2-success)) !important; background: hsl(var(--v2-success) / .1) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rp-state-table .rp-state-uf { background: hsl(var(--v2-muted)) !important; color: hsl(var(--v2-foreground)) !important; border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #adqChart span[style*="color:#fff"] { color: hsl(var(--v2-foreground)) !important; }
/* Rastreio: etapas (feita = verde, atual = âmbar, futura = muted) */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) [style*="color:#8fe7bf"] { color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) [style*="background:#332a12"] { background: hsl(var(--v2-warning) / .1) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="background:#33333c"]) { background: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) [style*="border:2px solid #33333c"] { border-color: hsl(var(--v2-border)) !important; }

/* ======================================================================================================
   13. Cores fixas escritas pelo JS no atributo style (superfícies escuras e texto claro) -> tokens do tema
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="background:#0a0a0c"], [style*="background:#111111"], [style*="background:#0c0c11"], [style*="background:var(--bg,#0a0a0c)"]) { background: hsl(var(--v2-background)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="background:#17171d"], [style*="background:#1a1a22"], [style*="background:#1c1c22"], [style*="background:#15151d"], [style*="background:var(--panel2,#15151d)"]) { background: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="border:1px solid #26262e"], [style*="border:1px solid #33333d"], [style*="border-color:#334155"]) { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="color:#f4f4f6"], [style*="color:#e8e8ee"], [style*="color:var(--ink)"], [style*="color:var(--text)"], [style*="color:var(--ink-2)"]) { color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="color:#b0b0be"], [style*="color:#8a8a8a"], [style*="color:#888"], [style*="color:#8a93a6"], [style*="color:#9a9ab0"], [style*="color:#7a7a8a"], [style*="color:#9aa0a6"], [style*="color:var(--muted)"]) { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="color:#22c55e"], [style*="color:#4ade80"], [style*="color:#37d67a"], [style*="color:#26d07c"], [style*="color:#12b76a"]) { color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="color:#ef4444"], [style*="color:#ff6b6b"], [style*="color:#ff5a5a"], [style*="color:#f43f5e"], [style*="color:#dc2626"]) { color: hsl(var(--v2-destructive)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is([style*="color:#ffc53d"], [style*="color:#f59e0b"]) { color: hsl(var(--v2-warning)) !important; }
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) [style*="linear-gradient(90deg,#e11d2a,#ff5566)"] { background: hsl(var(--v2-primary)) !important; }

/* ======================================================================================================
   14. Modais: pedido / produto (Dialog do Lovable) e criar loja (ms-modal)
       Overlay bg-background/80 + blur-sm; caixa max-w-lg, bg-background/95 + blur-xl, borda border/80, raio 8, p-6, sombra 2xl primary/5
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) input[type=number] { padding-left: .625rem !important; padding-right: .5rem !important; }

html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg).modal-bg, html[data-ui="v2"] body.dropos-workspace #msCreateBg.ms-modal-bg {
  background: hsl(var(--v2-background) / .8) !important; -webkit-backdrop-filter: blur(4px) !important; backdrop-filter: blur(4px) !important;
}
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg) .modal, html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-modal {
  background: hsl(var(--v2-background) / .95) !important; -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
  border: 1px solid hsl(var(--v2-border) / .8) !important; border-radius: var(--v2-radius) !important;
  box-shadow: 0 25px 50px -12px hsl(var(--v2-primary) / .05) !important; color: hsl(var(--v2-foreground)) !important;
  font-family: var(--v2-font-sans) !important;
}
html[data-ui="v2"] body.dropos-workspace #orderModalBg .modal { max-width: 32rem !important; padding: 1.5rem !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg) .modal h3, html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-modal h3 {
  font-family: var(--v2-font-sans) !important; font-size: 18px !important; font-weight: 600 !important; line-height: 1.375 !important;
  letter-spacing: normal !important; color: hsl(var(--v2-foreground)) !important; text-shadow: none !important;
}
html[data-ui="v2"] body.dropos-workspace #prodModalBg .modal > h3, html[data-ui="v2"] body.dropos-workspace #prodModalBg .modal h3:first-of-type { font-family: var(--v2-font-display) !important; font-size: 1.5rem !important; font-weight: 700 !important; text-transform: uppercase !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg) .modal-close, html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-x {
  width: 44px !important; height: 44px !important; border: 0 !important; border-radius: calc(var(--v2-radius) - 2px) !important;
  background: transparent !important; color: hsl(var(--v2-foreground)) !important; opacity: .7; box-shadow: none !important; transform: none !important;
  transition: all .2s !important;
}
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg) .modal-close:hover, html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-x:hover { opacity: 1; background: hsl(var(--v2-muted)) !important; }
/* Pedido: lista de dados como o <dl> do Lovable (rótulo text-xs muted, valor text-sm 500) */
html[data-ui="v2"] body.dropos-workspace #orderModalContent .detail-row { border-color: hsl(var(--v2-border)) !important; font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace #orderModalContent .detail-row .k { font-family: var(--v2-font-sans) !important; font-size: 12px !important; color: hsl(var(--v2-muted-foreground)) !important; text-transform: none !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #orderModalContent .detail-row .k[style*="#f4f4f6"] { color: hsl(var(--v2-foreground)) !important; font-weight: 600 !important; font-size: 13px !important; }
html[data-ui="v2"] body.dropos-workspace #orderModalContent .detail-row .v { font-family: var(--v2-font-sans) !important; font-size: 14px !important; font-weight: 500 !important; color: hsl(var(--v2-foreground)) !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #orderModalContent .detail-row .v :is(code, textarea, input) { font-family: var(--v2-font-mono) !important; }
/* Abas do editor de produto = TabsList/TabsTrigger (fundo muted, p-1, raio md; ativa com fundo background e sombra sm) */
html[data-ui="v2"] body.dropos-workspace #prodModal .pm-tabs { gap: 0 !important; padding: 4px !important; margin-bottom: 1.5rem !important; background: hsl(var(--v2-muted)) !important; border: 0 !important; border-radius: calc(var(--v2-radius) - 2px) !important; }
html[data-ui="v2"] body.dropos-workspace #prodModal .pm-tab {
  height: auto !important; min-height: 32px; padding: 6px 12px !important; border: 0 !important; border-radius: calc(var(--v2-radius) - 4px) !important; box-shadow: none !important;
  background: transparent !important; color: hsl(var(--v2-muted-foreground)); font-family: var(--v2-font-sans) !important; font-size: 14px !important; font-weight: 500 !important;
  letter-spacing: normal !important; text-transform: none !important; transition: all .15s !important;
}
html[data-ui="v2"] body.dropos-workspace #prodModal .pm-tab:hover { color: hsl(var(--v2-foreground)); }
html[data-ui="v2"] body.dropos-workspace #prodModal .pm-tab.active { background: hsl(var(--v2-background)) !important; color: hsl(var(--v2-foreground)) !important; box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.muted, .sub, .hint) { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .badge { border: 0 !important; border-radius: calc(var(--v2-radius) - 2px) !important; font-family: var(--v2-font-sans) !important; text-transform: none !important; letter-spacing: normal !important; font-weight: 500 !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(.mono, code) { font-family: var(--v2-font-mono) !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .num { font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is(hr, .sep) { border-color: hsl(var(--v2-border)) !important; }
html[data-ui="v2"] body.dropos-workspace #msCreateBg :is(.ms-mh, .ms-mf) { border-color: hsl(var(--v2-border)) !important; background: transparent !important; }
html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-inc { background: hsl(var(--v2-muted) / .5) !important; border: 1px solid hsl(var(--v2-border)) !important; border-radius: var(--v2-radius) !important; }
html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-link { color: hsl(var(--v2-muted-foreground)) !important; font-family: var(--v2-font-mono) !important; }
html[data-ui="v2"] body.dropos-workspace #msCreateBg .ms-msg { font-family: var(--v2-font-sans) !important; }
html[data-ui="v2"] body.dropos-workspace #prodModalBg #pmPreviewToggle { font-family: var(--v2-font-sans) !important; border-radius: var(--v2-radius) !important; background: hsl(var(--v2-primary)) !important; border-color: transparent !important; box-shadow: none !important; }

/* ======================================================================================================
   15. Faixa da comunidade no Telegram: tira discreta no formato do .merchant-demo (borda inferior, texto pequeno muted)
       A rolagem (marquee) e o X continuam do v1; só a cor sai do vermelho neon.
   ====================================================================================================== */
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar {
  background: hsl(var(--v2-card)) !important; box-shadow: none !important; border-bottom: 1px solid hsl(var(--v2-border)) !important;
}
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar::after { background: linear-gradient(100deg, transparent, hsl(var(--v2-primary) / .08), transparent) !important; }
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar :is(.tgc-link, .tgc-item) { color: hsl(var(--v2-foreground)) !important; }
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar .tgc-item { font-family: var(--v2-font-sans) !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: normal !important; }
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar .tgc-ic { box-shadow: none !important; animation: none !important; width: 20px !important; height: 20px !important; }
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar .tgc-x { background: transparent !important; color: hsl(var(--v2-muted-foreground)) !important; border-radius: calc(var(--v2-radius) - 2px) !important; }
html[data-ui="v2"] body.dropos-workspace #tgCommunityBar .tgc-x:hover { background: hsl(var(--v2-muted)) !important; color: hsl(var(--v2-foreground)) !important; }

/* ======================================================================================================
   16. Celular (< 640px): .merchant-kpi compacto, título 2rem
   ====================================================================================================== */
@media (max-width: 639px) {
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi, .rz-card, .rp-kpi, .rt-stat, .acc-stat) { padding: .9rem !important; }
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-val, .rz-v, .rp-kpi > b, .rt-stat .n) { font-size: 1.7rem !important; }
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.vg-kpi .k-ico, .rz-ic) { width: 24px !important; height: 24px !important; }
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .rz-ic { top: .9rem !important; right: .9rem !important; }
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-hi { font-size: 2rem !important; }
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .vg-card { padding: 1rem !important; }
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) .toolbar input.search { max-width: none; }
  html[data-ui="v2"] body.dropos-workspace :is(#orderModalBg, #prodModalBg) .modal { padding: 1rem !important; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-ui="v2"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) :is(.btn, .details-btn, .rc-fbt, .vg-pill, input, select, textarea) { transition: none !important; }
}

/* ---------- Tema claro: ícones de campo na cor muted do claro ---------- */
html[data-ui="v2"][data-theme="light"] {
  --v2i-chevron-down-mut: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27hsl(240%2C6%25%2C42%25)%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m6%209%206%206%206-6%27%2F%3E%3C%2Fsvg%3E");
  --v2i-search-mut: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27hsl(240%2C6%25%2C42%25)%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2711%27%20cy%3D%2711%27%20r%3D%278%27%2F%3E%3Cpath%20d%3D%27m21%2021-4.3-4.3%27%2F%3E%3C%2Fsvg%3E");
}

/* ======================================================================================================
   Correção de contraste 13/10 (achados dos 10 testadores + detector v3): só tema claro
   ====================================================================================================== */
/* Relatórios: reports-panel.css fixa fundo escuro em .rp-message ("Preparando relatório…", "PDF baixado…") */
html[data-ui="v2"][data-theme="light"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #rpMessage.rp-message { background: hsl(var(--v2-muted)) !important; border: 1px solid hsl(var(--v2-foreground) / .2) !important; color: hsl(var(--v2-foreground)) !important; border-radius: var(--v2-radius) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace #app :is(#overviewView, #funilView, #productsView, #ordersView, #relatoriosView, #adquirentesView, #rastreioView, #customersView, #leadsView, #recuperacaoView, #remarketingView) #rpMessage.rp-message.error { background: hsl(var(--v2-destructive) / .08) !important; border-color: hsl(var(--v2-destructive) / .35) !important; color: hsl(var(--v2-primary-deep)) !important; }
/* Modal do pedido: rastreio (rastreioStepperHTML / mlStepperHTML) e link "ver página" com cor fixa em style inline */
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) [style*="color:#8fe7bf"] { color: hsl(var(--v2-success)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is([style*="background:#0a0a0c"], [style*="background:#33333c"]) { background: hsl(var(--v2-muted)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) [style*="border:2px solid #33333c"] { border-color: hsl(var(--v2-input)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) [style*="color:#888"] { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is([style*="color:#ff8b8b"], [style*="color: rgb(255, 139, 139)"]) { color: hsl(var(--v2-primary-deep)) !important; }
/* Editor de produto: aba "Funil de Ofertas 🔥", "(adicione quantos quiser)", ✕ dos pixels (cssText do JS grava rgb()) e estrelas */
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) #prodModal .pm-tab[style*="color:#ff4d6d"]:not(.active) { color: hsl(var(--v2-primary-deep)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) :is([style*="color:#94a3b8"], [style*="color: rgb(148, 163, 184)"]) { color: hsl(var(--v2-muted-foreground)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .rev-stars-sel .rss:is([style*="color:#f59e0b"], [style*="color: rgb(245, 158, 11)"]) { color: hsl(var(--v2-warning)) !important; }
html[data-ui="v2"][data-theme="light"] body.dropos-workspace :is(#orderModalBg, #prodModalBg, #msCreateBg) .rev-stars-sel .rss:is([style*="color:#d1d5db"], [style*="color: rgb(209, 213, 219)"]) { color: hsl(var(--v2-muted-foreground)) !important; }