/* iEng · tema iNOVA Capixaba (mesmo padrão visual do SIGEC): paleta oficial, Libre Franklin + Source Sans 3 */
:root {
  --ieng-vinho: #7F2145;
  --ieng-vinho-escuro: #66193A;
  --ieng-marinho: #263F73;
  --ieng-noite: #222940;
  --ieng-rosa: #EE638D;
  --ieng-cinza: #F2F2F2;
  --ieng-rosa-claro: #FCE8EE;
  --texto-suave: #5A6180;
  --linha: #DCDEE6;
  --linha-forte: #D5D9E6;
  --superficie-suave: #F7F7FA;

  --ok: #1E7B4C; --ok-bg: #E3F3EA;
  --alerta: #A86200; --alerta-bg: #FFF1D9;
  --risco: #B8321E; --risco-bg: #FBE4E0;
  --info: #263F73; --info-bg: #E6ECF7;
  --neutro: #4A5068; --neutro-bg: #ECEDF2;
  --fim: #6B7085; --fim-bg: #E4E5EA;

  --fonte-titulo: "Libre Franklin", "Segoe UI", system-ui, sans-serif;
  --fonte-texto: "Source Sans 3", "Segoe UI", system-ui, sans-serif;

  --bs-primary: var(--ieng-vinho);
  --bs-primary-rgb: 127, 33, 69;
  --bs-link-color: var(--ieng-vinho);
  --bs-link-color-rgb: 127, 33, 69;
  --bs-link-hover-color: var(--ieng-vinho-escuro);
  --bs-body-font-family: var(--fonte-texto);
  --bs-body-color: var(--ieng-noite);
  --bs-body-bg: var(--ieng-cinza);
  --bs-border-color: var(--linha);
}

