/* Identidade Mundo a Fora Viagens (Design System v1.1, frente Corporativo/B2B):
   Petroleo estrutura, Tijolo e a unica cor de acao, Inter como unica fonte.
   Cores primitivas so aqui; o resto do arquivo usa os papeis (--titulo, --primaria...). */
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root {
  --mf-petroleo-900: #071F21;
  --mf-petroleo-800: #0A2C2E;
  --mf-petroleo-700: #0E3B3E;
  --mf-petroleo-600: #14504F;
  --mf-petroleo-300: #6FA09D;
  --mf-petroleo-100: #CFE0DE;
  --mf-petroleo-50:  #EEF4F3;
  --mf-tijolo-800: #8A2B21;
  --mf-tijolo-600: #B23A2E;
  --mf-tijolo-100: #F7E4E1;
  --mf-grafite-900: #1C1F20;
  --mf-grafite-700: #3A4042;
  --mf-cinza-500: #636B6E;
  --mf-cinza-300: #B3B9BA;
  --mf-cinza-100: #E6E9E9;
  --mf-off-white: #F7F8F8;
  --mf-sucesso: #14523C;
  --mf-atencao: #8A6410;
  --mf-erro: #701C34;

  --fundo: var(--mf-off-white);
  --superficie: #ffffff;
  --texto: var(--mf-grafite-700);
  --texto-suave: var(--mf-cinza-500);
  --titulo: var(--mf-petroleo-700);
  --rotulo: var(--mf-petroleo-600);
  --filete: var(--mf-petroleo-700);
  --borda: var(--mf-cinza-100);
  --divisor: var(--mf-cinza-300);
  --primaria: var(--mf-tijolo-600);
  --primaria-hover: var(--mf-tijolo-800);
  --primaria-tinta: var(--mf-tijolo-100);
  --link: var(--mf-tijolo-800);
  --campo-fundo: #ffffff;
  --campo-texto: var(--mf-grafite-700);
  --campo-borda: var(--mf-petroleo-900);
  --foco: var(--mf-petroleo-900);
  --perigo: var(--mf-erro);
  --ok: var(--mf-sucesso);
  --atencao: var(--mf-atencao);
  --aviso-fundo: var(--mf-petroleo-50);
  --sombra: 0 1px 2px rgba(7, 31, 33, .06), 0 1px 3px rgba(7, 31, 33, .08);
  --raio: 4px;
  --raio-cartao: 6px;
  --raio-bloco: 10px;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  /* Fundo escuro da marca: sempre Petroleo 900 exato. */
  :root {
    --fundo: var(--mf-petroleo-900);
    --superficie: var(--mf-petroleo-800);
    --texto: #ffffff;
    --texto-suave: var(--mf-petroleo-100);
    --titulo: #ffffff;
    --rotulo: #ffffff;
    --filete: var(--mf-petroleo-300);
    --borda: rgba(255, 255, 255, .16);
    --divisor: rgba(255, 255, 255, .24);
    --primaria-tinta: rgba(255, 255, 255, .08);
    --link: var(--mf-tijolo-100);
    --foco: #ffffff;
    --perigo: var(--mf-tijolo-100);
    --ok: #87AF6A;
    --atencao: #E0D0AE;
    --aviso-fundo: var(--mf-petroleo-700);
    --sombra: none;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font: 15px/1.55 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--fundo);
  color: var(--texto);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--link); }
a:hover { color: var(--primaria); }
#faixa-ambiente {
  background: var(--mf-atencao); color: #fff; text-align: center; font-size: 13px; padding: 4px; font-weight: 600;
}
h1, h2, h3 { color: var(--titulo); font-weight: 600; letter-spacing: -0.015em; line-height: 1.25; }
h1 { font-size: 25px; margin: 0 0 16px; }
h2 { font-size: 18px; margin: 0 0 12px; }
p { margin: 0 0 12px; }
.suave { color: var(--texto-suave); }
.rotulo { font-size: 12.8px; font-weight: 500; text-transform: uppercase; letter-spacing: .12em; color: var(--rotulo); }

