/* Identidade do kiro-monitoring, que o kiro-consumo substitui. Único arquivo do front com
   cor literal: estilo.css e o JS só usam var(--…), e a transparência vem das triplas -rgb
   em rgb(var(--X-rgb) / α). Só tema claro. */

:root {
  --roxo: #5219A1;
  --roxo-escuro: #2E0372;
  --roxo-profundo: #1A0540;
  --roxo-medio: #8038F0;
  --lilas: #D1A6FF;
  --lilas-claro: #F5F0FF;
  --amarelo: #FFAD01;
  --laranja: #EF6100;
  --laranja-escuro: #B84A00;
  --cinza-escuro: #2F3136;
  --cinza-texto: #6B7280;
  --cinza-medio: #B5B6BA;
  --cinza-claro: #D7DBDD;
  --cinza-xclaro: #EAEEEF;
  --branco: #FFFFFF;
  --verde: #1E7B34;
  --erro: #B3261E;
  --erro-fundo: #FDECEA;

  --roxo-rgb: 82 25 161;
  --roxo-profundo-rgb: 26 5 64;
  --roxo-medio-rgb: 128 56 240;
  --lilas-rgb: 209 166 255;
  --amarelo-rgb: 255 173 1;
  --cinza-escuro-rgb: 47 49 54;
  --branco-rgb: 255 255 255;

  /* Amarelo legível como texto sobre branco (≈ 5,9:1): o --amarelo puro dá ≈ 1,9:1. */
  --amarelo-escuro: #8A5A00;
  /* Faixa de aviso herdada do Cola Kit; ainda usada pelo .aviso de tier sem plano. */
  --aviso-fundo: #FCDCC4;
  --aviso-texto: #281805;

  --fonte-titulo: "Poppins", system-ui, sans-serif;
  --fonte-texto: "Mulish", system-ui, sans-serif;
}

/* Fontes servidas do próprio domínio: o CSP é 'self' e não admite Google Fonts. */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fontes/poppins-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fontes/poppins-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fontes/poppins-latin-700-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fontes/poppins-latin-800-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Mulish";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fontes/mulish-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Mulish";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fontes/mulish-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Mulish";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fontes/mulish-latin-700-normal.woff2") format("woff2");
}