body { background: var(--ieng-cinza); font-size: .95rem; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .titulo { font-family: var(--fonte-titulo); color: var(--ieng-marinho); font-weight: 700; }
h1, .h1, .h3 { font-size: 1.55rem; }
h2, .h2, .h4 { font-size: 1.3rem; }
h5, .h5 { font-size: 1.12rem; }
h6, .h6 { font-size: 1rem; }
.fs-1, .fs-2, .fs-3, .fs-4 { font-family: var(--fonte-titulo); font-variant-numeric: tabular-nums; }
.text-secondary, .text-suave { color: var(--texto-suave) !important; }
.num, td.n, th.n { font-variant-numeric: tabular-nums; }
.eyebrow, .kpi-rotulo { font-family: var(--fonte-titulo); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; color: var(--texto-suave); }
.eyebrow { color: var(--ieng-vinho); letter-spacing: .12em; }

/* Bootstrap na cor da marca */
.btn-primary { --bs-btn-bg: var(--ieng-vinho); --bs-btn-border-color: var(--ieng-vinho); --bs-btn-hover-bg: var(--ieng-vinho-escuro); --bs-btn-hover-border-color: var(--ieng-vinho-escuro);
  --bs-btn-active-bg: var(--ieng-vinho-escuro); --bs-btn-active-border-color: var(--ieng-vinho-escuro); --bs-btn-disabled-bg: var(--ieng-vinho); --bs-btn-disabled-border-color: var(--ieng-vinho); }
.btn-outline-primary { --bs-btn-color: var(--ieng-vinho); --bs-btn-border-color: var(--ieng-vinho); --bs-btn-hover-bg: var(--ieng-vinho); --bs-btn-hover-border-color: var(--ieng-vinho);
  --bs-btn-active-bg: var(--ieng-vinho); --bs-btn-active-border-color: var(--ieng-vinho); --bs-btn-disabled-color: var(--ieng-vinho); --bs-btn-disabled-border-color: var(--ieng-vinho); }
.btn-destaque { --bs-btn-color: #fff; --bs-btn-bg: var(--ieng-marinho); --bs-btn-border-color: var(--ieng-marinho); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--ieng-noite); --bs-btn-hover-border-color: var(--ieng-noite);
  --bs-btn-active-color: #fff; --bs-btn-active-bg: var(--ieng-noite); --bs-btn-active-border-color: var(--ieng-noite); }
.text-primary { color: var(--ieng-vinho) !important; }
.bg-primary { background-color: var(--ieng-vinho) !important; }
.border-primary { border-color: var(--ieng-vinho) !important; }
.form-control:focus, .form-select:focus { border-color: var(--ieng-rosa); box-shadow: 0 0 0 .2rem rgba(238, 99, 141, .25); }
.form-check-input:checked { background-color: var(--ieng-vinho); border-color: var(--ieng-vinho); }
.page-link { color: var(--ieng-vinho); }
.active > .page-link, .page-link.active { background-color: var(--ieng-vinho); border-color: var(--ieng-vinho); color: #fff; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--ieng-rosa); outline-offset: 2px; }

/* Largura do conteúdo: padrão limitada (como no SIGEC); Gantt e painéis usam a largura toda (classe larg-total no body) */
.cont-ieng { width: 100%; max-width: 1140px; margin-inline: auto; padding-inline: 1rem; }
@media (min-width: 1200px) { .cont-ieng { max-width: 1280px; } }
.larg-total .cont-ieng { max-width: none; padding-inline: 1.5rem; }

/* Cabeçalho institucional: faixa azul-marinho + barra vinho com sublinhado rosa no item ativo */
.faixa-topo { background: var(--ieng-noite); color: #fff; }
.faixa-topo .marca { font-family: var(--fonte-titulo); font-weight: 800; font-size: 1.5rem; color: #fff; text-decoration: none; letter-spacing: .02em; }
.faixa-topo .marca .sigla { color: var(--ieng-rosa); }
.faixa-topo .usuario { font-size: .85rem; color: #D9DFEE; }
.faixa-topo .usuario a { color: #fff; }
.barra-menu { background: var(--ieng-vinho); position: sticky; top: 0; z-index: 1020; padding: 0; }
.barra-menu .nav-link { color: #fff; font-family: var(--fonte-titulo); font-weight: 600; font-size: .84rem; padding: .7rem .9rem; border-bottom: 3px solid transparent; }
.barra-menu .nav-link:hover, .barra-menu .nav-link:focus, .barra-menu .nav-link.ativo, .barra-menu .nav-link.show { border-bottom-color: var(--ieng-rosa); color: #fff; }
.barra-menu .navbar-toggler { border: 0; padding: .5rem 0; }
.barra-menu .navbar-toggler:focus { box-shadow: 0 0 0 .15rem rgba(238, 99, 141, .5); }
/* Itens do menu suspenso (fundo claro): texto escuro, nunca branco sobre branco */
.barra-menu .dropdown-menu { background: #fff; border: 1px solid var(--linha-forte); border-radius: 8px; margin-top: 0; }
.barra-menu .dropdown-item { color: var(--ieng-noite); font-size: .9rem; }
.barra-menu .dropdown-item:hover, .barra-menu .dropdown-item:focus { background: var(--ieng-rosa-claro); color: var(--ieng-vinho); }
.barra-menu .dropdown-item.active, .barra-menu .dropdown-item:active { background: var(--ieng-vinho); color: #fff; }
@media (max-width: 767.98px) { .barra-menu .nav-link { border-bottom: 0; border-left: 3px solid transparent; padding: .6rem .5rem; }
  .barra-menu .nav-link:hover, .barra-menu .nav-link.ativo, .barra-menu .nav-link.show { border-left-color: var(--ieng-rosa); } }
.rodape { color: var(--texto-suave); font-size: .8rem; }

/* Painéis e cartões */
.cartao-ieng { background: #fff; border: 1px solid var(--linha); border-radius: 8px; }
.destaque-rosa { background: var(--ieng-rosa-claro); border-radius: 8px; }
.kpi-destaque { border-left: 4px solid var(--ieng-vinho); }

/* Tabelas: cabeçalho em fundo muito claro com texto escuro suave (nunca texto branco sobre cinza) */
.table thead th { font-family: var(--fonte-titulo); font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-suave); font-weight: 600;
  background: var(--superficie-suave); white-space: nowrap; border-bottom: 1px solid var(--linha); }
.table thead.sem-caixa-alta th { text-transform: none; letter-spacing: normal; font-size: .78rem; }  /* cabeçalhos com unidades (kWh, m³/m²) */
/* tabela com os meses nas colunas: a 1ª coluna (nome da linha) fica fixa ao rolar para o lado */
.tabela-meses .rotulo { position: sticky; left: 0; z-index: 1; background: #fff; white-space: nowrap; font-weight: 600; min-width: 9rem; }
.tabela-meses tbody th.rotulo { font-family: var(--fonte-titulo); font-size: .8rem; color: var(--ieng-marinho); }
.tabela-meses td, .tabela-meses thead th { min-width: 5.2rem; font-variant-numeric: tabular-nums; }
.table { --bs-table-bg: transparent; }
.table tbody td { vertical-align: middle; }
.table-hover > tbody > tr:hover > * { --bs-table-hover-bg: var(--ieng-rosa-claro); }

/* Selos: fundo claro com texto colorido (a marcação do Bootstrap `text-bg-*` não muda) */
.badge { font-weight: 700; }
.badge.text-bg-success { background-color: var(--ok-bg) !important; color: var(--ok) !important; }
.badge.text-bg-warning { background-color: var(--alerta-bg) !important; color: var(--alerta) !important; }
.badge.text-bg-danger { background-color: var(--risco-bg) !important; color: var(--risco) !important; }
.badge.text-bg-primary { background-color: var(--info-bg) !important; color: var(--info) !important; }
.badge.text-bg-info { background-color: var(--ieng-rosa-claro) !important; color: var(--ieng-vinho) !important; }
.badge.text-bg-secondary { background-color: var(--neutro-bg) !important; color: var(--neutro) !important; }
.badge.text-bg-dark { background-color: var(--fim-bg) !important; color: var(--fim) !important; }
.badge.text-bg-light { background-color: var(--neutro-bg) !important; color: var(--neutro) !important; }

input[type=range], .form-check-input { accent-color: var(--ieng-vinho); }
.progress { background: #E8EAF0; }
.progress-bar { background-color: var(--ieng-marinho); }
.alert { border-radius: 8px; }
.login-caixa { max-width: 380px; margin: 8vh auto; }

/* Gantt macro da lista de obras (HTML + CSS): rótulo à esquerda, escala de meses à direita; a linha toda é um link */
.macro { --rotulo: 250px; border: 1px solid var(--linha); border-radius: 8px; overflow: hidden; background: #fff; }
.macro-rolagem { overflow: auto; max-height: 420px; }
.macro-miolo { min-width: 760px; }
.macro-cab { display: flex; position: sticky; top: 0; z-index: 3; background: var(--superficie-suave); border-bottom: 1px solid var(--linha); height: 30px; }
.macro-rotulo-cab { flex: 0 0 var(--rotulo); padding: 6px 10px; font-family: var(--fonte-titulo); font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-suave); font-weight: 600; }
.macro-eixo { position: relative; flex: 1 1 auto; }
.macro-mes { position: absolute; top: 0; bottom: 0; padding: 7px 0 0 4px; font-size: .72rem; font-weight: 600; color: var(--texto-suave); border-left: 1px solid var(--linha); white-space: nowrap; }
.macro-corpo { position: relative; }
.macro-grade { position: absolute; top: 0; bottom: 0; left: var(--rotulo); right: 0; pointer-events: none; z-index: 1; }
.macro-linha-mes { position: absolute; top: 0; bottom: 0; border-left: 1px solid #EEF0F5; }
.macro-hoje, .macro-chave-hoje { border-left: 2px dashed var(--ieng-rosa); }
.macro-hoje { position: absolute; top: 0; bottom: 0; }
.macro-linha { display: flex; align-items: center; height: 30px; border-bottom: 1px solid #F0F1F6; color: var(--ieng-noite); text-decoration: none; position: relative; }
.macro-linha:hover, .macro-linha:focus-visible { background: var(--ieng-rosa-claro); }
.macro-rotulo { flex: 0 0 var(--rotulo); padding: 0 10px; font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: relative; z-index: 2; }
.macro-pista { position: relative; flex: 1 1 auto; height: 100%; z-index: 2; }
.macro-barra { position: absolute; top: 7px; height: 16px; border-radius: 4px; background: #9aa3bd; overflow: hidden; box-shadow: 0 0 0 1px rgba(34, 41, 64, .15); }
.macro-linha:hover .macro-barra { box-shadow: 0 0 0 2px var(--ieng-vinho); }
.macro-EM_ANDAMENTO { background: var(--ieng-marinho); }
.macro-AUTORIZADA { background: var(--ieng-vinho); }
.macro-CONCLUIDA { background: var(--ok); }
.macro-CANCELADA { background: #C9CCD6; }
.macro-atraso { box-shadow: 0 0 0 2px var(--risco); }
.macro-avanco { position: absolute; left: 0; bottom: 0; height: 6px; background: var(--ieng-rosa); }
.macro-legenda { display: flex; flex-wrap: wrap; gap: .25rem 1rem; align-items: center; }
.macro-chave { display: inline-block; width: 14px; height: 9px; border-radius: 2px; margin-right: .35rem; vertical-align: baseline; }
.macro-chave-avanco { background: var(--ieng-rosa); height: 5px; }
.macro-chave-atraso { background: #fff; box-shadow: 0 0 0 2px var(--risco); }
.macro-chave-hoje { display: inline-block; height: 12px; margin-right: .35rem; vertical-align: middle; }
@media (max-width: 767.98px) { .macro { --rotulo: 150px; } }

/* Abas em pílula (ex.: Manutenção): vinho da Fundação no lugar do azul padrão do Bootstrap */
.nav-pills { --bs-nav-pills-link-active-bg: var(--ieng-vinho); --bs-nav-link-color: var(--ieng-vinho); --bs-nav-link-hover-color: var(--ieng-vinho-escuro); }