/* ===========================================================================
   VIA3 UI — identidade visual dos sistemas Via3
   Copiado sem alteração entre projetos (DP Via3, Planner, Relatório de Chamados).
   Carregue SEMPRE antes do CSS do sistema.
   =========================================================================== */
@font-face { font-family:"Poppins"; font-style:normal; font-weight:400; font-display:swap; src:url("/fonts/poppins-400.woff2") format("woff2"); }
@font-face { font-family:"Poppins"; font-style:normal; font-weight:600; font-display:swap; src:url("/fonts/poppins-600.woff2") format("woff2"); }
@font-face { font-family:"Poppins"; font-style:normal; font-weight:700; font-display:swap; src:url("/fonts/poppins-700.woff2") format("woff2"); }

:root {
  --fonte: "Epilogue", "Poppins", "Century Gothic", "Segoe UI Variable Display", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fonte-titulo: "Poppins", "Century Gothic", "Segoe UI Variable Display", system-ui, "Segoe UI", Roboto, sans-serif;
  --raio-sm: 8px; --raio: 12px; --raio-lg: 16px;
  --sombra: 0 18px 40px rgba(0,0,0,.28);
  --sombra-sutil: 0 2px 10px rgba(0,0,0,.18);
  --transicao: .18s ease;
}
:root, html[data-theme="escuro"] {
  color-scheme: dark;
  --fundo:#0e1a24; --fundo-brilho:#16273a; --superficie:#1a2c3b; --superficie-2:#16465f2e;
  --campo:#101e29; --linha:rgba(255,255,255,.08); --linha-forte:#263d4f;
  --tinta:#e9eef2; --tinta-2:#a9b4bd; --tinta-fraca:#7c8c99;
  --acao:#e85a24; --acao-forte:#d24a18; --acao-suave:rgba(232,90,36,.14); --acao-tinta:#fff;
  --serie-1:#4a90d9; --serie-2:#e85a24;
  --ok:#2eb872; --atencao:#e8b33c; --alerta:#e8833c; --erro:#e2574c;
}
html[data-theme="claro"] {
  color-scheme: light;
  --fundo:#f2f5f8; --fundo-brilho:#ffffff; --superficie:#ffffff; --superficie-2:#eef2f6;
  --campo:#f7f9fb; --linha:rgba(14,26,36,.10); --linha-forte:#cdd8e1;
  --tinta:#12212c; --tinta-2:#4a5b68; --tinta-fraca:#6b7c89;
  --acao:#d1490f; --acao-forte:#c74210; --acao-suave:rgba(209,73,15,.10); --acao-tinta:#fff;
  --serie-1:#2f6fb5; --serie-2:#c74210;
  --ok:#1f8f57; --atencao:#b07d10; --alerta:#c2661f; --erro:#c23b32;
  --sombra:0 14px 34px rgba(18,33,44,.10); --sombra-sutil:0 1px 4px rgba(18,33,44,.08);
}
* { box-sizing:border-box; }
body {
  margin:0; min-height:100vh; background:var(--fundo);
  background-image:
    radial-gradient(1200px 520px at 12% -8%, var(--fundo-brilho) 0%, transparent 62%),
    radial-gradient(900px 420px at 92% -12%, color-mix(in srgb, var(--fundo-brilho) 70%, transparent) 0%, transparent 60%);
  background-attachment:fixed;
  color:var(--tinta); font-family:var(--fonte); font-size:14px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4, .marca-via3, .kpi .val { font-family:var(--fonte-titulo); }
h1,h2,h3,h4 { font-weight:700; letter-spacing:-.015em; margin:0; }
a { color:var(--acao); }
button, select, input, textarea { font-family:inherit; font-size:inherit; color:var(--tinta); }
input, select, textarea { background:var(--campo); border:1px solid var(--linha); border-radius:var(--raio-sm);
  padding:10px 12px; transition:border-color var(--transicao), box-shadow var(--transicao); }
input:focus { outline:none; border-color:var(--acao); box-shadow:0 0 0 3px var(--acao-suave); }
input::placeholder { color:var(--tinta-fraca); }
button { cursor:pointer; background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio-sm);
  padding:8px 14px; font-weight:500; transition:background var(--transicao), border-color var(--transicao), filter var(--transicao); }
button:hover { border-color:var(--linha-forte); }
button.acao { background:var(--acao-forte); border-color:transparent; color:var(--acao-tinta); font-weight:700; padding:11px 18px; }
button.acao:hover { filter:brightness(1.07); }
button.fantasma { background:transparent; }
button.perigo { color:var(--erro); border-color:color-mix(in srgb,var(--erro) 42%,transparent); }
.marca-via3 { display:inline-block; line-height:1; }
.marca-via3 .nome { font-size:22px; font-weight:700; letter-spacing:.02em; color:var(--tinta); }
.marca-via3 .nome i { font-style:normal; color:var(--acao); }
.marca-via3 .sub { display:block; margin-top:4px; font-size:10px; font-weight:500; letter-spacing:.34em;
  text-transform:uppercase; color:var(--tinta-fraca); }
.cartao { background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio); box-shadow:var(--sombra-sutil); }
.cartao-flutuante { background:var(--superficie); border:1px solid var(--linha); border-radius:var(--raio-lg); box-shadow:var(--sombra); }
.rotulo { font-size:11px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--tinta-fraca); }