/* =========================================================
   MOOV - Meu Painel Comercial PRO
   Apenas visual. Não altera APIs, dados, login ou regras.
========================================================= */

body #sec-vendedor {
  background:
    radial-gradient(circle at 92% 2%, rgba(203, 255, 234, .34), transparent 26%),
    linear-gradient(180deg, #faf7ff 0%, #f5f1fb 100%) !important;
}

/* Conteúdo mais executivo e alinhado */
body #sec-vendedor > * {
  max-width: 1580px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Hero principal */
body #sec-vendedor .portfolio-hero,
body #sec-vendedor .moov-producao-hero,
body #sec-vendedor [class*="hero"] {
  min-height: 178px !important;
  padding: 34px 38px !important;
  border-radius: 30px !important;
  border: 1px solid rgba(112, 0, 168, .13) !important;
  background:
    radial-gradient(circle at 88% 28%, rgba(186, 255, 229, .82), transparent 32%),
    linear-gradient(135deg, #fbf1ff 0%, #ffffff 52%, #eafff7 100%) !important;
  box-shadow: 0 20px 54px rgba(31, 27, 54, .08) !important;
  overflow: hidden !important;
}

body #sec-vendedor .portfolio-hero h1,
body #sec-vendedor .moov-producao-hero h1,
body #sec-vendedor [class*="hero"] h1 {
  font-size: clamp(42px, 4.1vw, 60px) !important;
  line-height: 1 !important;
  letter-spacing: -1.8px !important;
  color: #161426 !important;
  margin: 12px 0 12px !important;
}

body #sec-vendedor .portfolio-hero p,
body #sec-vendedor .moov-producao-hero p,
body #sec-vendedor [class*="hero"] p {
  max-width: 850px !important;
  color: #596178 !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

/* Botões do hero */
body #sec-vendedor .portfolio-hero button,
body #sec-vendedor [class*="hero"] button {
  height: 46px !important;
  padding: 0 22px !important;
  border-radius: 16px !important;
  font-weight: 950 !important;
  box-shadow: 0 14px 30px rgba(112, 0, 168, .20) !important;
}

/* Cards gerais */
body #sec-vendedor .card,
body #sec-vendedor .portfolio-card,
body #sec-vendedor .moov-producao-card,
body #sec-vendedor section,
body #sec-vendedor article {
  border-radius: 26px !important;
}

/* Evita que section gigante receba card visual indevido */
body #sec-vendedor.app-section,
body section#sec-vendedor {
  border-radius: 0 !important;
}

/* Bloco resumo da agenda */
body #sec-vendedor h2 {
  color: #101426 !important;
  letter-spacing: -.5px !important;
}

body #sec-vendedor .agenda-summary,
body #sec-vendedor [class*="agenda"][class*="summary"],
body #sec-vendedor [class*="resumo"] {
  border-radius: 26px !important;
}

/* KPIs principais */
body #sec-vendedor [class*="kpi"],
body #sec-vendedor [class*="metric"],
body #sec-vendedor [class*="stat"] {
  border-radius: 22px !important;
}

/* Cards de vendas/faturamento/ticket/leads */
body #sec-vendedor div:has(> span):has(> strong),
body #sec-vendedor div:has(> small):has(> strong) {
  min-width: 0;
}

/* Melhora cards brancos comuns do dashboard */
body #sec-vendedor .seller-card,
body #sec-vendedor .dashboard-card,
body #sec-vendedor .panel-card,
body #sec-vendedor .portfolio-card {
  border: 1px solid rgba(24, 32, 56, .08) !important;
  background:
    radial-gradient(circle at bottom right, rgba(229, 255, 244, .56), transparent 24%),
    rgba(255, 255, 255, .96) !important;
  box-shadow: 0 16px 40px rgba(31, 27, 54, .07) !important;
}

/* Cards grandes: Meta, gráfico, pendências, atalhos */
body #sec-vendedor .grid > div,
body #sec-vendedor [class*="grid"] > div {
  border-radius: 26px !important;
}

/* Ajuste de espaço entre blocos */
body #sec-vendedor .grid,
body #sec-vendedor [class*="grid"] {
  gap: 18px !important;
}

/* Meta do mês */
body #sec-vendedor:has(h1) .progress,
body #sec-vendedor [class*="progress"] {
  border-radius: 999px !important;
  overflow: hidden !important;
}

/* Pendências inteligentes */
body #sec-vendedor div:has(> h2):has(button),
body #sec-vendedor div:has(> h2):has(.btn) {
  border-radius: 26px !important;
}

/* Atalhos rápidos */
body #sec-vendedor button {
  border-radius: 15px !important;
  font-weight: 900 !important;
}

body #sec-vendedor button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(31, 27, 54, .12) !important;
}

/* Tabela últimas vendas */
body #sec-vendedor table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}

body #sec-vendedor table th {
  background: #f5edfb !important;
  color: #5b008c !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  padding: 15px 14px !important;
  border-bottom: 1px solid #e7dff0 !important;
}

body #sec-vendedor table td {
  padding: 15px 14px !important;
  border-bottom: 1px solid #eef0f6 !important;
  color: #33405c !important;
  font-weight: 700 !important;
}

body #sec-vendedor table tr:hover td {
  background: #fbf8ff !important;
}

/* Status da tabela */
body #sec-vendedor table td:last-child {
  font-weight: 900 !important;
}

/* Melhora gráfico */
body #sec-vendedor canvas {
  max-width: 100% !important;
}

/* Compacta um pouco o painel sem perder respiro */
body #sec-vendedor {
  padding-top: 26px !important;
}

body #sec-vendedor > div,
body #sec-vendedor > section,
body #sec-vendedor > article {
  margin-bottom: 18px !important;
}

/* Botão Atualizar no topo da lista */
body #sec-vendedor a,
body #sec-vendedor button {
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

/* Responsivo */
@media (max-width: 1300px) {
  body #sec-vendedor .portfolio-hero,
  body #sec-vendedor .moov-producao-hero,
  body #sec-vendedor [class*="hero"] {
    padding: 28px !important;
  }

  body #sec-vendedor .portfolio-hero h1,
  body #sec-vendedor .moov-producao-hero h1,
  body #sec-vendedor [class*="hero"] h1 {
    font-size: 42px !important;
  }
}

@media (max-width: 760px) {
  body #sec-vendedor {
    padding: 18px 12px !important;
  }

  body #sec-vendedor .portfolio-hero,
  body #sec-vendedor .moov-producao-hero,
  body #sec-vendedor [class*="hero"] {
    min-height: auto !important;
    padding: 24px !important;
  }
}