/* ============================================================
   WORKSTATION CRIATOR — base.css
   Fontes, tokens de design (:root), reset e utilitários globais.
   Carregar SEMPRE primeiro (as outras folhas dependem das variáveis).
   ============================================================ */

@font-face{font-family:'Inter';src:url('../assets/fonts/inter-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('../assets/fonts/inter-latin-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('../assets/fonts/inter-latin-600-normal.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('../assets/fonts/inter-latin-700-normal.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('../assets/fonts/inter-latin-800-normal.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap;}

:root{
  /* ---- Marca ---- */
  --navy-950:#0b1729;
  --navy-900:#0f1f38;
  --navy-800:#15304f;
  --navy-700:#1c3d63;
  --navy-line:rgba(255,255,255,0.08);
  --navy-line-2:rgba(255,255,255,0.14);

  --blue-50:#eaf1ff;
  --blue-100:#d7e3ff;
  --blue-500:#2f6fed;
  --blue-600:#115ae4;
  --blue-700:#0d46b8;
  --blue-800:#0a3690;

  --indigo-500:#5b63d6;

  --green-50:#e9f8f0;
  --green-100:#cdeedc;
  --green-600:#177a4c;
  --green-700:#13603c;

  --red-50:#fdecea;
  --red-100:#f7d2ce;
  --red-600:#c53d33;
  --red-700:#a3271f;

  --amber-50:#fdf1e2;
  --amber-100:#f7dfb8;
  --amber-600:#a5680f;
  --amber-700:#8a5309;

  /* ---- Neutros ---- */
  --gray-0:#ffffff;
  --gray-25:#f7f8fa;
  --gray-50:#f1f3f6;
  --gray-100:#e8eaef;
  --gray-200:#dbdee5;
  --gray-300:#c2c7d1;
  --gray-400:#9aa1ac;
  --gray-500:#6d7686;
  --gray-600:#4d5566;
  --gray-700:#333c4d;
  --gray-800:#232a38;
  --gray-900:#141925;

  /* ---- Escala tipográfica (8 degraus, cada um com um papel) ---- */
  --text-2xs:11px;   /* rótulos MAIÚSCULOS de tabela, micro-meta */
  --text-xs:12px;    /* legendas, texto secundário */
  --text-sm:13px;    /* corpo, células de tabela, botões-sm */
  --text-md:14px;    /* inputs, corpo enfático, botões */
  --text-lg:16px;    /* título de card, section-title */
  --text-xl:20px;    /* título de página / hero de tela */
  --text-2xl:24px;   /* hero */
  --text-3xl:28px;   /* headline da tela de login */

  /* ---- Escala de espaçamento (múltiplos de 4) ---- */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;

  /* ---- Raio ---- */
  --radius-xs:6px;
  --radius-sm:8px;    /* botões e campos de formulário */
  --radius-md:10px;
  --radius-lg:14px;   /* cards */
  --radius-xl:20px;
  --radius-pill:999px;

  /* ---- Sombra ---- */
  --shadow-xs:0 1px 2px rgba(15,23,42,0.05);
  --shadow-sm:0 1px 3px rgba(15,23,42,0.06),0 1px 2px rgba(15,23,42,0.04);
  --shadow-md:0 8px 24px -6px rgba(15,23,42,0.12);
  --shadow-lg:0 20px 48px -12px rgba(15,23,42,0.22);
  --shadow-focus:0 0 0 3px rgba(17,90,228,0.18);

  --ease:cubic-bezier(.4,0,.2,1);
  --dur-fast:120ms;   /* hover de item (linha, botão, chip) */
  --dur-card:160ms;   /* elevação de card */
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
html,body{height:100%;}
body{
  margin:0;
  font-family:var(--font);
  background:var(--gray-25);
  color:var(--gray-900);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-size:var(--text-md);
  line-height:1.5;
}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,p{margin:0;}
table{font-variant-numeric:tabular-nums;}
::selection{background:var(--blue-100);}

/* Autofill do navegador não pode sobrescrever o campo branco sóbrio. */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--gray-800);
  -webkit-box-shadow:0 0 0 1000px #fff inset;
  box-shadow:0 0 0 1000px #fff inset;
  caret-color:var(--gray-800);
  transition:background-color 9999s;
}

/* Um único modelo de foco em todo o app: anel suave de 3px. Controles em
   superfície escura ou já azuis redefinem localmente (ver components/layout). */
:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:var(--radius-sm);}
@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms !important;transition-duration:.01ms !important;}}

.scrollable{scrollbar-width:thin;scrollbar-color:var(--gray-300) transparent;}
.scrollable::-webkit-scrollbar{width:8px;height:8px;}
.scrollable::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-pill);}

/* ---------- Utilitários globais ---------- */
.section-title{font-size:var(--text-lg);font-weight:700;color:var(--gray-900);margin:0 0 var(--sp-3);letter-spacing:-.01em;}
.muted{color:var(--gray-500);}
.hidden{display:none !important;}
.tnum{font-variant-numeric:tabular-nums;}

/* ---------- Feedback de rede e de carregamento ---------- */
.api-bar{position:fixed;inset:0 0 auto 0;height:2px;z-index:1000;pointer-events:none;overflow:hidden;}
.api-bar.on::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:40%;background:var(--blue-600);animation:api-bar 1.1s var(--ease) infinite;}
@keyframes api-bar{to{left:100%;}}
.skel{position:relative;overflow:hidden;background:var(--gray-100);border-radius:var(--radius-xs);}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:skel 1.4s ease-in-out infinite;}
@keyframes skel{100%{transform:translateX(100%);}}
.skel-line{display:block;height:.8em;width:100%;}
.is-loading{opacity:.55;pointer-events:none;transition:opacity var(--dur-fast) var(--ease);}
.link-btn{background:none;border:0;padding:0;font:inherit;color:var(--blue-600);text-decoration:underline;cursor:pointer;}
.kpi-msg{font-size:var(--text-xs);color:var(--gray-500);padding:var(--sp-2) 0;}
.nav-empty{padding:var(--sp-3) var(--sp-4);font-size:var(--text-xs);line-height:1.6;color:rgba(255,255,255,.6);}
.nav-empty .link-btn{color:#cfe0ff;}