/* Logotipo: sempre o SVG oficial, nunca texto digitado. */
.logo { display: block; }
.logo img { display: block; height: 100%; width: auto; }

/* Telas de acesso */
.cartao-acesso {
  max-width: 400px; margin: 10vh auto 24px; padding: 32px 28px;
  background: var(--superficie); border: 1px solid var(--borda); border-top: 4px solid var(--filete);
  border-radius: var(--raio-cartao); box-shadow: var(--sombra);
}
.cartao-acesso .logo { height: 36px; margin-bottom: 20px; }
.cartao-acesso .rotulo { margin-bottom: 4px; }
.marca { font-weight: 600; color: var(--titulo); margin-bottom: 4px; }
.qrcode { display: block; margin: 12px auto; width: 220px; height: 220px; background: #fff; border-radius: var(--raio); }
.segredo { font-family: ui-monospace, monospace; font-size: 13px; word-break: break-all; text-align: center; }

/* Formularios: campo sempre branco solido, borda Petroleo 900 (em qualquer fundo). */
label { display: block; font-weight: 500; margin: 12px 0 4px; font-size: 14px; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=search], input[type=number], input[type=file],
select, textarea, .linha-rateio input, input.valor-curto, .link-publico input {
  width: 100%; padding: 9px 11px; font: inherit; color: var(--campo-texto); color-scheme: light;
  background: var(--campo-fundo); border: 1px solid var(--campo-borda); border-radius: var(--raio);
}
input[type=checkbox], input[type=radio] { accent-color: var(--mf-petroleo-700); }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible { outline: 2px solid var(--foco); outline-offset: 2px; }
input.codigo { font-size: 22px; letter-spacing: 8px; text-align: center; font-family: ui-monospace, monospace; }
.caixa-opcao { display: flex; align-items: center; gap: 8px; font-weight: 400; margin: 6px 0; }
button {
  font: inherit; font-weight: 700; cursor: pointer; border-radius: var(--raio);
  padding: 9px 16px; border: 1px solid var(--primaria); background: var(--primaria); color: #fff;
  transition: background-color 150ms cubic-bezier(.2, .7, .3, 1), border-color 150ms cubic-bezier(.2, .7, .3, 1);
}
button:hover { background: var(--primaria-hover); border-color: var(--primaria-hover); }
button:disabled { opacity: .6; cursor: wait; }
button.secundario { background: transparent; color: var(--primaria); }
button.secundario:hover { background: var(--primaria-tinta); color: var(--primaria-hover); }
button.perigo { background: transparent; border-color: var(--perigo); color: var(--perigo); }
button.perigo:hover { background: var(--primaria-tinta); }
button.largo { width: 100%; margin-top: 18px; }
@media (prefers-color-scheme: dark) {
  button.secundario, button.perigo { border-color: #ffffff; color: #ffffff; }
  button.secundario:hover, button.perigo:hover { color: #ffffff; }
}
.acoes { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.msg-erro { color: var(--perigo); margin-top: 12px; min-height: 1.5em; }
.msg-ok { color: var(--ok); }
.aviso { background: var(--aviso-fundo); border-left: 4px solid var(--filete); padding: 12px 14px; border-radius: var(--raio); margin: 12px 0; }

/* Estrutura logada: cabecalho em Petroleo 900 com a logo negativa. */
.topo {
  display: flex; align-items: center; gap: 16px; padding: 10px 20px;
  background: var(--mf-petroleo-900); color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.topo .logo { height: 28px; flex: 0 0 auto; }
.topo nav { display: flex; gap: 2px; flex: 1; flex-wrap: wrap; }
.topo nav a {
  color: var(--mf-petroleo-100); text-decoration: none; padding: 6px 12px; border-radius: var(--raio);
  border-bottom: 2px solid transparent;
}
.topo nav a:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.topo nav a[aria-current=page] { color: #fff; font-weight: 600; border-bottom-color: var(--mf-petroleo-300); border-radius: var(--raio) var(--raio) 0 0; }
.topo nav a:focus-visible { outline-color: #fff; }
.topo .quem { color: var(--mf-petroleo-100); font-size: 14px; }
.topo button.secundario { border-color: #fff; color: #fff; padding: 6px 14px; }
.topo button.secundario:hover { background: rgba(255, 255, 255, .1); }
.topo button:focus-visible { outline-color: #fff; }
.conteudo { max-width: 1100px; margin: 24px auto; padding: 0 16px; }
.painel { background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-cartao); padding: 20px; margin-bottom: 16px; box-shadow: var(--sombra); }

table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
th, td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--borda); vertical-align: top; }
th { color: var(--rotulo); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; border-bottom-color: var(--divisor); }
.tabela-rolagem { overflow-x: auto; }
.etiqueta { display: inline-block; font-size: 12px; font-weight: 500; padding: 1px 8px; border-radius: var(--raio); border: 1px solid var(--divisor); white-space: nowrap; }
.etiqueta.ok { color: var(--ok); border-color: var(--ok); }
.etiqueta.ok::before { content: "✓ "; }
.etiqueta.alerta { color: var(--perigo); border-color: var(--perigo); }
.etiqueta.alerta::before { content: "! "; font-weight: 700; }
pre.json { font-size: 12px; white-space: pre-wrap; margin: 0; max-width: 380px; }

dialog { border: 1px solid var(--borda); border-top: 4px solid var(--filete); border-radius: var(--raio-cartao); background: var(--superficie); color: var(--texto); padding: 24px; max-width: 440px; width: calc(100% - 32px); box-shadow: 0 4px 12px rgba(7, 31, 33, .08), 0 2px 4px rgba(7, 31, 33, .06); }
dialog::backdrop { background: rgba(7, 31, 33, .55); }
.grade-permissoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 2px 16px; }

@media (max-width: 640px) {
  .topo { flex-wrap: wrap; padding: 10px 16px; gap: 8px 12px; }
  .topo .logo { flex: 1 0 auto; height: 26px; }
  .topo .logo img { width: auto; }
  .topo nav { order: 3; flex: 1 0 100%; flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 12px; }
  .topo nav a { white-space: nowrap; }
  .cartao-acesso { margin-top: 24px; padding: 24px 18px; }
  h1 { font-size: 22px; }
}

/* Formularios em grade e cadastros */
.grade-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; }
.grade-form .largura-2 { grid-column: span 2; }
.grade-form .largura-3 { grid-column: 1 / -1; }
.campo small { display: block; margin-top: 2px; font-size: 12px; }
textarea { resize: vertical; }
h3 { font-size: 16px; margin: 20px 0 4px; }
.painel-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.painel-topo h1, .painel-topo h2 { margin: 0; }
.acoes.compactas { margin-top: 0; }
.acoes.compactas button { padding: 5px 10px; font-size: 13px; }
td .acoes.compactas { flex-wrap: nowrap; }
tr.inativo td { opacity: .55; }
.filtros { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0; }
.filtros input[type=search] { flex: 1 1 260px; width: auto; }
.filtros select { width: auto; }
.abas { display: flex; gap: 4px; border-bottom: 1px solid var(--borda); margin: 8px 0 16px; overflow-x: auto; }
.aba { background: transparent; color: var(--texto-suave); font-weight: 500; border: 0; border-bottom: 3px solid transparent; border-radius: 0; padding: 8px 12px; white-space: nowrap; }
.aba:hover { background: transparent; color: var(--texto); }
.aba[aria-selected=true] { color: var(--titulo); font-weight: 600; border-bottom-color: var(--filete); }
dialog.dialogo-largo { max-width: 860px; max-height: 90vh; overflow-y: auto; }
.dialogo-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.dialogo-topo h2 { margin: 0; }
.dialogo-topo button { padding: 4px 10px; }
fieldset.grupo-opcoes { border: 1px solid var(--borda); border-radius: var(--raio); margin: 14px 0 0; padding: 8px 12px; }
fieldset.grupo-opcoes legend { font-weight: 600; font-size: 14px; padding: 0 4px; }
.aviso.ok { border-left-color: var(--ok); }
table.arvore .nivel-1 { padding-left: 26px; }
table.arvore .nivel-2 { padding-left: 46px; }
table.arvore .nivel-3, table.arvore .nivel-4 { padding-left: 66px; }
details { margin-top: 12px; }
summary { cursor: pointer; color: var(--link); font-weight: 600; }
@media (max-width: 760px) {
  .grade-form { grid-template-columns: 1fr; }
  .grade-form .largura-2 { grid-column: auto; }
}

/* Financeiro */
.cartoes-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 16px; }
.cartao-numero {
  display: block; text-decoration: none; color: var(--texto); background: var(--superficie);
  border: 1px solid var(--borda); border-radius: var(--raio-cartao); padding: 14px 16px;
}
.cartao-numero span { display: block; font-size: 13px; color: var(--texto-suave); }
.cartao-numero strong { font-size: 20px; font-weight: 700; color: var(--titulo); font-variant-numeric: tabular-nums; }
.cartao-numero.alerta strong { color: var(--perigo); }
.cartao-numero:hover { border-color: var(--filete); }
.totais { display: flex; gap: 16px; flex-wrap: wrap; margin: 4px 0 8px; color: var(--texto-suave); }
.totais strong { color: var(--texto); }
.barra-selecao {
  position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: var(--aviso-fundo); border-radius: var(--raio); padding: 8px 12px; margin-bottom: 8px;
}
.barra-selecao[hidden] { display: none; }
.seletor-pessoa input[type=search] { margin: 6px 0; }
.seletor-pessoa .escolhida { font-weight: 600; }
.seletor-pessoa .resultados { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.seletor-pessoa .resultados button { text-align: left; font-weight: 400; }
.linha-rateio { display: grid; grid-template-columns: 2fr 1.5fr 1fr auto; gap: 8px; margin-bottom: 6px; }
input.valor-curto { width: 110px; padding: 6px 8px; }
.total-baixa strong { display: block; font-size: 22px; padding-top: 6px; }
.botao-arquivo { display: inline-flex; flex-direction: column; gap: 6px; font-weight: 600; }
@media (max-width: 760px) { .linha-rateio { grid-template-columns: 1fr; } }
.duas-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .duas-colunas { grid-template-columns: 1fr; } }
.filtros input[type=date] { width: auto; flex: 0 1 170px; }

/* Vendas */
.valor-com-unidade { display: flex; gap: 6px; align-items: center; }
.valor-com-unidade select { width: auto; padding: 6px 8px; }
.valor-com-unidade input.valor-curto { width: 100%; }
.previa-valores {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px 16px; margin: 16px 0;
  padding: 12px 14px; border: 1px dashed var(--filete); border-radius: var(--raio);
}
.previa-valores > div span { display: block; font-size: 13px; color: var(--texto-suave); }
.previa-valores > div strong { font-size: 18px; }
.previa-valores .previa-financeiro, .previa-valores .msg-erro { grid-column: 1 / -1; }

/* Faturamento */
a.botao-link {
  display: inline-block; font-weight: 700; text-decoration: none; border-radius: var(--raio); padding: 9px 16px;
  border: 1px solid var(--primaria); background: var(--primaria); color: #fff;
}
a.botao-link:hover { background: var(--primaria-hover); border-color: var(--primaria-hover); color: #fff; }
a.botao-link.secundario { background: transparent; color: var(--primaria); }
a.botao-link.secundario:hover { background: var(--primaria-tinta); color: var(--primaria-hover); }
.acoes.compactas a.botao-link { padding: 5px 10px; font-size: 13px; }
td a.botao-link { padding: 4px 10px; font-size: 13px; margin-left: 6px; }
.linha-recebimento { grid-template-columns: 1fr 1fr 1fr 1.5fr auto; align-items: center; }
.linha-recebimento .pagador { grid-column: 1 / -1; }
@media (min-width: 641px) { .topo nav a { padding: 6px 9px; font-size: 14px; } .topo { gap: 12px; } }
tr.sugerido td { background: var(--aviso-fundo); }
.barra-selecao { flex-wrap: wrap; }
.duas-colunas > * { min-width: 0; }
/* ---------- relatorios e painel ---------- */
a.cartao-numero { color: inherit; text-decoration: none; display: block; }
.cartao-numero small { display: block; margin-top: 2px; }
.grade-relatorios { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin-bottom: 8px; }
.cartao-relatorio { display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid var(--borda); border-radius: var(--raio);
  background: var(--superficie); color: inherit; text-decoration: none; }
.cartao-relatorio:hover { border-color: var(--filete); }
.cartao-relatorio span { font-size: 13px; }
.linha-filtro, .linha-coluna { display: grid; grid-template-columns: 1.3fr 1fr 1.5fr auto; gap: 6px; align-items: center; margin-bottom: 6px; }
.linha-coluna { grid-template-columns: auto 1.3fr 1.3fr auto; }
.linha-filtro select, .linha-filtro input, .linha-coluna select, .linha-coluna input { width: 100%; min-width: 0; }
.opcoes-filtro { display: flex; flex-wrap: wrap; gap: 4px 10px; }
@media (max-width: 640px) { .linha-filtro, .linha-coluna { grid-template-columns: 1fr; } }
table.tabela-relatorio td.num, table.tabela-relatorio th.num { text-align: right; white-space: nowrap; }
table.tabela-relatorio tr.linha-grupo td { font-weight: 700; color: var(--titulo); padding-top: 12px; }
table.tabela-relatorio tr.linha-grupo.nivel-1 td { padding-left: 20px; }
table.tabela-relatorio tr.linha-subtotal td { font-weight: 600; border-top: 1px solid var(--borda); }
table.tabela-relatorio tfoot td { font-weight: 700; border-top: 2px solid var(--borda); }
table.tabela-dre tr.nivel-0 td { font-weight: 700; }
.agenda-grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.agenda-cab { font-size: 12px; color: var(--texto-suave); text-align: center; }
.agenda-dia { min-height: 64px; border: 1px solid var(--borda); border-radius: 6px; padding: 4px; font-size: 11px; overflow: hidden; }
.agenda-dia.vazio { border: 0; }
.agenda-dia.passado { opacity: .7; }
.agenda-dia.hoje { border-color: var(--filete); border-width: 2px; }
.agenda-num { font-weight: 700; display: block; }
@media (max-width: 640px) { .agenda-dia { min-height: 44px; font-size: 9px; padding: 2px; } }
@media print {
  .topo, .filtros, .acoes, .abas, details > summary { display: none !important; }
  body { background: #fff; }
  .painel { border: 0; box-shadow: none; }
  .cartao-numero strong, h1, h2, h3 { color: var(--mf-petroleo-700); }
}
table.tabela-dre td.recuo-1 { padding-left: 24px; }
table.tabela-dre td.recuo-2 { padding-left: 40px; }
table.tabela-dre td.recuo-3, table.tabela-dre td.recuo-4 { padding-left: 56px; }
.grade-form > * { min-width: 0; }
.grade-form select { max-width: 100%; }
.valor-com-unidade { flex-wrap: wrap; min-width: 0; }
.valor-com-unidade select { max-width: 100%; min-width: 0; }
table.tabela-dre td:first-child { min-width: 220px; }

/* Portal do cliente (paginas publicas) */
.portal .logo, .pagina-publica .logo { height: 32px; margin: 8px 0 20px; }
.portal form.grade-form { margin-top: 8px; }
.portal .cartao-numero:hover { border-color: var(--borda); }
@media (prefers-color-scheme: dark) {
  a.botao-link.secundario { border-color: #ffffff; color: #ffffff; }
  a.botao-link.secundario:hover { color: #ffffff; }
}
