/* ==========================================================================
   Prototipo skin v3 — restyle do sistema real p/ o visual do prototipo.
   Camada isolada sobre saas-override.css. Reversivel: remover o <link>.
   Nao altera logica/dados. Cores da marca: roxo #4b0082 / verde #7ab729 / lima #b7ff00.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@600;700;800&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root{
  --px-ink:#1d1235; --px-muted:#6d6386; --px-faint:#8f86a6;
  --px-line:#e9e3f3; --px-card:#ffffff; --px-bg:#f4f1fb;
  --px-violet:#5b34c4; --px-violet-soft:rgba(91,52,196,.10);
  --px-green:#7ab729; --px-lime:#b7ff00; --px-ink-on:#16240a;
  --px-shadow:0 1px 2px rgba(29,18,53,.05), 0 16px 34px -20px rgba(75,0,130,.26);
  --px-shadow-lg:0 1px 2px rgba(29,18,53,.05), 0 22px 48px -26px rgba(75,0,130,.24);
}

/* ---- Base tipografica ---- */
body, .control, .btn, td, th, .nav, .pill{ font-family:'IBM Plex Sans', Inter, -apple-system, 'Segoe UI', sans-serif; }
.main{ background:
  radial-gradient(900px 520px at 92% -8%, rgba(122,183,41,.06), transparent 60%),
  linear-gradient(180deg, var(--px-bg), #efe9f8) !important; }
h1, h2, h3, .page-head h1, .panel-head h2, .modal-head h2,
.kpis .value, .kpi .value, .stage strong, .box-code, .card-title,
.exec-value, .metric-value, .summary-value{
  font-family:'Archivo', Inter, sans-serif !important; letter-spacing:-.018em;
}
.page-head h1{ font-weight:800 !important; font-size:27px !important; color:var(--px-ink); }
.page-head p{ color:var(--px-muted); }

/* ---- Cards / paineis ---- */
.panel, .chart-card, .funnel-card, .doc-card, .box-card,
.month-card, .mini-metric, .summary-card, .detail-card, .team-card{
  border-radius:16px !important;
  border:1px solid var(--px-line) !important;
  background:var(--px-card) !important;
  box-shadow:var(--px-shadow) !important;
}
.panel{ box-shadow:var(--px-shadow-lg) !important; overflow:hidden; }
.panel-head{ padding:16px 18px !important; border-bottom:1px solid var(--px-line) !important; }
.panel-head h2{ font-weight:700 !important; font-size:15px !important; color:var(--px-ink); }

/* ---- KPIs ---- */
.kpis, .four-kpis, .three-kpis{ gap:14px !important; }
.kpis .kpi, .four-kpis .kpi, .three-kpis .kpi{
  border-radius:16px !important; border:1px solid var(--px-line) !important;
  background:var(--px-card) !important; padding:16px 17px !important;
  box-shadow:var(--px-shadow) !important;
  transition:transform .16s ease, box-shadow .16s ease;
}
.kpis .kpi:hover, .four-kpis .kpi:hover, .three-kpis .kpi:hover{
  transform:translateY(-2px); box-shadow:var(--px-shadow-lg) !important;
}
.kpi .label{ font-size:11px !important; letter-spacing:.06em !important; text-transform:uppercase; color:var(--px-muted) !important; font-weight:600 !important; }
.kpi .value{ font-weight:800 !important; font-size:28px !important; font-variant-numeric:tabular-nums; letter-spacing:-.02em; color:var(--px-ink); margin-top:6px; }
.kpi small{ color:var(--px-faint) !important; }
.four-kpis .kpi:first-child, .kpis.four-kpis .kpi:first-child{
  background:linear-gradient(180deg, rgba(122,183,41,.13), var(--px-card)) !important;
  border-color:rgba(122,183,41,.42) !important;
}

/* ---- Numeros alinhados ---- */
.kpi .value, .money, td.money, .value, .box-code{ font-variant-numeric:tabular-nums; }

/* ---- Tabelas ---- */
th{ text-transform:uppercase; font-size:10.5px !important; letter-spacing:.08em !important; color:var(--px-faint) !important; font-weight:600 !important; background:#faf8ff !important; }
td{ border-top:1px solid var(--px-line) !important; }
tbody tr:hover{ background:var(--px-violet-soft) !important; }
.vehicle strong{ color:var(--px-ink); }
.pill{ border-radius:999px !important; font-weight:600 !important; font-size:11px !important; padding:4px 10px !important; }

/* ---- Botoes ---- */
.btn{ border-radius:11px !important; font-weight:600 !important; }
.btn.primary{ background:linear-gradient(180deg,#c8ff4d,var(--px-lime)) !important; color:var(--px-ink-on) !important; border:none !important; box-shadow:0 8px 20px -10px rgba(122,183,41,.7) !important; }
.btn.primary:hover{ filter:brightness(1.03); transform:translateY(-1px); }
.btn:not(.primary):not(.danger){ border:1px solid var(--px-line) !important; }

/* ---- Sidebar nav (mantem escura, refina) ---- */
.nav{ border-radius:9px !important; font-weight:500 !important; }
.nav-group{ letter-spacing:.14em !important; }
.nav-count{ font-variant-numeric:tabular-nums; }

/* ---- Busca / inputs ---- */
.control{ border-radius:10px !important; }
.control:focus{ border-color:var(--px-violet) !important; box-shadow:0 0 0 3px var(--px-violet-soft) !important; }

/* ---- Barras / graficos ---- */
.bar i{ background:linear-gradient(90deg, var(--px-green), #a8e832) !important; }

/* ---- Logo sidebar / login ---- */
.side-brand{ display:block !important; text-align:left; padding:2px 6px 15px !important; }
.brand-logo-img{ width:100%; max-width:152px; height:auto; display:block; margin:3px 0 0; }
.login-card .brand{ text-align:left; margin-bottom:4px; }
.login-logo-img{ width:100%; max-width:200px; height:auto; display:block; }
