/* =================================================================
   GLM OLT — visual da família GLM (o mesmo do painel GLM Atende).
   Camada por cima do tema-fibra.css: troca só tokens, fontes e alguns
   acabamentos. Sempre escuro, nos dois temas. Para voltar ao tema
   "fibra", basta tirar este arquivo do index.html.
   Cor da linha GLM OLT: azul #4C82FF.
   ================================================================= */

@font-face { font-family: "Archivo"; font-weight: 600; font-display: swap; src: url(/vendor/fonts/archivo-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Archivo"; font-weight: 700; font-display: swap; src: url(/vendor/fonts/archivo-latin-700-normal.woff2) format("woff2"); }
@font-face { font-family: "Public Sans"; font-weight: 500; font-display: swap; src: url(/vendor/fonts/public-sans-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: "Public Sans"; font-weight: 600; font-display: swap; src: url(/vendor/fonts/public-sans-latin-600-normal.woff2) format("woff2"); }

html[data-theme="dark"], html[data-theme="light"], html:not([data-theme]) {
  --f-display: "Archivo", system-ui, sans-serif;
  --f-body: "Public Sans", system-ui, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, monospace;
  --fx-bg: #0e1424;
  --fx-bg-2: #111a2e;
  --fx-panel: #152036;
  --fx-panel-solid: #152036;
  --fx-panel-2: #1a2742;
  --fx-line: #24324f;
  --fx-line-strong: #2f4166;
  --fx-text: #e6ecf8;
  --fx-muted: #9aaccd;
  --fx-faint: #6f80a5;
  --fx-blue: #4C82FF;
  --fx-green: #45d68a;
  --fx-cyan: #4C82FF;
  --fx-warn: #f0a93a;
  --fx-bad: #ff6b6d;
  --fx-glow-blue: rgba(76, 130, 255, .14);
  --fx-glow-green: transparent;
  --fx-shadow: 0 18px 50px -24px rgba(0, 0, 0, .7);
  --fx-dot: transparent;

  --ops-canvas: #0e1424; --ops-canvas-deep: #0a0f1c; --ops-nav: #0b111f;
  --ops-panel: #152036; --ops-panel-head: #1a2742; --ops-control: #111a2e;
  --ops-line: #24324f; --ops-text: #e6ecf8; --ops-muted: #9aaccd;
  --ops-blue: #4C82FF; --ops-green: #45d68a; --ops-gray: #6f80a5; --ops-orange: #f0a93a;
  --blue-50: rgba(76, 130, 255, .12); --blue-100: rgba(76, 130, 255, .2); --blue-500: #4C82FF; --blue-600: #4C82FF; --blue-700: #8fb0ff;
  --success: #45d68a; --warning: #f0a93a; --danger: #ff6b6d;
  --kpi-blue: #4C82FF; --kpi-green: #45d68a; --kpi-gray: #9aaccd; --kpi-amber: #f0a93a;
  --sig-good: #45d68a; --sig-warn: #f0a93a; --sig-low: #ff6b6d; --sig-off: #6f80a5;
  --seg-fill: #111a2e; --seg-line: #24324f; --seg-on: rgba(76, 130, 255, .2); --seg-on-line: #4C82FF;
  --radius-sm: 10px; --radius-md: 14px;
  color-scheme: dark;
}

/* fundo: um foco de luz só, como no GLM Atende (sem pontilhado) */
html[data-theme] body::before {
  background: radial-gradient(1400px 700px at 70% -10%, var(--fx-glow-blue), transparent 70%), var(--fx-bg);
}

/* sempre escuro: o botão de tema não tem mais o que trocar */
html[data-theme] .theme-toggle { display: none !important; }

/* títulos em Archivo, sem caixa alta espaçada */
html[data-theme] .page-heading h1, html[data-theme] .content h1 {
  font: 800 26px/1.15 var(--f-display); letter-spacing: -.01em; text-transform: none;
}
html[data-theme] .panel-title, html[data-theme] .olt-health-heading h2, html[data-theme] dialog h2 {
  font-weight: 700; letter-spacing: 0; text-transform: none;
}

/* marca do menu: GLM + balão "OLT" */
html[data-theme] .brand-name { font: 800 22px/1 var(--f-display); letter-spacing: -.01em; color: #fff; text-transform: none; }
html[data-theme] .brand-name .glm-chip, .brand-name .glm-chip {
  display: inline-block; margin-left: 6px; padding: 3px 8px 4px; border-radius: 7px;
  background: #4C82FF; color: #06122e; font: 800 13px/1 var(--f-display); letter-spacing: .06em; vertical-align: 3px;
}

/* menu: item ativo cheio na cor da linha, como no GLM Atende */
html[data-theme] .nav button.active { background: #4C82FF !important; color: #06122e !important; }
html[data-theme] .nav button.active::before { display: none !important; }
html[data-theme] .nav button.active svg { color: #06122e; }

/* botão principal: pílula sólida, texto escuro (sem chanfro nem degradê) */
html[data-theme] button.primary {
  clip-path: none; border-radius: 999px; background: #4C82FF; color: #06122e;
  font: 700 14px/1 var(--f-body); letter-spacing: 0; text-transform: none; padding: 11px 18px;
}
html[data-theme] button.primary:hover { background: #6e9bff; filter: none; }

/* ícone da marca e avatares: cor sólida da linha, sem degradê azul→verde */
html[data-theme] .brand-mark, html[data-theme] .sidebar .brand-mark { background: #4C82FF !important; color: #06122e !important; box-shadow: none !important; }
html[data-theme] .avatar { background: #1a2742 !important; color: #c3cfe6 !important; }