/* Sistema de Gestão — visual por empresa.
   .tema-cp = Costa Paiva (manual de marca 2026: Marinho, Azul Costa, Figtree)
   .tema-pz = Pazion (site: verde floresta, folha, bege, Open Sans + Bree Serif)
   .tema-neutro = as duas empresas juntas.
   As cores também estão em core/marcas.py (usadas nos documentos gerados). */

@font-face { font-family: "Figtree"; src: url("../fontes/Figtree-Regular.643486771569.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("../fontes/Figtree-SemiBold.272602b338dc.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("../fontes/Figtree-Bold.1313b7fd16fb.ttf") format("truetype"); font-weight: 700; font-display: swap; }

.tema-neutro {
  --marca-primaria: #1f2933;
  --marca-primaria-texto: #ffffff;
  --marca-destaque: #2b79b9;
  --marca-destaque-2: #87b564;
  --marca-apoio: #5b6773;
  --marca-fundo: #f2f3f5;
  --marca-cartao: #ffffff;
  --marca-suave: #eef1f4;
  --marca-zebra: #f6f7f9;
  --marca-texto: #1c232b;
  --marca-borda: #d6dbe0;
  --marca-nav-fundo: #1f2933;
  --marca-nav-texto: #ffffff;
  --marca-nav-filete: #3b4652;
  --marca-fonte: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --marca-fonte-titulo: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --marca-peso-titulo: 700;
}

.tema-cp {
  --marca-primaria: #0e2a42;      /* Marinho */
  --marca-primaria-texto: #ffffff;
  --marca-destaque: #2b79b9;      /* Azul Costa */
  --marca-destaque-2: #00adef;    /* Ciano */
  --marca-apoio: #146684;         /* Petróleo */
  --marca-fundo: #eef2f5;         /* Concreto */
  --marca-cartao: #ffffff;
  --marca-suave: #e8f4fb;         /* Névoa */
  --marca-zebra: #f5f8fa;
  --marca-texto: #1c232b;
  --marca-borda: #ccd3d9;
  --marca-nav-fundo: #ffffff;
  --marca-nav-texto: #0e2a42;
  --marca-nav-filete: #2b79b9;
  --marca-fonte: "Figtree", system-ui, sans-serif;
  --marca-fonte-titulo: "Figtree", system-ui, sans-serif;
  --marca-peso-titulo: 700;
}

.tema-pz {
  --marca-primaria: #093b1b;      /* verde floresta */
  --marca-primaria-texto: #fcf8f3; /* creme */
  --marca-destaque: #356f45;
  --marca-destaque-2: #87b564;    /* folha */
  --marca-apoio: #4c6550;
  --marca-fundo: #f6efe7;         /* bege */
  --marca-cartao: #fbf8f5;
  --marca-suave: #f9f0e6;
  --marca-zebra: #f8f3ed;
  --marca-texto: #051b0e;
  --marca-borda: #c9c8b8;
  --marca-nav-fundo: #093b1b;
  --marca-nav-texto: #fcf8f3;
  --marca-nav-filete: #87b564;
  --marca-fonte: "Open Sans", system-ui, sans-serif;
  --marca-fonte-titulo: "Bree Serif", Georgia, serif;
  --marca-peso-titulo: 400;
}

/* ---------- base ---------- */
body {
  background: var(--marca-fundo);
  color: var(--marca-texto);
  font-family: var(--marca-fonte);
  font-size: 0.95rem;
  --bs-body-color: var(--marca-texto);
  --bs-border-color: var(--marca-borda);
}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5, .titulo-marca {
  font-family: var(--marca-fonte-titulo);
  font-weight: var(--marca-peso-titulo);
  color: var(--marca-primaria);
}
a { color: var(--marca-destaque); }
a:hover { color: var(--marca-primaria); }
.text-marca { color: var(--marca-primaria) !important; }
.text-apoio { color: var(--marca-apoio) !important; }
.bg-marca { background: var(--marca-primaria) !important; color: var(--marca-primaria-texto) !important; }
.bg-suave { background: var(--marca-suave) !important; }

/* ---------- barra do topo ---------- */
.navbar-marca {
  background: var(--marca-nav-fundo);
  border-bottom: 3px solid var(--marca-nav-filete);
  padding-top: .55rem; padding-bottom: .55rem;
}
.navbar-marca .navbar-brand img { height: 38px; width: auto; display: block; }
.navbar-marca .marca-texto { color: var(--marca-nav-texto); font-family: var(--marca-fonte-titulo); font-weight: var(--marca-peso-titulo); font-size: 1.15rem; }
.navbar-marca .nav-link, .navbar-marca .navbar-text { color: var(--marca-nav-texto); opacity: .82; font-weight: 600; font-size: .9rem; }
.navbar-marca .nav-link:hover, .navbar-marca .nav-link.active { opacity: 1; color: var(--marca-nav-texto); }
.navbar-marca .form-select { font-size: .85rem; min-width: 11rem; border-color: var(--marca-borda); }
.navbar-marca .btn-sair { color: var(--marca-nav-texto); border: 1px solid currentColor; opacity: .85; font-size: .8rem; }
.navbar-marca .btn-sair:hover { opacity: 1; }
.marcas-duplas img { height: 30px; width: auto; }

/* ---------- componentes ---------- */
.card { background: var(--marca-cartao); border: 1px solid var(--marca-borda); border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
a.card { color: inherit; }
a.card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.08); color: inherit; }
.card-marca-topo { border-top: 4px solid var(--marca-destaque); }
.filete { width: 48px; height: 3px; background: var(--marca-destaque); border: 0; opacity: 1; margin: .35rem 0 1rem; }

