/* =============================================================
   Vendas Pay — TEMA V3 "Slim"
   -------------------------------------------------------------
   Camada de SOBREPOSIÇÃO, mesma arquitetura do V2: carregada por
   Util/p-header.php depois de tokens/base/components/dark, só quando o
   tema está ativo (global ou piloto por empresa, ver Util/p-tema.php).
   Apagar este arquivo devolve o sistema ao V1 inteiro.

   Linguagem do tema (pedido do dono, set-2026):
     · minimalista e DENSO — é ferramenta de trabalho, não vitrine
     · cantos discretos (4–12px), sombra zero, hairline separa tudo
     · sidebar clara com marcador laranja no item ativo; o laranja só
       aparece onde há AÇÃO (botão primário, item ativo, foco)
     · controles mais baixos no desktop (36px); no celular fica --tap-min
     · tipografia mais compacta, rótulos em caixa alta pequena

   ── CONVENÇÃO DE ESCOPO (igual ao V2) ────────────────────────
     · forma          → [data-vp-tema="v3"]
     · cor do claro   → [data-vp-tema="v3"]:not([data-theme="dark"])
     · ajuste escuro  → [data-vp-tema="v3"][data-theme="dark"]
   O dark.css carrega antes e usa !important em pontos; onde for preciso
   vencer, use html[data-vp-tema="v3"] (uma especificidade acima).
   ============================================================= */

/* =============================================================
   1. TOKENS — forma (vale nos dois modos)
   Como todo border-radius do sistema lê estes tokens (regra da casa
   desde set-2026), os cinco números abaixo redesenham TODAS as telas.
   ============================================================= */
:root[data-vp-tema="v3"] {
  --r-xs:   4px;
  --r-sm:   6px;
  --r-md:   8px;
  --r-lg:   10px;
  --r-xl:   12px;

  --sidebar-gap: 0px;
  --sidebar-w:   244px;
  --top-h:       64px;

  /* Sombra: só o popover tem. Cartão e KPI são borda + fundo. */
  --sh-xs:   none;
  --sh-card: none;
  --sh-pop:  0 12px 32px rgba(16, 24, 40, .14), 0 2px 8px rgba(16, 24, 40, .06);
  --sh-fab:  0 6px 16px rgba(var(--vp-primary-rgb), .22);

  /* Cor do item ativo da sidebar (marcador + tinta) */
  --t3-act-bar: var(--vp-primary);
}

/* Tipografia mais compacta no desktop: um degrau abaixo do V1. */
@media (min-width: 768px) {
  :root[data-vp-tema="v3"] {
    --fs-xs:   0.6875rem;  --lh-xs: 1rem;
    --fs-sm:   0.8rem;     --lh-sm: 1.2rem;
    --fs-base: 0.85rem;    --lh-base: 1.4rem;
    --fs-lg:   0.925rem;   --lh-lg: 1.5rem;
    --fs-xl:   1.0625rem;  --lh-xl: 1.55rem;
    --fs-2xl:  1.3rem;     --lh-2xl: 1.75rem;
    --fs-3xl:  1.5rem;     --lh-3xl: 1.9rem;
    --fs-4xl:  1.85rem;    --lh-4xl: 2.2rem;
    --fs-money:2rem;       --lh-money: 2.3rem;
  }
}

/* =============================================================
   2. TOKENS — cores do modo claro
   Neutros frios-neutros, sem o azul do V1; contraste um pouco maior nos
   textos porque a fonte é menor.
   ============================================================= */
:root[data-vp-tema="v3"]:not([data-theme="dark"]) {
  --vp-n50:            #fafafa;
  --vp-n100:           #f3f4f6;
  --vp-n200:           #e6e8eb;
  --vp-n300:           #d2d5da;
  --vp-n400:           #9aa1ab;
  --vp-n500:           #6a7280;
  --vp-n600:           #4a5260;
  --vp-n700:           #2f3641;
  --vp-n800:           #1c2129;
  --vp-n900:           #0f1216;

  --vp-bg:             #f5f6f7;
  --vp-bg-elevated:    #f0f1f3;
  --vp-surface:        #ffffff;
  --vp-surface-alt:    #fafafa;
  --vp-surface-soft:   #f5f6f7;
  --vp-border:         #e6e8eb;
  --vp-border-strong:  #d2d5da;
  --vp-text:           #15181d;
  --vp-text-muted:     #6a7280;

  /* Tintas de status mais suaves: o selo é informação, não alarme */
  --vp-success-100:    #e3f7ee;
  --vp-warn-100:       #fdf3e0;
  --vp-danger-100:     #fdeaea;
  --vp-info-100:       #e8f0fd;
  --vp-primary-50:     #fff4ec;
  --vp-primary-100:    #ffe6d3;
}

