/* Identidade visual SOMA+ (IDENTIDADE-VISUAL.md, secao 5) - fonte unica da
verdade das cores/fontes/raios. Nao "chutar" cor no meio de nenhum template -
tudo sai daqui. */
:root, [data-theme="light"] {
  /* superficies */
  --bg: #faf7f5;
  --surface: #ffffff;
  --surface-alt: #eee5e1;
  --border: #e6ddd7;
  /* texto */
  --text: #1d1e2a;
  --text-muted: #6b6b76;
  /* marca */
  --primary: #e9573e;
  --primary-hover: #d4472f;
  --on-primary: #ffffff;
  /* status */
  --success: #1f9d64; --warning: #e0a300; --danger: #c62828; --info: #3a6ea5;
  /* plataformas (cores oficiais de marca do Meta/Google, nao da paleta SOMA+
     - mesmas nos dois temas, so' pra identificacao rapida de plataforma) */
  --meta-azul: #0866FF;
  --google-amarelo: #FBBC05;
  /* forma */
  --raio-sm: 8px; --raio: 12px; --raio-lg: 16px; --raio-pill: 999px;
  --sombra-card: 0 1px 2px rgba(29,30,42,.06), 0 4px 16px rgba(29,30,42,.06);
  /* fontes */
  --font-titulo: "Poppins", system-ui, sans-serif;
  --font-corpo: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Courier New", monospace;
}

[data-theme="dark"] {
  --bg: #15161f;
  --surface: #1d1e2a;
  --surface-alt: #262735;
  --border: #33344a;
  --text: #eee5e1;
  --text-muted: #9a9aa8;
  --primary: #f26a52;
  --primary-hover: #e9573e;
  --on-primary: #15161f;
  --success: #35b87d; --warning: #f0b83a; --danger: #e5605a; --info: #6ea3d8;
  --sombra-card: 0 1px 2px rgba(0,0,0,.4);
}

/* Ponte para o Bootstrap 5.3 (para os componentes nativos herdarem a marca) */
:root, [data-theme="light"] { --bs-primary: var(--primary); --bs-body-bg: var(--bg); --bs-body-color: var(--text); --bs-border-color: var(--border); }
[data-theme="dark"] { --bs-primary: var(--primary); --bs-body-bg: var(--bg); --bs-body-color: var(--text); --bs-border-color: var(--border); }

body { background: var(--bg); color: var(--text); font-family: var(--font-corpo); font-feature-settings: "tnum"; }
h1,h2,h3,h4,.h-titulo { font-family: var(--font-titulo); }
.card, .painel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--raio); box-shadow: var(--sombra-card); }
.btn-primary { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.btn-primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
a { color: var(--primary); }
.numero, td.numero { font-variant-numeric: tabular-nums; }
.previa-relatorio { font-family: var(--font-mono); white-space: pre-wrap; }
/* status - cor de fundo + texto com contraste adequado (AA - amber pede
   texto escuro, os demais pedem texto branco) */
.badge-sucesso{background:var(--success); color:#fff;}
.badge-atencao{background:var(--warning); color:#1d1e2a;}
.badge-critico{background:var(--danger); color:#fff;}
.badge-info{background:var(--info); color:#fff;}
.badge-meta{background:var(--meta-azul); color:#fff;}
.badge-google{background:var(--google-amarelo); color:#1d1e2a;}

/* --- Layout de sidebar (Fase 4/D77) - nao faz parte do doc de identidade,
   e' so' a estrutura de menu lateral fixo que o usuario pediu --- */
.layout-app { display: flex; min-height: 100vh; }
.sidebar {
  width: 240px; flex-shrink: 0; background: var(--surface); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; padding: 16px 12px; position: sticky; top: 0; height: 100vh;
}
.sidebar-logo { padding: 8px 8px 20px; }
.sidebar-logo img { height: 34px; max-width: 100%; }
.sidebar-nav { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.sidebar-nav a {
  display: block; padding: 10px 12px; border-radius: var(--raio-sm); color: var(--text);
  text-decoration: none; font-weight: 500;
}
.sidebar-nav a:hover { background: var(--surface-alt); }
.sidebar-nav a.ativo { background: var(--primary); color: var(--on-primary); }
.sidebar-footer { border-top: 1px solid var(--border); padding-top: 12px; margin-top: 12px; }
.sidebar-usuario { font-size: .875rem; color: var(--text-muted); padding: 0 12px 8px; }
.conteudo-app { flex: 1; padding: 24px 32px; min-width: 0; }
#btn-tema { background: transparent; border: 1px solid var(--border); border-radius: var(--raio-pill); color: var(--text); }
[data-theme="light"] .logo-escuro { display: none; }
[data-theme="dark"] .logo-claro { display: none; }
[data-theme="light"] .modo-escuro { display: none; }
[data-theme="dark"] .modo-claro { display: none; }