.btn-marca { background: var(--marca-primaria); color: var(--marca-primaria-texto); border: 1px solid var(--marca-primaria); font-weight: 600; }
.btn-marca:hover, .btn-marca:focus { background: var(--marca-destaque); border-color: var(--marca-destaque); color: #fff; }
.btn-outline-marca { color: var(--marca-primaria); border: 1px solid var(--marca-primaria); background: transparent; font-weight: 600; }
.btn-outline-marca:hover { background: var(--marca-primaria); color: var(--marca-primaria-texto); }
.form-control:focus, .form-select:focus { border-color: var(--marca-destaque); box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--marca-destaque) 22%, transparent); }

/* tabelas no padrão das planilhas: cabeçalho na cor principal, zebra clara, total destacado */
.tabela-marca { --bs-table-bg: var(--marca-cartao); margin-bottom: 0; }
.tabela-marca thead th { background: var(--marca-primaria); color: var(--marca-primaria-texto); font-weight: 600; font-size: .82rem; border-color: var(--marca-primaria); vertical-align: middle; }
.tabela-marca tbody tr:nth-child(even) > * { background: var(--marca-zebra); }
.tabela-marca tr.linha-grupo > * { background: var(--marca-suave) !important; font-weight: 700; color: var(--marca-primaria); }
.tabela-marca tr.linha-total > * { background: var(--marca-suave) !important; font-weight: 700; border-top: 2px solid var(--marca-primaria); }
.tabela-marca td, .tabela-marca th { white-space: nowrap; }
.tabela-marca td.quebra, .tabela-marca th.quebra { white-space: normal; min-width: 16rem; }
.caixa-tabela { background: var(--marca-cartao); border: 1px solid var(--marca-borda); border-radius: 8px; overflow: auto; }

.numero { text-align: right; font-variant-numeric: tabular-nums; }
.etiqueta-empresa { display: inline-block; font-size: .72rem; font-weight: 700; padding: .1rem .45rem; border-radius: 4px; color: #fff; }
.etiqueta-empresa.cp { background: #0e2a42; }
.etiqueta-empresa.pz { background: #093b1b; }

.indicador { font-family: var(--marca-fonte-titulo); font-weight: var(--marca-peso-titulo); font-size: 1.35rem; color: var(--marca-primaria); line-height: 1.2; }
.indicador-rotulo { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--marca-apoio); }
.progress { background: var(--marca-suave); }
.progress-bar { background: var(--marca-destaque); }

/* cartão de empresa na tela inicial: cada um com a própria marca */
.cartao-empresa .cartao-empresa-topo { background: var(--marca-nav-fundo); border-bottom: 3px solid var(--marca-nav-filete); padding: .9rem 1rem; border-radius: 8px 8px 0 0; }
.cartao-empresa .cartao-empresa-topo img { height: 40px; width: auto; }

/* tela de entrar */
.pagina-entrar .card { border-top: 4px solid var(--marca-destaque); }

/* ajustes finos por marca */
.tema-cp .navbar-marca .navbar-brand img { height: 46px; }
.badge.text-bg-primary { background-color: var(--marca-destaque) !important; color: #fff !important; }

/* funil do comercial */
.funil { overflow-x: auto; }
.funil-coluna { flex: 1 0 12.5rem; min-width: 12.5rem; }
.funil-cartao { border-left: 3px solid var(--marca-destaque-2); }
.funil-cartao.atrasado { border-left-color: #dc3545; }

/* impressão (prestação de contas, relatórios): só o documento */
@media print {
  .navbar-marca, .no-print, .alert { display: none !important; }
  body { background: #fff !important; }
  main.container { max-width: 100% !important; padding: 0 !important; }
  .documento { border: 0 !important; box-shadow: none !important; }
  .tabela-marca thead th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .linha-grupo > *, .linha-total > * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}