/* =============================================================
   3. TOKENS — modo escuro
   ============================================================= */
:root[data-vp-tema="v3"][data-theme="dark"] {
  --vp-bg:             #0f1114;
  --vp-bg-elevated:    #14171b;
  --vp-surface:        #16191d;
  --vp-surface-alt:    #1b1f24;
  --vp-surface-soft:   #14171b;
  --vp-border:         #262b32;
  --vp-border-strong:  #353c45;
  --vp-text:           #e6e8eb;
  --vp-text-muted:     #8d95a0;
  --vp-primary-50:     rgba(255, 107, 26, .12);
  --vp-primary-100:    rgba(255, 107, 26, .20);
  --sh-pop:  0 16px 40px rgba(0, 0, 0, .6);
}

/* =============================================================
   4. FUNDO E ESTRUTURA
   ============================================================= */
[data-vp-tema="v3"] body { background: var(--vp-bg); }

@media (min-width: 768px) {
  [data-vp-tema="v3"] body:has(.vp-sidebar) { padding: 0 0 0 var(--sidebar-w); }
  [data-vp-tema="v3"] body:has(.vp-sidebar) main.container,
  [data-vp-tema="v3"] body:has(.vp-sidebar) > .container { max-width: none; }
  [data-vp-tema="v3"] main.container,
  [data-vp-tema="v3"] main { padding-bottom: var(--sp-8); }
}

/* =============================================================
   5. SIDEBAR — clara, hairline à direita, marcador laranja no ativo
   ============================================================= */
@media (min-width: 768px) {
  html[data-vp-tema="v3"] .vp-sidebar {
    background: var(--vp-surface) !important;
    border-right: 1px solid var(--vp-border);
    padding: 14px 10px 10px;
    gap: 2px;
  }
  [data-vp-tema="v3"] .vp-sidebar__brand { padding: 2px 8px 8px; justify-content: flex-start; }
  [data-vp-tema="v3"] .vp-sidebar__brand img { max-width: 124px; }
  [data-vp-tema="v3"] .vp-sidebar__brand-panel { margin-bottom: var(--sp-2); }
  html[data-vp-tema="v3"] .vp-sidebar__section-label {
    font-size: 10px;
    letter-spacing: .1em;
    padding: 0 10px;
    margin: 6px 0 4px;
    color: var(--vp-n400);
  }
  html[data-vp-tema="v3"] .vp-sidebar__grupo { margin-top: 8px; }
  html[data-vp-tema="v3"] .vp-sidebar__grupo-tit { font-size: 10px; letter-spacing: .1em; padding: 3px 8px 4px 10px; color: var(--vp-n400); }
  html[data-vp-tema="v3"] .vp-sidebar__grupo-tit:hover { color: var(--vp-text); }
  html[data-vp-tema="v3"] .vp-sidebar__nav {
    gap: 1px;
    scrollbar-width: thin;
    scrollbar-color: var(--vp-border-strong) transparent;
  }
  html[data-vp-tema="v3"] .vp-sidebar__link {
    padding: 7px 10px;
    border-radius: var(--r-sm);
    font-size: 13px;
    font-weight: 500;
    color: var(--vp-n600);
    gap: 10px;
  }
  html[data-vp-tema="v3"] .vp-sidebar__link .vp-icon,
  html[data-vp-tema="v3"] .vp-sidebar__link-ic svg { width: 17px; height: 17px; }
  html[data-vp-tema="v3"] .vp-sidebar__link-ic { color: var(--vp-n400); }
  html[data-vp-tema="v3"] .vp-sidebar__link:hover {
    background: var(--vp-n100);
    color: var(--vp-text);
  }
  html[data-vp-tema="v3"] .vp-sidebar__link:hover .vp-sidebar__link-ic { color: var(--vp-n600); }

  /* Ativo: tinta leve + barra de 3px na esquerda. É o único laranja do trilho. */
  html[data-vp-tema="v3"] .vp-sidebar__link.is-active {
    background: var(--vp-primary-50);
    color: var(--vp-primary-700, var(--vp-primary));
    font-weight: 700;
    box-shadow: none;
  }
  html[data-vp-tema="v3"] .vp-sidebar__link.is-active::before {
    content: '';
    display: block;
    position: absolute;
    left: 0; top: 6px; bottom: 6px;
    width: 3px;
    border-radius: 0 2px 2px 0;
    background: var(--t3-act-bar);
  }
  html[data-vp-tema="v3"] .vp-sidebar__link.is-active .vp-sidebar__link-ic { color: var(--vp-primary); }

  html[data-vp-tema="v3"] .vp-sidebar__meta {
    border-top: 1px solid var(--vp-border);
    padding-top: 8px;
  }
  html[data-vp-tema="v3"] .vp-sidebar__logout,
  html[data-vp-tema="v3"] .vp-theme-toggle,
  html[data-vp-tema="v3"] .vp-sidebar__version { color: var(--vp-text-muted); font-size: 12px; }
  html[data-vp-tema="v3"] .vp-sidebar__logout:hover,
  html[data-vp-tema="v3"] .vp-theme-toggle:hover { background: var(--vp-n100); color: var(--vp-text); }
}

