/* ============================================================================
   PULSO — uplift.css · camada CRM (shadcn/Tailwind/Tremor) sobre o app atual
   Marca PULSO (verde #2E7D32 / laranja #C0622A). SÓ visual: borda/raio/sombra/
   tipografia tabular. NÃO altera layout (sem display/position/width). Additivo —
   carrega DEPOIS do <style> do index.html, refina as classes que já existem.
   Ref: GUIA_VISUAL_CRM.md §9 · design/tokens.css
   ============================================================================ */
:root{
  --ui-border:#E2E8F0;            /* slate-200 */
  --ui-muted-fg:#64748B;          /* slate-500 */
  --ui-ssm:0 1px 2px 0 rgb(15 23 42/.05);
  --ui-smd:0 4px 6px -1px rgb(15 23 42/.10),0 2px 4px -2px rgb(15 23 42/.10);
}

/* ---- HOME: cards mais leves (shadcn) ---- */
.home-card{ border:1px solid var(--ui-border)!important; box-shadow:var(--ui-ssm); border-radius:12px; }
.home-card:hover{ box-shadow:var(--ui-smd); border-color:#2E7D32!important; transform:translateY(-1px); }
.home-card-title{ letter-spacing:-.01em; }

/* ---- CLIENTE 360: KPI e seções como card Tremor ---- */
.c360-metrica{ border:1px solid var(--ui-border)!important; border-radius:12px; box-shadow:var(--ui-ssm); }
.c360-metrica-val{ font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.c360-metrica-lbl{ color:var(--ui-muted-fg); text-transform:uppercase; letter-spacing:.04em; }
.c360-section{ border:1px solid var(--ui-border)!important; border-radius:12px; box-shadow:var(--ui-ssm); }
.c360-compara-val,.c360-bar-valor,.c360-top-prod-val{ font-variant-numeric:tabular-nums; }

/* ---- MODAIS: raio + sombra suave (shadcn) ---- */
.hist-modal-content{ border-radius:12px!important; box-shadow:var(--ui-smd)!important; }

/* ---- Números tabulares onde houver R$/%/ha ---- */
.kpi .v,.kpi-comp .v,.totais .val,.grande-total .val{ font-variant-numeric:tabular-nums; }

/* ---- OVERLAYS AGRO (.agro-*, Bento) — !important pq o ui.js injeta estilo depois ----
   Só visual (borda/raio/sombra/tabular). Não toca layout/lógica do módulo. */
.agro-sheet{ border-radius:14px!important; box-shadow:0 10px 30px rgb(15 23 42/.18)!important; }
.agro-card{ border:1px solid var(--ui-border)!important; border-radius:12px!important; box-shadow:var(--ui-ssm)!important; }
.agro-sheet input,.agro-sheet select{ border:1px solid var(--ui-border)!important; border-radius:8px!important; }
.agro-sheet input:focus-visible,.agro-sheet select:focus-visible{ outline:none!important; border-color:#2E7D32!important; box-shadow:0 0 0 3px color-mix(in srgb,#2E7D32 25%,transparent)!important; }
.agro-btn{ border-radius:8px!important; }
.agro-pill{ border-radius:999px!important; }
.agro-card,.agro-row{ font-variant-numeric:tabular-nums; }

/* ---- ABA CADASTROS: cards no padrão shadcn (como a home) ---- */
.cadastros-menu-card{ border:1px solid var(--ui-border)!important; border-radius:12px!important; box-shadow:var(--ui-ssm); }
.cadastros-menu-card:hover{ box-shadow:var(--ui-smd); border-color:#2E7D32!important; transform:translateY(-1px); }
.cadastros-menu-label{ letter-spacing:-.01em; }

/* ---- CLIENTE 360: botões de ação no padrão (raio + foco) ---- */
.c360-action-btn{ border-radius:8px; }
.c360-action-btn:focus-visible{ outline:none; box-shadow:0 0 0 2px #fff,0 0 0 4px color-mix(in srgb,#2E7D32 45%,transparent); }
/* sub-seções do 360: comparativo/top-produtos como card slate (era #FAFAF7) */
.c360-compara-bloco,.c360-top-prod-item{ background:#F8FAFC!important; border:1px solid var(--ui-border)!important; }
.c360-compara-val,.c360-metrica-val,.c360-bar-valor,.c360-top-prod-val{ font-variant-numeric:tabular-nums; }

/* ---- PAINEL DA DIRETORIA (KPI cards inline no src/bi; pai = .dash-cards) ----
   !important pq são inline. Cinza -> branco + borda slate + sombra; destaque verde do Cadu preservado. */
#painelDiretoriaModal .dash-cards>div{ border:1px solid var(--ui-border)!important; box-shadow:var(--ui-ssm)!important; font-variant-numeric:tabular-nums; }
#painelDiretoriaModal .dash-cards>div[style*="244"]{ background:#fff!important; }   /* só os cinza (#f4f6f8); verde fica */

/* ---- Cards/lista legados (sem !important: o <style> do index vem antes; estados :hover/.active preservados) ---- */
/* seletor de prazo no pedido — base mais leve; .pay-option.active (verde) continua vencendo por especificidade */
.pay-option{ border:1px solid var(--ui-border); border-radius:8px; }
/* card de item de lista — mantém a FAIXA VERDE (border-left); só refina as 3 bordas + raio + sombra */
.item-card{ border-top:1px solid var(--ui-border); border-right:1px solid var(--ui-border); border-bottom:1px solid var(--ui-border); border-radius:12px; box-shadow:var(--ui-ssm); }
.item-card-price{ font-variant-numeric:tabular-nums; }
/* resultado de busca — fundo branco + borda slate */
.busca-item{ background:#fff; border:1px solid var(--ui-border); border-radius:8px; }
