/* ============================================================================
   NEXUS · TEMA TÁTIL (estilo Duolingo aplicado à paleta azul do sistema)
   ----------------------------------------------------------------------------
   Este arquivo é um OVERLAY: inclua-o DEPOIS de style.css para "duolingizar" a
   interface sem tocar no CSS original. Para reverter, basta remover o <link>.
   Mantém 100% as cores já validadas do Nexus; muda só forma, profundidade e fonte.
   ========================================================================== */

/* Fonte arredondada embutida localmente (Poppins) — funciona 100% offline.
   Alternativa livre à Feather Bold do Duolingo. */
@font-face{ font-family:'NexusRounded'; font-style:normal; font-weight:400;
  src:url('/fonts/Poppins-Regular.woff') format('woff'); font-display:swap; }
@font-face{ font-family:'NexusRounded'; font-style:normal; font-weight:500;
  src:url('/fonts/Poppins-Medium.woff') format('woff'); font-display:swap; }
@font-face{ font-family:'NexusRounded'; font-style:normal; font-weight:700;
  src:url('/fonts/Poppins-Bold.woff') format('woff'); font-display:swap; }

:root{
  /* cantos mais macios */
  --raio-s: 12px; --raio-m: 16px; --raio-g: 22px;
  /* base 3D dos botões (versões mais escuras da ação/semânticas) */
  --acao-3d: #2A44A8;      /* sombra do azul de ação */
  --verde-3d: #177A50;
  --vermelho-3d: #B8362C;
  --roxo-3d: #5E39A0;
}

body{ font-family: 'NexusRounded', system-ui, sans-serif; letter-spacing: .2px; }
h1,h2,h3,h4,.nx-topo .titulo b, .kpi-bi .num, .logo{
  font-family: 'NexusRounded', system-ui, sans-serif; font-weight: 900; letter-spacing: -.3px;
}

/* ---------- BOTÃO PRIMÁRIO 3D (a assinatura) ---------- */
.btn-nexus{
  font-weight: 800; letter-spacing: .4px; padding: 12px 22px; min-height: 46px;
  border-radius: var(--raio-m); box-shadow: 0 4px 0 var(--acao-3d);
  transition: filter .12s ease, transform .04s ease, box-shadow .04s ease;
}
.btn-nexus:hover{ filter: brightness(1.06); box-shadow: 0 4px 0 var(--acao-3d); }
.btn-nexus:active{ transform: translateY(4px); box-shadow: none; }
.btn-nexus:disabled{ box-shadow: 0 4px 0 var(--border); }

/* variantes semânticas do botão 3D (quando usarem cores utilitárias no style) */
.btn-nexus.verde,  .btn-nexus[data-cor="verde"]  { background: var(--verde);  box-shadow: 0 4px 0 var(--verde-3d); }
.btn-nexus.vermelho,.btn-nexus[data-cor="vermelho"]{ background: var(--vermelho); box-shadow: 0 4px 0 var(--vermelho-3d); }
.btn-nexus.roxo,   .btn-nexus[data-cor="roxo"]   { background: var(--roxo);   box-shadow: 0 4px 0 var(--roxo-3d); }

/* ---------- BOTÃO OUTLINE com base 3D ---------- */
.btn-nexus-outline{
  font-weight: 800; letter-spacing: .4px; padding: 11px 20px; min-height: 46px;
  border-width: 2px; border-bottom-width: 4px; border-radius: var(--raio-m);
  color: var(--acao);
  transition: transform .04s ease, border-color .12s ease, background .12s ease;
}
.btn-nexus-outline:hover{ background: color-mix(in srgb, var(--acao) 8%, transparent); }
.btn-nexus-outline:active{ transform: translateY(2px); border-bottom-width: 2px; }

/* chips e mini-botões mais arredondados */
.nx-chip{ border-radius: 999px; border-width: 2px; font-weight: 700; }
.btn-mini{ border-radius: 999px; font-weight: 800; }

/* ---------- CARDS: contorno mais leve, sem sombra difusa ---------- */
.nexus-card, .card, .kpi, .kpi-bi{
  border-width: 1.5px; border-radius: var(--raio-m);
  box-shadow: none;
}
/* um toque de cor no topo — tira o clima "cinza institucional" sem virar bagunça.
   páginas que já usam .nx-glow com --glow próprio não são afetadas (mais específico). */
.nexus-card:not(.nx-glow), .kpi:not(.nx-glow), .kpi-bi:not(.nx-glow) {
  border-top: 3px solid color-mix(in srgb, var(--acao) 45%, var(--border));
}
.nexus-card:hover, .kpi:hover{ box-shadow: none; }

/* KPIs do BI com um respiro maior e número bem pesado */
.kpi-bi .num{ font-weight: 900; }
.kpi-bi .cap{ font-weight: 800; }

/* ---------- INPUTS mais arredondados e táteis (sem exagerar no peso) ---------- */
input[type=text],input[type=email],input[type=password],input[type=date],input[type=time],
input[type=number],input[type=tel],select,textarea{
  border-width: 1.5px; border-radius: var(--raio-m); padding: 11px 14px; font-weight: 500;
}
input:focus,select:focus,textarea:focus{
  border-color: var(--acao);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--acao) 18%, transparent);
}

/* ---------- SIDEBAR: item ativo mais "pílula" ---------- */
.nx-nav a{ border-radius: 14px; font-weight: 800; letter-spacing: .2px; }

/* ---------- MOVIMENTO: entrada sutil dos cards (sem duplicar a animação da tela) ---------- */
@media (prefers-reduced-motion: no-preference){
  .nexus-card, .kpi, .kpi-bi{ animation: nx-pop .16s ease-out both; }
  @keyframes nx-pop{ 0%{ opacity:0 } 100%{ opacity:1 } }
}