/**
 * NOC Telão – Variáveis de design (Figma NOC-Interface-V1)
 * Cores e tipografia extraídas do layout para uso responsivo.
 */

:root {
  /* --- Cores de fundo --- */
  /* Fundo principal (tela inteira, header, base) */
  --noc-bg: #000000;
  /* Gradiente sutil opcional (topo do layout) */
  --noc-bg-gradient-start: rgb(8, 34, 0);
  --noc-bg-gradient-mid: rgb(4, 14, 0);
  --noc-bg-gradient-end: #000000;
  /* Quase preto (detalhes, divisores) */
  --noc-near-black: #010101;

  /* --- Superfícies e cards --- */
  /* Cards / painéis (sidebar, blocos de conteúdo) */
  --noc-surface: rgba(51, 51, 51, 0.2);
  /* Card mais opaco (overlays, modais) */
  --noc-surface-card: rgba(26, 26, 26, 0.6);
  /* Pills / botões do header (local, data, Ao Vivo) */
  --noc-pill: rgba(77, 77, 77, 0.22);

  /* --- Texto --- */
  /* Texto primário (títulos, labels) */
  --noc-text: rgba(255, 255, 255, 0.7);
  --noc-text-white: #ffffff;
  /* Texto secundário / muted */
  --noc-text-muted: #b3b3b3;
  --noc-text-muted-alt: #aeaeae;
  --noc-text-muted-light: #ccc;
  --noc-text-display: #d9d9d9;

  /* --- Destaques --- */
  /* Verde (Ao Vivo, status OK, logo) */
  --noc-accent-green: #00e401;

  /* --- Bordas e divisórias --- */
  /* Borda sutil para containers */
  --noc-border: rgba(77, 77, 77, 0.35);

  /* --- Box maior do palco (escalável) --- */
  --noc-stage-box-width: 482px;
  --noc-stage-box-height: 1376px;
  --noc-stage-box-radius: 20.568px;
  --noc-stage-box-bg: rgba(51, 51, 51, 0.2);

  /* --- Tipografia --- */
  /* Corpo (Be Vietnam Pro – parágrafos, labels, UI) */
  --font-body: "Be Vietnam Pro", sans-serif;
  /* Títulos / display (fallback para Special Gothic Condensed One) */
  --font-display: "Oswald", "Archivo Narrow", sans-serif;
  /* Números / figuras (fallback para Bahnschrift) */
  --font-figure: "Bahnschrift", "Franklin Gothic Medium", "Arial Narrow", sans-serif;
}