/* =============================================================
   6. CABEÇALHO (appbar desktop / topbar mobile)
   ============================================================= */
@media (min-width: 768px) {
  [data-vp-tema="v3"] .vp-appbar {
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: var(--sp-4);
    border-bottom: 1px solid var(--vp-border);
    background: var(--vp-surface);
    gap: var(--sp-3);
  }
  [data-vp-tema="v3"] .vp-appbar__hi { font-size: 16px; font-weight: 600; color: var(--vp-text); letter-spacing: -.01em; }
  [data-vp-tema="v3"] .vp-appbar__hi strong { font-weight: 800; }
  [data-vp-tema="v3"] .vp-appbar__sub { font-size: 12px; margin-top: 0; }
  [data-vp-tema="v3"] .vp-appbar__bell { width: 34px; height: 34px; border-radius: var(--r-sm); }
  [data-vp-tema="v3"] .vp-appbar__bell .vp-icon { width: 18px; height: 18px; }
  [data-vp-tema="v3"] .vp-appbar__avatar { width: 34px; height: 34px; border-radius: var(--r-sm); font-size: 13px; }
  [data-vp-tema="v3"] .vp-appbar__avatar:hover { transform: none; }
}
/* -------------------------------------------------------------
   Topo na cor da marca (pedido do dono, set-2026)
   O topo passa a carregar o laranja do Vendas Pay. Mesmo truque do
   trilho: em vez de caçar cada elemento, os tokens são redefinidos
   DENTRO do .vp-appbar e o que já lê var(--vp-text) etc. fica branco
   sozinho. O laranja é o mesmo nos dois modos — é marca, não fundo;
   no escuro só escurece um tom pra não ofuscar.
   ------------------------------------------------------------- */
