/* Cores e fontes da tela do totem (os tamanhos ficam no publico.css).
   As fontes ficam em static/fontes/ (licença OFL), sem depender do Google Fonts. */

@font-face {
  font-family: "Bricolage Grotesque";
  src: url("fontes/bricolage-grotesque.woff2") format("woff2");
  font-weight: 200 800; /* fonte "variável": um arquivo para todas as espessuras */
  font-display: swap;   /* mostra o texto na hora com outra fonte e troca quando esta chegar */
}
@font-face { font-family: "IBM Plex Sans"; src: url("fontes/ibm-plex-sans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fontes/ibm-plex-sans-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "IBM Plex Sans"; src: url("fontes/ibm-plex-sans-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }

:root {
  /* Paleta do site do BRACIS 2026 (bracis.sbc.org.br/2026): azul, verde, amarelo e vermelho */
  --brand: #0A4273;         /* azul do BRACIS: fundo da página */
  --yellow: #F5C745;        /* amarelo do BRACIS: título "Room Occupancy" e faixa do topo */
  --green: #32A64F;         /* verde do BRACIS: faixa do topo e rótulo "Next" */

  /* Cores base (tela escura: texto claro sobre o azul) */
  --bg: var(--brand);       /* fundo da página */
  --bg-2: #07335A;          /* rodapé (azul um pouco mais escuro) */
  --border: rgba(255, 255, 255, 0.16); /* fios entre as salas */
  --track: rgba(255, 255, 255, 0.16);  /* fundo das barras de lotação */

  --ink: #FFFFFF;           /* texto principal, nomes das salas e a % */
  --ink-3: #D3E0EC;         /* texto de apoio (horários, próxima sessão) */
  --muted: #A9BFD4;         /* rótulos, salas vazias (contraste >= 4.5:1 no azul) */
  --next: #7BD893;          /* "Next": o verde do BRACIS mais claro, para ler bem no azul */

  /* O logo é azul: no fundo azul ele aparece em branco (filtro no publico.css) */

  /* Níveis de lotação: "fill" é a cor do site (barra); "text" é um tom mais claro dela,
     para o texto ter contraste no azul. Os níveis diferem em claridade, não só em cor. */
  --lvl-low-fill: #32A64F;  --lvl-low-text: #7BD893;  /* Tranquila  < 40% (verde) */
  --lvl-mid-fill: #F5C745;  --lvl-mid-text: #F5C745;  /* Moderada 40–74% (amarelo) */
  --lvl-high-fill: #F24444; --lvl-high-text: #FF9494; --lvl-high-bg: rgba(242, 68, 68, 0.1); /* Lotada >= 75% (vermelho) */

  /* Tipografia */
  --font-display: "Bricolage Grotesque", Georgia, serif; /* títulos e números grandes */
  --font-body: "IBM Plex Sans", system-ui, sans-serif;   /* texto corrido */

  --radius-pill: 999px;
}