@media (min-width: 768px) {
  html[data-vp-tema="v3"] .vp-appbar {
    background: linear-gradient(90deg, #f0681e 0%, #e25a10 100%);
    border-bottom: 0;
    --vp-text:          #fff;
    --vp-text-muted:    rgba(255, 255, 255, .82);
    --vp-border:        rgba(255, 255, 255, .30);
    --vp-border-strong: rgba(255, 255, 255, .50);
    --vp-surface:       rgba(255, 255, 255, .12);
    --vp-n100:          rgba(255, 255, 255, .22);
  }
  html[data-vp-tema="v3"][data-theme="dark"] .vp-appbar {
    background: linear-gradient(90deg, #c9540f 0%, #b4480b 100%);
  }
  html[data-vp-tema="v3"] .vp-appbar__hi,
  html[data-vp-tema="v3"] .vp-appbar__hi strong { color: #fff; }
  html[data-vp-tema="v3"] .vp-appbar__sub { color: rgba(255, 255, 255, .82); }
  html[data-vp-tema="v3"] .vp-appbar__bell {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .30);
    color: #fff;
  }
  html[data-vp-tema="v3"] .vp-appbar__bell:hover {
    background: rgba(255, 255, 255, .26);
    border-color: rgba(255, 255, 255, .5);
    color: #fff;
  }
  /* Menu recolhido: o botão fica "aceso" em branco cheio. */
  html[data-vp-tema="v3"].vp-nav-off .vp-nav-toggle {
    background: #fff; color: #d1530b; border-color: #fff;
  }
  /* Avatar invertido: sobre laranja, pastilha branca com a inicial laranja. */
  html[data-vp-tema="v3"] .vp-appbar__avatar { background: #fff; color: #d1530b; }
  /* Com o menu recolhido a marca aparece no topo — sobre laranja, sempre a branca. */
  html[data-vp-tema="v3"] .vp-appbar__brand img.vp-logo--light { display: none; }
  html[data-vp-tema="v3"] .vp-appbar__brand img.vp-logo--dark  { display: block; }
}

[data-vp-tema="v3"] .vp-topbar { border-bottom: 1px solid var(--vp-border); box-shadow: none; }

/* =============================================================
   7. CARTÕES E SEÇÕES
   ============================================================= */
[data-vp-tema="v3"] .vp-card {
  border-radius: var(--r-md);
  box-shadow: none;
  padding: var(--sp-4);
}
[data-vp-tema="v3"] .vp-card--padded { padding: var(--sp-5); }
[data-vp-tema="v3"] .vp-card--hover:hover,
[data-vp-tema="v3"] a.vp-card:hover,
[data-vp-tema="v3"] .vp-card--interactive:hover {
  box-shadow: none;
  border-color: var(--vp-border-strong);
  transform: none;
}
[data-vp-tema="v3"] .vp-card__title { font-size: 14px; font-weight: 700; letter-spacing: -.01em; margin-bottom: var(--sp-2); }

[data-vp-tema="v3"] .vp-form-section {
  background: var(--vp-surface);
  border-color: var(--vp-border);
  border-radius: var(--r-md);
  box-shadow: none;
  padding: var(--sp-4);
}
[data-vp-tema="v3"] .vp-form-section__title { font-size: 13px; }

/* Títulos de seção internos (o padrão "h3 + hint" das telas novas) */
[data-vp-tema="v3"] .fin-sec__head h3,
[data-vp-tema="v3"] .cd-sec__head h3,
[data-vp-tema="v3"] .bank-section-title h3 {
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--vp-text-muted);
}

/* =============================================================
   8. KPI — sem faixa, sem pulo: rótulo pequeno em caixa alta, valor denso
   ============================================================= */
[data-vp-tema="v3"] .vp-kpi {
  border-radius: var(--r-md);
  box-shadow: none;
  padding: 14px var(--sp-4);
  gap: 4px;
  justify-content: flex-start;
  min-height: 96px;
}
[data-vp-tema="v3"] .vp-kpi:hover { transform: none; box-shadow: none; border-color: var(--vp-border-strong); }
[data-vp-tema="v3"] .vp-kpi__icon {
  top: 12px; right: 12px;
  width: 30px; height: 30px;
  border-radius: var(--r-sm);
  border: 0;
}
[data-vp-tema="v3"] .vp-kpi__icon .vp-icon { width: 15px; height: 15px; }
[data-vp-tema="v3"] .vp-kpi__label { font-size: 10.5px; letter-spacing: .08em; font-weight: 700; padding-right: 40px; }
[data-vp-tema="v3"] .vp-kpi__value { font-size: 23px; letter-spacing: -.03em; margin-top: 2px; font-variant-numeric: tabular-nums; }
[data-vp-tema="v3"] .vp-kpi__delta { font-size: 11.5px; }

/* KPIs do financeiro e da ficha seguem a mesma régua */
[data-vp-tema="v3"] .fin-kpi, [data-vp-tema="v3"] .cd-kpi, [data-vp-tema="v3"] .ac-kpi { padding: 12px 14px; border-radius: var(--r-md); }
[data-vp-tema="v3"] .fin-kpi__v, [data-vp-tema="v3"] .cd-kpi__v { font-size: 1.25rem; }

/* =============================================================
   9. BOTÕES — 36px no desktop, chapados, raio 6
   ============================================================= */
[data-vp-tema="v3"] .vp-btn {
  border-radius: var(--r-sm);
  font-weight: 600;
  letter-spacing: 0;
}
[data-vp-tema="v3"] .vp-btn--primary, [data-vp-tema="v3"] .vp-btn--primary:hover { box-shadow: none; }
[data-vp-tema="v3"] .vp-btn--secondary { border-color: var(--vp-border-strong); background: var(--vp-surface); }
[data-vp-tema="v3"] .vp-btn--secondary:hover { background: var(--vp-n100); }
[data-vp-tema="v3"] .vp-btn--sm { border-radius: var(--r-xs); }
[data-vp-tema="v3"] .vp-btn:active { transform: none; }
@media (min-width: 768px) {
  [data-vp-tema="v3"] .vp-btn    { min-height: 36px; padding: 0 var(--sp-4); font-size: var(--fs-sm); }
  [data-vp-tema="v3"] .vp-btn--sm { min-height: 30px; padding: 0 10px; font-size: var(--fs-xs); }
  [data-vp-tema="v3"] .vp-btn--lg { min-height: 44px; padding: 0 var(--sp-5); font-size: var(--fs-base); }
}

/* =============================================================
   10. CAMPOS — 36px no desktop, borda fina, foco de 2px
   ============================================================= */
[data-vp-tema="v3"] .vp-input,
[data-vp-tema="v3"] .vp-select,
[data-vp-tema="v3"] .vp-textarea,
[data-vp-tema="v3"] input[type="text"],
[data-vp-tema="v3"] input[type="email"],
[data-vp-tema="v3"] input[type="tel"],
[data-vp-tema="v3"] input[type="number"],
[data-vp-tema="v3"] input[type="date"],
[data-vp-tema="v3"] input[type="password"],
[data-vp-tema="v3"] input[type="search"],
[data-vp-tema="v3"] input[type="url"],
[data-vp-tema="v3"] select,
[data-vp-tema="v3"] textarea {
  border-radius: var(--r-sm);
  border-color: var(--vp-border-strong);
}
[data-vp-tema="v3"] .vp-input:focus,
[data-vp-tema="v3"] .vp-select:focus,
[data-vp-tema="v3"] .vp-textarea:focus {
  box-shadow: 0 0 0 2px rgba(var(--vp-primary-rgb), .18);
  border-color: var(--vp-primary);
}
[data-vp-tema="v3"] .vp-label { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--vp-text-muted); }
[data-vp-tema="v3"] .vp-field { gap: 5px; }
@media (min-width: 768px) {
  [data-vp-tema="v3"] .vp-input, [data-vp-tema="v3"] .vp-select { min-height: 36px; padding: .45rem .7rem; font-size: var(--fs-sm); }
  [data-vp-tema="v3"] .vp-textarea { padding: .55rem .7rem; font-size: var(--fs-sm); }
  [data-vp-tema="v3"] .vp-select--sm { min-height: 30px; padding: .25rem .5rem; font-size: var(--fs-xs); }
}

/* =============================================================
   11. CABEÇALHO DE PÁGINA, SELOS, PÍLULAS, ABAS
   ============================================================= */
[data-vp-tema="v3"] .vp-page-header { margin-bottom: var(--sp-4); gap: var(--sp-1); }
[data-vp-tema="v3"] .vp-page-header__title { font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
[data-vp-tema="v3"] .vp-page-header__sub { font-size: 12.5px; }
[data-vp-tema="v3"] .vp-page-header__back { border-radius: var(--r-sm); padding: 5px 10px; font-size: 12px; }
[data-vp-tema="v3"] .vp-page-header__back:hover { transform: none; background: var(--vp-n100); color: var(--vp-text); }

[data-vp-tema="v3"] .vp-badge {
  border-radius: var(--r-xs);
  padding: 3px 7px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .01em;
  border-color: transparent;
}
[data-vp-tema="v3"]:not([data-theme="dark"]) .vp-badge--success { background: var(--vp-success-100); color: #0b7a55; }
[data-vp-tema="v3"]:not([data-theme="dark"]) .vp-badge--warn    { background: var(--vp-warn-100);    color: #a15c00; }
[data-vp-tema="v3"]:not([data-theme="dark"]) .vp-badge--danger  { background: var(--vp-danger-100);  color: #b42323; }
[data-vp-tema="v3"]:not([data-theme="dark"]) .vp-badge--info    { background: var(--vp-info-100);    color: #1d4fd8; }

/* Chips/pílulas de filtro e abas: quadrado suave em vez de pílula */
[data-vp-tema="v3"] .fat-chip, [data-vp-tema="v3"] .cd-chip, [data-vp-tema="v3"] .ac-chip,
[data-vp-tema="v3"] .filtro-pill, [data-vp-tema="v3"] .auso-resumo__i {
  border-radius: var(--r-sm);
  padding: 5px 10px;
  font-size: 11.5px;
}
[data-vp-tema="v3"] .fin-abas { border-radius: var(--r-md); padding: 3px; }
[data-vp-tema="v3"] .fin-aba { border-radius: var(--r-sm); font-size: var(--fs-sm); }

/* =============================================================
   12. LISTAS E LINHAS — separador fino, menos acolchoado
   ============================================================= */
[data-vp-tema="v3"] .cob-list { gap: 0; }
[data-vp-tema="v3"] .cob-list .cob-row {
  border: 0;
  border-bottom: 1px solid var(--vp-border);
  border-radius: 0;
  box-shadow: none;
  padding: 9px var(--sp-2);
}
[data-vp-tema="v3"] .cob-list .cob-row:last-child { border-bottom: 0; }
[data-vp-tema="v3"] .cob-row:hover,
[data-vp-tema="v3"] .cob-row--estatico:hover { transform: none; box-shadow: none; background: var(--vp-surface-soft); }
[data-vp-tema="v3"] .cob-row { box-shadow: none; border-radius: var(--r-sm); }

[data-vp-tema="v3"] .vp-rec { padding: 9px 11px; border-radius: var(--r-sm); background: var(--vp-surface); font-size: 12.5px; }
[data-vp-tema="v3"] .vp-rec:hover { background: var(--vp-surface-soft); }
[data-vp-tema="v3"] .bank-tx { border-radius: var(--r-sm); }
[data-vp-tema="v3"] .ina-row, [data-vp-tema="v3"] .fat-row, [data-vp-tema="v3"] .cd-cob { padding-top: 9px; padding-bottom: 9px; }
[data-vp-tema="v3"] .fin-card__icon { border-radius: var(--r-sm); width: 32px; height: 32px; font-size: 15px; }

/* =============================================================
   13. MODAIS, ALERTAS, TOASTS
   ============================================================= */
[data-vp-tema="v3"] .vp-modal-box { border-radius: var(--r-lg); box-shadow: var(--sh-pop); }
[data-vp-tema="v3"] .vp-banner,
[data-vp-tema="v3"] .vp-alert { border-radius: var(--r-sm); padding: 10px 12px; font-size: var(--fs-sm); }
[data-vp-tema="v3"] .vp-alert__icon { font-size: 16px; }

/* =============================================================
   14. NAVEGAÇÃO MOBILE
   ============================================================= */
[data-vp-tema="v3"] .vp-bottomnav { border-top: 1px solid var(--vp-border); box-shadow: none; }

/* =============================================================
   16. TELAS DO LOJISTA
   Cobrar (/cobranca-gerar), PDV Móvel, extrato, conferência, clientes,
   analytics, relatórios: cada uma tem CSS próprio dentro da página, com
   sombra, gradiente decorativo e branco cravado que o token não alcança.
   Aqui o tema entra por cima, seletor a seletor. Gradiente que carrega
   SIGNIFICADO (linha devolvida, barra do funil, pulso do "ao vivo") fica.
   ============================================================= */

/* Cobrar e PDV Móvel declaram um mini design-system próprio em :root
   (--pdv-*). Redeclarar aqui, com especificidade maior, redesenha os dois
   sem tocar nas páginas — e no escuro passa a seguir as superfícies do tema. */
:root[data-vp-tema="v3"] {
  --pdv-radius:    var(--r-md);
  --pdv-radius-sm: var(--r-sm);
  --pdv-radius-lg: var(--r-lg);
  --pdv-shadow:    none;
  --pdv-shadow-md: none;
  --pdv-shadow-lg: var(--sh-pop);
  --pdv-ring:      rgba(var(--vp-primary-rgb), .18);
  --pdv-ring-soft: rgba(var(--vp-primary-rgb), .08);
  --pdv-bg:        var(--vp-bg);
  --pdv-card:      var(--vp-surface);
  --pdv-border:    var(--vp-border);
  --pdv-border-2:  var(--vp-border);
  --pdv-text:      var(--vp-text);
  --pdv-muted:     var(--vp-text-muted);
  --pdv-muted-2:   var(--vp-n400);
}
[data-vp-tema="v3"] .pdv-input,
[data-vp-tema="v3"] .pdv-cat__search,
[data-vp-tema="v3"] .pdv-chip,
[data-vp-tema="v3"] .pdv-prd,
[data-vp-tema="v3"] .pdv-item,
[data-vp-tema="v3"] .pdvm-qr,
[data-vp-tema="v3"] .det-qr-box { background: var(--vp-surface); }
[data-vp-tema="v3"] .pdv-input:focus,
[data-vp-tema="v3"] .pdv-cat__search:focus,
[data-vp-tema="v3"] .pdvm-busca:focus { box-shadow: 0 0 0 2px var(--pdv-ring); }
[data-vp-tema="v3"] .pdv-cat__avulsa,
[data-vp-tema="v3"] .pdv-chip.is-active,
[data-vp-tema="v3"] .pdv-prd:hover { box-shadow: none; }
[data-vp-tema="v3"] .pdv-prd:hover { border-color: var(--vp-border-strong); }
[data-vp-tema="v3"] .pdvm-bar { box-shadow: none; border-top: 1px solid var(--vp-border); }
[data-vp-tema="v3"] .pdvm-prd { box-shadow: none; }
[data-vp-tema="v3"] .det-paid-check { box-shadow: none; }

/* Extrato, conferência e analytics: os "heróis" com gradiente viram
   superfície chapada com borda; cartões e linhas perdem a sombra (os que
   usam --sh-* já perderam pelo token — estes são os que tinham valor fixo). */
[data-vp-tema="v3"] .ext-sum__hero,
[data-vp-tema="v3"] .cf-total,
[data-vp-tema="v3"] .anl-kpi--hero {
  background: var(--vp-surface);
  border: 1px solid var(--vp-border);
  box-shadow: none;
}
[data-vp-tema="v3"] .ext-toast {
  background: var(--vp-success);
  box-shadow: var(--sh-pop);
}
[data-vp-tema="v3"] .cf-hero.is-fresh { box-shadow: 0 0 0 2px var(--vp-success-100); }
[data-vp-tema="v3"] .cf-item.is-match { box-shadow: 0 0 0 2px var(--vp-success-100); }
[data-vp-tema="v3"] .cf-busca input:focus { box-shadow: 0 0 0 2px rgba(var(--vp-primary-rgb), .18); }
[data-vp-tema="v3"] .anl-kpi:hover { box-shadow: none; border-color: var(--vp-border-strong); }

/* Linha devolvida/saída no extrato e na conferência: o tinte vermelho é
   significado e fica — mas era #fef2f2 cravado, uma faixa clara no escuro. */
[data-vp-tema="v3"][data-theme="dark"] .ext-row--devolvida,
[data-vp-tema="v3"][data-theme="dark"] .ext-row--saida,
[data-vp-tema="v3"][data-theme="dark"] .cf-item--dev {
  background: linear-gradient(90deg, rgba(220, 38, 38, .14) 0%, transparent 60%);
}
[data-vp-tema="v3"][data-theme="dark"] .ext-row--devolvida-parcial,
[data-vp-tema="v3"][data-theme="dark"] .cf-item--devparc {
  background: linear-gradient(90deg, rgba(217, 119, 6, .14) 0%, transparent 60%);
}

/* Busca de clientes: o cartão de resultado tinha branco e sombra fixos */
[data-vp-tema="v3"] .res-card { background: var(--vp-surface); box-shadow: none; border: 1px solid var(--vp-border); }
[data-vp-tema="v3"] .res-card--local { border-left: 3px solid var(--vp-primary); }

/* Campo preenchido pela busca (cliente-form): tinta de sucesso sem gradiente */
[data-vp-tema="v3"] .vp-input.is-autofilled { background: var(--vp-success-100); box-shadow: none; }
[data-vp-tema="v3"] .vp-input.is-autofilled:focus { box-shadow: 0 0 0 2px rgba(15, 159, 110, .2); }

/* Meu plano e perfil */
[data-vp-tema="v3"] .mp-card.is-atual { box-shadow: 0 0 0 2px var(--vp-primary-100); }
[data-vp-tema="v3"] .perfil-avatar { box-shadow: none; }

/* Dashboard: o filtro de mês com máscara em gradiente continua (é a
   sombra de rolagem, não decoração) — só a barra "hoje" perde o brilho. */
[data-vp-tema="v3"] .dash-chart__bar.is-today { box-shadow: 0 0 0 1px rgba(var(--vp-primary-rgb), .4); }

/* =============================================================
   15. IMPRESSÃO — nada daqui vaza pro papel
   ============================================================= */
@media print {
  [data-vp-tema="v3"] .vp-card,
  [data-vp-tema="v3"] .vp-kpi { box-shadow: none; }
}
