/* Gestão Contábil (módulos 1 a 6) — visual Med|Easy (mesmo do "Pedido de Nota Fiscal"):
   azul-marinho #151C36 + vermelho #FF002D, títulos em Barlow Condensed, texto em Source Sans 3,
   cartões brancos arredondados sobre fundo cinza-claro. Tudo sob .ctb para não vazar no resto do painel.
   Cores de gráfico: paleta validada (scripts/validate_palette.js) sobre fundo branco:
   azul #2a78d6, laranja #eb6834, verde-água #1baf7a; cinza para "não iniciado".
   Estados (ok/aviso/erro) usam a paleta de status e SEMPRE vêm com ícone + texto
   (o vermelho da marca não é usado em dados, para não ser confundido com "erro"). */
.ctb {
  --ctb-s1: #2a78d6;
  --ctb-s2: #eb6834;
  --ctb-s3: #1baf7a;
  --ctb-neutro: #c3c2b7;
  --ctb-ok: #0ca30c;
  --ctb-aviso: #fab219;
  --ctb-serio: #ec835a;
  --ctb-critico: #d03b3b;
  --ctb-grade: #e1e7f0;
  --ctb-tinta2: #475569;
  --me-navy: #151C36;
  --me-navy2: #0E1329;
  --me-red: #FF002D;
  --me-ink: #1C2130;
  --me-mute: #667085;
  --me-line: #E3E6ED;
  --me-paper: #F4F6FA;
  --me-ok: #0E8A5F;
  --me-fd: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
  --me-fb: "Source Sans 3", "Segoe UI", Arial, sans-serif;
  font-family: var(--me-fb);
  color: var(--me-ink);
}
#page-contabil.ctb { background: var(--me-paper); border-color: var(--me-line); border-radius: 20px; padding: 14px; min-width: 0; max-width: 100%; }
@media (max-width: 640px) { #page-contabil.ctb { padding: 10px; border-radius: 14px; } }

/* ---- neutraliza os estilos globais do painel (button/input largos) ---- */
.ctb button { margin: 0; font-family: var(--me-fb); }
.ctb input[type="checkbox"], .ctb input[type="radio"] { width: auto; margin: 0; padding: 0; accent-color: var(--me-red); }
.ctb label { display: block; }
.ctb h3 { font: 700 24px/1.2 var(--me-fd); color: var(--me-navy); letter-spacing: 0; }
.ctb h4 { font: 700 20px/1.2 var(--me-fd); color: var(--me-navy); margin: 0 0 .55rem; letter-spacing: .01em; }
.ctb p { line-height: 1.5; }

/* ---- botões: principal vermelho (como "Gerar pedido"), secundário branco ---- */
.ctb button:not(.secondary-button):not(.ctb-etapa):not(.ctb-intro-prox):not(.ctb-kpi-link):not(.ctb-valor-pdf):not(.delete-button):not(.modal-fechar):not(.senha-olho) {
  background: linear-gradient(90deg, var(--me-red), #ff4d6d); color: #fff; border: 0; border-radius: 12px;
  font: 700 16px var(--me-fd); letter-spacing: .04em; box-shadow: none;
}
.ctb .secondary-button { background: #fff; color: var(--me-navy); border: 1.5px solid var(--me-line); border-radius: 12px; font-weight: 600; box-shadow: none; }
.ctb .secondary-button:hover { border-color: var(--me-red); background: #FFF5F7; box-shadow: none; }
.ctb button:hover { transform: none; }
.ctb button:not(.secondary-button):not(.modal-fechar):not(.senha-olho):hover { filter: brightness(1.06); box-shadow: 0 6px 16px rgba(21, 28, 54, .16); }

/* ---- faixa do topo: logo + mês + empresa ---- */
.ctb-faixa { display: flex; gap: 18px; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; border-radius: 18px; padding: 18px 20px; margin-bottom: 12px; color: #fff;
  background: radial-gradient(900px 500px at 85% -30%, #26305C 0%, var(--me-navy) 50%, var(--me-navy2) 100%); box-shadow: 0 14px 34px rgba(21, 28, 54, .22); }
.ctb-faixa-marca { display: flex; gap: 16px; align-items: center; flex: 1 1 420px; min-width: 0; }
.ctb-faixa-logo { height: 58px; width: auto; border-radius: 10px; box-shadow: 0 10px 26px rgba(0, 0, 0, .45); flex: none; }
.ctb-faixa-passo { font: 700 13px var(--me-fd); letter-spacing: .08em; text-transform: uppercase; color: #ff6b84; }
.ctb .ctb-faixa h2 { font: 700 26px/1.12 var(--me-fd); color: #fff; margin: 2px 0 4px; }
.ctb-faixa p { margin: 0; font-size: 14.5px; color: rgba(255, 255, 255, .8); max-width: 560px; }
@media (max-width: 700px) { .ctb-faixa-logo { height: 44px; } .ctb .ctb-faixa h2 { font-size: 22px; } .ctb-faixa p { display: none; } }
.ctb-contexto { display: flex; gap: .6rem; align-items: flex-end; flex-wrap: wrap; flex: 0 1 auto; }
.ctb-contexto label { font: 700 13px var(--me-fd); letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .78); margin: 0; }
.ctb-contexto input, .ctb-contexto select { margin-top: .25rem; padding: .55rem .7rem; font: 600 15px var(--me-fb); background: #fff; color: var(--me-ink); border: 0; border-radius: 10px; text-transform: none; letter-spacing: 0; }
.ctb-contexto input:focus { outline: none; box-shadow: 0 0 0 3px rgba(255, 0, 45, .35); }
.ctb-contexto .ctb-campo-empresa { width: 340px; max-width: 100%; position: relative; }
.ctb-contexto .ctb-comp { width: 11rem; }
.ctb-comp-nav { display: flex; gap: .25rem; align-items: center; }
.ctb .ctb-faixa .ctb-comp-nav .secondary-button { padding: .55rem .7rem; min-height: 0; line-height: 1; background: rgba(255, 255, 255, .1); color: #fff; border: 1.5px solid rgba(255, 255, 255, .28); margin-top: .25rem; }
.ctb .ctb-faixa .ctb-comp-nav .secondary-button:hover { background: rgba(255, 255, 255, .2); border-color: #fff; }
.ctb .ctb-faixa .ctb-btn-todas { background: transparent; color: #fff; border: 1.5px solid rgba(255, 255, 255, .4); padding: .55rem .8rem; }
.ctb .ctb-faixa .ctb-btn-todas:hover { background: rgba(255, 255, 255, .12); border-color: #fff; }
@media (max-width: 700px) { .ctb-contexto, .ctb-contexto .ctb-campo-empresa { width: 100%; } .ctb-contexto .ctb-comp { flex: 1; width: auto; } }

/* ---- combo de empresa ---- */
.ctb-combo { position: relative; }
.ctb-combo-lista { position: absolute; z-index: 15; left: 0; right: 0; top: 100%; max-height: 280px; overflow-y: auto; background: #fff; border: 1.5px solid var(--me-line); border-radius: 12px; box-shadow: 0 16px 34px rgba(21, 28, 54, .2); list-style: none; display: none; text-transform: none; letter-spacing: 0; }
.ctb-combo-lista.aberta { display: block; }
.ctb-combo-lista li { padding: .5rem .7rem; font: 400 14.5px var(--me-fb); color: var(--me-ink); cursor: pointer; display: flex; gap: .5rem; justify-content: space-between; }
.ctb-combo-lista li:hover, .ctb-combo-lista li.ativo { background: #FFF5F7; }
.ctb-combo-lista li small { color: var(--me-mute); white-space: nowrap; }

/* ---- etapas (navegação entre os módulos) ---- */
.ctb-etapas { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; min-width: 0; max-width: 100%; }
.ctb .ctb-etapa { display: flex; gap: 10px; align-items: flex-start; text-align: left; padding: 11px 12px; background: #fff; color: var(--me-ink); border: 1.5px solid var(--me-line); border-radius: 14px; cursor: pointer; min-width: 0; box-shadow: none; }
.ctb .ctb-etapa:hover { border-color: var(--me-red); background: #FFF5F7; }
.ctb .ctb-etapa.ativa { border-color: var(--me-navy); background: #fff; box-shadow: inset 0 -4px 0 var(--me-red), 0 8px 20px rgba(21, 28, 54, .12); }
.ctb-etapa-num { flex: none; width: 30px; height: 30px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font: 700 17px var(--me-fd); background: var(--me-paper); color: var(--me-navy); border: 1.5px solid var(--me-line); }
.ctb-etapa.ativa .ctb-etapa-num { background: linear-gradient(90deg, var(--me-red), #ff4d6d); color: #fff; border-color: transparent; }
.ctb-etapa-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ctb-etapa-txt b { font: 700 17px/1.15 var(--me-fd); color: var(--me-navy); letter-spacing: .02em; }
.ctb-etapa-txt small { font-size: 12.5px; line-height: 1.3; color: var(--me-mute); font-weight: 400; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 1180px) { .ctb-etapas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) {
  .ctb-etapas { display: flex; overflow-x: auto; gap: 8px; padding-bottom: 4px; scroll-snap-type: x mandatory; }
  .ctb .ctb-etapa { flex: 0 0 auto; scroll-snap-align: start; align-items: center; }
  .ctb-etapa-txt small { display: none; }
}

/* ---- introdução da etapa aberta ---- */
.ctb-intro { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; background: #fff; border: 1.5px solid var(--me-line); border-radius: 16px; padding: 14px 18px; margin-bottom: 12px; }
.ctb-intro-passo { font: 700 13px var(--me-fd); letter-spacing: .08em; text-transform: uppercase; color: var(--me-red); }
.ctb .ctb-intro h3 { margin: 1px 0 3px; }
.ctb-intro p { margin: 0; color: var(--me-mute); font-size: 14.5px; }
.ctb-intro-texto { flex: 1 1 380px; min-width: 0; }
.ctb .ctb-intro-prox { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; background: var(--me-navy); color: #fff; border: 0; border-radius: 12px; padding: 9px 16px; cursor: pointer; box-shadow: none; }
.ctb .ctb-intro-prox small { font: 600 12px var(--me-fb); color: rgba(255, 255, 255, .7); }
.ctb .ctb-intro-prox span { font: 700 17px var(--me-fd); letter-spacing: .03em; }
.ctb .ctb-intro-prox:hover { background: #222b50; }
@media (max-width: 640px) { .ctb-intro { padding: 12px 14px; } .ctb .ctb-intro-prox { width: 100%; } }

/* ---- sub-abas (dentro de uma etapa) ---- */
.ctb-subabas { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .8rem; }
.ctb .ctb-subabas button { padding: .45rem .85rem; font-size: .9rem; border-radius: 999px; min-height: 0; }
.ctb .ctb-subabas button.ativa { background: var(--me-navy); color: #fff; border-color: var(--me-navy); }

/* ---- blocos (cartões) ---- */
.ctb-bloco { border: 1.5px solid var(--me-line); border-radius: 16px; padding: 16px 18px; background: #fff; margin-bottom: 12px; box-shadow: 0 6px 18px rgba(21, 28, 54, .05); }
.ctb-bloco > h4:first-child { margin-top: 0; }
@media (max-width: 640px) { .ctb-bloco { padding: 12px 12px; border-radius: 14px; } }
.ctb-linha { display: flex; gap: .55rem; align-items: center; flex-wrap: wrap; }
.ctb-linha-entre { justify-content: space-between; }
.ctb-acoes { display: flex; gap: .45rem; flex-wrap: wrap; align-items: center; }
.ctb .ctb-acoes button, .ctb .ctb-btn-p { padding: .55rem .9rem; font-size: .92rem; min-height: 0; }
.ctb .ctb-acoes button:not(.secondary-button), .ctb button.ctb-btn-p:not(.secondary-button) { font-size: 16px; }
.ctb .ctb-btn-mini { padding: .3rem .6rem !important; font-size: .8rem !important; min-height: 0 !important; border-radius: 9px !important; }
.ctb .ctb-btn-perigo { background: #fff; color: #b91c1c; border: 1.5px solid #fca5a5; }
.ctb .ctb-btn-perigo:hover { background: #fef2f2; border-color: #b91c1c; }
.ctb-ajuda { color: var(--me-mute); font-size: .9rem; line-height: 1.5; }
.ctb-vazio { color: var(--me-mute); padding: 1.4rem .6rem; text-align: center; font-size: .98rem; }
.ctb-filtros { display: flex; gap: .55rem; flex-wrap: wrap; align-items: flex-end; margin-bottom: .7rem; }
.ctb-filtros label { font: 700 13px var(--me-fd); letter-spacing: .05em; text-transform: uppercase; color: var(--me-mute); margin: 0; }
.ctb-filtros input, .ctb-filtros select { margin-top: .2rem; padding: .5rem .65rem; font: 400 15px var(--me-fb); min-width: 9rem; text-transform: none; letter-spacing: 0; }
.ctb-filtros .ctb-busca { flex: 1 1 220px; }

/* ---- campos ---- */
.ctb input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .ctb select, .ctb textarea { border: 1.5px solid var(--me-line); border-radius: 10px; background: #fff; color: var(--me-ink); font-family: var(--me-fb); }
.ctb input:not([type="checkbox"]):not([type="radio"]):focus, .ctb select:focus, .ctb textarea:focus { outline: none; border-color: var(--me-red); box-shadow: 0 0 0 3px rgba(255, 0, 45, .12); }
.ctb-form { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: .75rem .75rem; }
.ctb-form > label, .ctb-form > .ctb-campo { grid-column: span 4; font-size: .9rem; font-weight: 700; color: var(--me-navy); margin: 0; }
.ctb-form > .c2 { grid-column: span 2; }
.ctb-form > .c3 { grid-column: span 3; }
.ctb-form > .c6 { grid-column: span 6; }
.ctb-form > .c8 { grid-column: span 8; }
.ctb-form > .c12, .ctb-form > h4, .ctb-form > .ctb-ajuda { grid-column: 1 / -1; }
.ctb-form input, .ctb-form select, .ctb-form textarea { padding: .6rem .7rem; font-size: .98rem; font-weight: 600; margin-top: .25rem; }
.ctb-form textarea { font-weight: 400; }
.ctb-form small { display: block; color: var(--me-mute); font-size: .8rem; font-weight: 400; margin-top: .25rem; line-height: 1.4; }
.ctb .ctb-check { display: flex !important; align-items: center; gap: .5rem; font-size: .92rem; font-weight: 600; }
@media (max-width: 760px) {
  .ctb-form > label, .ctb-form > .ctb-campo, .ctb-form > .c2, .ctb-form > .c3, .ctb-form > .c6, .ctb-form > .c8 { grid-column: 1 / -1; }
}

/* ---- tabelas ---- */
.ctb-tabela-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1.5px solid var(--me-line); border-radius: 12px; }
.ctb table { width: 100%; border-collapse: collapse; background: #fff; }
.ctb th, .ctb td { padding: .6rem .65rem; font-size: .92rem; vertical-align: top; border-bottom: 1px solid var(--me-line); }
.ctb th { white-space: nowrap; font: 700 13.5px var(--me-fd); text-transform: uppercase; letter-spacing: .05em; color: var(--me-navy); background: var(--me-paper); text-align: left; }
.ctb tbody tr:last-child td { border-bottom: 0; }
.ctb td.num, .ctb th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ctb td.centro, .ctb th.centro { text-align: center; }
.ctb tr.ctb-clicavel { cursor: pointer; }
.ctb tr.ctb-clicavel:hover td { background: #FFF5F7; }
.ctb tr.ctb-total td { font-weight: 700; border-top: 2px solid var(--me-navy); background: var(--me-paper); }
.ctb tr.ctb-apagada td { color: #94a3b8; text-decoration: line-through; }
.ctb td input, .ctb td select { margin: 0; padding: .35rem .5rem; font-size: .88rem; min-width: 5.5rem; }
.ctb td .ctb-sub { display: block; color: var(--me-mute); font-size: .8rem; margin-top: .1rem; }
.ctb-paginacao { display: flex; gap: .5rem; align-items: center; justify-content: flex-end; margin-top: .6rem; font-size: .88rem; color: var(--me-mute); }
.ctb .ctb-paginacao button { padding: .35rem .7rem; font-size: .85rem; min-height: 0; }

/* ---- selos de situação (cor + ícone + texto) ---- */
.ctb-selo { display: inline-flex; align-items: center; gap: .3rem; border-radius: 999px; padding: .16rem .6rem; font-size: .8rem; font-weight: 700; white-space: nowrap; border: 1px solid transparent; }
.ctb-selo.ok { background: #e9f8e9; color: #0a5c0a; border-color: #b7e3b7; }
.ctb-selo.aviso { background: #fff6dd; color: #7a4f00; border-color: #f6d98a; }
.ctb-selo.erro { background: #fdecec; color: #8f1d1d; border-color: #f2b5b5; }
.ctb-selo.info { background: #eef1f8; color: var(--me-navy); border-color: #d5dbe9; }
.ctb-selo.neutro { background: #f1f5f9; color: #475569; border-color: #dbe3ec; }
/* avisos no formato do "Pedido de Nota Fiscal": faixa colorida à esquerda */
.ctb-alertas { display: grid; gap: .45rem; margin: .5rem 0; }
.ctb-alerta { border-radius: 12px; padding: .65rem .85rem; font-size: .93rem; line-height: 1.5; border: 0; border-left: 5px solid; color: var(--me-ink); }
.ctb-alerta.erro { background: #FFE9ED; border-left-color: #d03b3b; }
.ctb-alerta.aviso { background: #FFF8E6; border-left-color: #F5A623; }
.ctb-alerta.info { background: var(--me-paper); border-left-color: var(--me-navy); }
.ctb-alerta.ok { background: #E9F7F0; border-left-color: var(--me-ok); }

/* ---- indicadores (tiles, como os códigos da nota) ---- */
.ctb-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 12px; }
.ctb-kpi { border: 1.5px solid var(--me-line); border-radius: 14px; padding: .75rem .9rem; background: #fff; min-width: 0; }
.ctb-kpi .rot { font: 700 13.5px var(--me-fd); letter-spacing: .05em; text-transform: uppercase; color: var(--me-mute); }
.ctb-kpi .val { font: 700 26px/1.1 var(--me-fd); color: var(--me-navy); margin-top: .2rem; overflow-wrap: break-word; }
.ctb-kpi .det { color: var(--me-mute); font-size: .82rem; margin-top: .2rem; line-height: 1.35; }
.ctb-kpi.heroi .val { font-size: 3.1rem; }
.ctb button.ctb-kpi-link { background: none; border: none; color: var(--me-red); padding: 0; font-size: .82rem; font-weight: 700; text-decoration: underline; min-height: 0; box-shadow: none; transform: none; }

/* ---- medidor e barras ---- */
.ctb-medidor { height: 10px; border-radius: 999px; background: #cde2fb; overflow: hidden; margin-top: .45rem; }
.ctb-medidor > span { display: block; height: 100%; background: var(--ctb-s1); border-radius: 0 4px 4px 0; }
.ctb-pilha { display: flex; height: 22px; gap: 2px; margin: .5rem 0 .55rem; }
.ctb-pilha > span { display: block; min-width: 3px; height: 100%; }
.ctb-pilha > span:first-child { border-radius: 4px 0 0 4px; }
.ctb-pilha > span:last-child { border-radius: 0 4px 4px 0; }
.ctb-pilha > span:hover, .ctb-pilha > span:focus-visible { filter: brightness(1.1); outline: none; }
.ctb-legenda { display: flex; flex-wrap: wrap; gap: .35rem 1rem; font-size: .88rem; color: var(--ctb-tinta2); }
.ctb-legenda span { display: inline-flex; align-items: center; gap: .35rem; }
.ctb-legenda i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.ctb-legenda b { color: var(--me-ink); }
.ctb-barra-cel { display: flex; align-items: center; gap: .5rem; min-width: 150px; }
.ctb-barra-cel .trilho { flex: 1; height: 12px; border-left: 1px solid #c3c2b7; }
.ctb-barra-cel .trilho > span { display: block; height: 100%; background: var(--ctb-s1); border-radius: 0 4px 4px 0; min-width: 2px; }
.ctb-barra-cel.medidor .trilho { background: #cde2fb; border-left: none; border-radius: 999px; overflow: hidden; }
.ctb-barra-cel .v { font-variant-numeric: tabular-nums; font-size: .88rem; color: var(--me-ink); min-width: 3.2rem; text-align: right; }
/* a dica fica no <body>, fora do .ctb onde --me-navy existe: sem a cor fixa ela aparecia transparente (12/11/2026) */
.ctb-dica { position: fixed; z-index: 60; pointer-events: none; background: #151C36; background: var(--me-navy, #151C36); color: #fff; border-radius: 10px; padding: .45rem .65rem; font-size: .84rem; line-height: 1.35; max-width: 280px; box-shadow: 0 10px 22px rgba(21, 28, 54, .3); font-family: "Source Sans 3", "Segoe UI", Arial, sans-serif; }
.ctb-dica b { font-size: .95rem; display: block; }
.ctb-grade-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 980px) { .ctb-grade-2 { grid-template-columns: 1fr; } }

/* ---- demonstrativo ---- */
.ctb-demo { display: grid; gap: .25rem; }
.ctb-demo .l { display: flex; justify-content: space-between; gap: 1rem; font-size: .95rem; padding: .32rem 0; border-bottom: 1px solid var(--me-line); }
.ctb-demo .l span:last-child { font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 600; }
.ctb-demo .l.total { font-weight: 700; border-bottom: none; border-top: 2px solid var(--me-navy); padding-top: .45rem; color: var(--me-navy); }
.ctb-demo .l.sub { padding-left: 1rem; color: var(--ctb-tinta2); font-size: .88rem; }
.ctb-demo .l.sub span:last-child { font-weight: 500; }

/* ---- modal, aviso flutuante, progresso ---- */
.ctb-modal .modal-card { width: min(100%, 860px); border-radius: 18px; border: 0; }
.ctb-modal .modal-card > h3 { font: 700 24px/1.2 var(--me-fd); color: var(--me-navy); padding-bottom: .5rem; margin-bottom: .8rem; border-bottom: 2px solid var(--me-red); }
.ctb-modal.largo .modal-card { width: min(100%, 1120px); }
.ctb-modal.estreito .modal-card { width: min(100%, 480px); }
.ctb-modal-rodape { display: flex; gap: .55rem; justify-content: flex-end; flex-wrap: wrap; margin-top: 1rem; }
.ctb .ctb-modal-rodape button { padding: .65rem 1rem; font-size: .95rem; }
.ctb .ctb-modal-rodape button:not(.secondary-button) { font-size: 16px; }
.ctb-toasts { position: fixed; right: 1rem; bottom: 5.5rem; z-index: 70; display: grid; gap: .45rem; max-width: min(92vw, 420px); }
.ctb-toast { border-radius: 12px; padding: .7rem .9rem; font: 400 .95rem/1.4 "Source Sans 3", "Segoe UI", Arial, sans-serif; color: #fff; background: #151C36; box-shadow: 0 12px 26px rgba(21, 28, 54, .3); animation: fade-up .25s ease; border-left: 5px solid #8fa2d8; }
.ctb-toast.ok { border-left-color: #3ccf8e; }
.ctb-toast.erro { border-left-color: #ff4d6d; }
.ctb-toast.aviso { border-left-color: #F5A623; }
.ctb-progresso { height: 8px; border-radius: 999px; background: var(--me-line); overflow: hidden; margin: .6rem 0 .3rem; }
.ctb-progresso > span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--me-red), #ff4d6d); transition: width .2s ease; }
.ctb-carregando { color: var(--me-mute); padding: 1.4rem; text-align: center; }
.ctb-arquivo { border: 2px dashed var(--me-line); border-radius: 14px; padding: 1.1rem; text-align: center; background: var(--me-paper); color: var(--me-ink); font-size: .95rem; }
.ctb-arquivo input[type="file"] { margin-top: .5rem; background: #fff; }
.ctb-previa { max-height: 320px; overflow: auto; border: 1.5px solid var(--me-line); border-radius: 12px; }
/* texto lido do PDF: valores em dinheiro são botões (clique no campo e depois no valor) */
details.ctb-texto-lido { margin-top: .8rem; border: 1.5px solid var(--me-line, #E3E6ED); border-radius: 12px; padding: .55rem .75rem; background: #F4F6FA; }
details.ctb-texto-lido > summary { cursor: pointer; font-weight: 700; font-size: .92rem; color: #151C36; }
details.ctb-texto-lido pre.ctb-texto-pdf { white-space: pre; font-family: ui-monospace, Consolas, monospace; font-size: .72rem; line-height: 1.55; background: #fff; border: 1px solid #E3E6ED; border-radius: 8px; padding: .6rem; margin: .4rem 0 0; max-height: 300px; overflow: auto; color: #1C2130; }
pre.ctb-texto-pdf button.ctb-valor-pdf { all: unset; cursor: pointer; font: inherit; color: #151C36; background: #FFE3E9; border-radius: 4px; padding: 0 .15rem; margin: 0 -.15rem; }
pre.ctb-texto-pdf button.ctb-valor-pdf:hover, pre.ctb-texto-pdf button.ctb-valor-pdf:focus-visible { background: #FF002D; color: #fff; }
pre.ctb-texto-pdf .ctb-texto-pagina { color: #667085; }
input.ctb-campo-ativo { outline: 2px solid #FF002D; outline-offset: 1px; }
.ctb pre.ctb-memorial { white-space: pre-wrap; font-family: ui-monospace, Consolas, monospace; font-size: .8rem; background: var(--me-paper); border: 1.5px solid var(--me-line); border-radius: 12px; padding: .75rem; max-height: 340px; overflow: auto; }

/* ficha só de leitura (dados importados do Domínio no cadastro da empresa e do sócio) */
.ctb-ficha { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .55rem 1rem; padding: .75rem .9rem; border: 1px solid var(--me-line); border-radius: 12px; background: var(--me-paper); }
.ctb-ficha > div { min-width: 0; }
.ctb-ficha span { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--me-mute); }
.ctb-ficha strong { display: block; font-size: .92rem; font-weight: 600; color: var(--me-ink); overflow-wrap: anywhere; }

/* preparação de notas: quadro de rateio (um sócio por linha, cada um com o seu valor) */
.ctb-quadro { display: grid; gap: .45rem; }
.ctb-quadro-linha { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr) 9rem auto; gap: .5rem; align-items: center; }
.ctb-quadro-linha select, .ctb-quadro-linha input { margin: 0 !important; }
.ctb-quadro-n { font-size: .8rem; font-weight: 700; color: var(--me-mute); text-transform: uppercase; letter-spacing: .03em; }
@media (max-width: 640px) { .ctb-quadro-linha { grid-template-columns: 1fr 7rem auto; } .ctb-quadro-n { grid-column: 1 / -1; } }

/* espelho da NF (aba EspelhoNF da planilha de emissão) — na tela; na impressão vale o estilo do ui.imprimir */
.ctb-espelho-caixa { border: 1px solid var(--me-line); border-radius: 12px; padding: .6rem .8rem; background: #fff; }
.ctb-espelho-caixa > summary { cursor: pointer; font-weight: 700; color: var(--me-navy); }
.ctb-espelho { font-size: .9rem; color: var(--me-ink); }
.ctb-espelho h2 { font: 700 .95rem var(--me-fd); letter-spacing: .04em; text-transform: uppercase; color: var(--me-navy); margin: .9rem 0 .35rem; }
.ctb-espelho table { width: 100%; border-collapse: collapse; margin: .2rem 0 .4rem; }
.ctb-espelho th, .ctb-espelho td { border-bottom: 1px solid var(--me-line); padding: .3rem .45rem; text-align: left; vertical-align: top; }
.ctb-espelho th { width: 11rem; font-size: .78rem; color: var(--me-mute); font-weight: 700; background: var(--me-paper); }
.ctb-espelho thead th { width: auto; }
.ctb-espelho .num { text-align: right; white-space: nowrap; }
.ctb-espelho tr.total td { font-weight: 700; border-top: 2px solid var(--me-navy); }
.ctb-espelho-discr { white-space: pre-wrap; font-family: ui-monospace, Consolas, monospace; font-size: .82rem; background: var(--me-paper); border: 1px solid var(--me-line); border-radius: 8px; padding: .55rem .7rem; margin: 0; }

/* filtro de empresa DA TELA (26/10/2026): abaixo do cabeçalho da etapa; cada etapa guarda a sua (app.js, empresaPorAba) */
.ctb-empresa-tela { display: flex; gap: .6rem; align-items: flex-end; flex-wrap: wrap; margin: 0 0 12px; padding: 10px 14px; background: #fff; border: 1.5px solid var(--me-line); border-radius: 14px; }
.ctb-empresa-tela label { font: 700 12px var(--me-fd); letter-spacing: .06em; text-transform: uppercase; color: var(--me-mute); margin: 0; }
.ctb-empresa-tela .ctb-campo-empresa { width: 420px; max-width: 100%; position: relative; }
.ctb-empresa-tela input { margin-top: .25rem; width: 100%; padding: .5rem .7rem; font: 600 15px var(--me-fb); color: var(--me-ink); border: 1.5px solid var(--me-line); border-radius: 10px; text-transform: none; letter-spacing: 0; background: #fff; }
.ctb-empresa-tela input:focus { outline: none; border-color: var(--me-navy); box-shadow: 0 0 0 3px rgba(21, 28, 54, .12); }
.ctb-empresa-tela.com-empresa { border-color: var(--me-red); background: #FFF5F7; }
@media (max-width: 700px) { .ctb-empresa-tela .ctb-campo-empresa { width: 100%; } }
/* empresa cadastrada que não veio na última importação do Domínio (Cadastros › Empresas) */
.ctb tr.ctb-ausente td { background: #FFF7E6; }
/* KPI de alerta clicável: filtra a lista da tela */
.ctb-kpi.ctb-kpi-acao { cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.ctb-kpi.ctb-kpi-acao:hover, .ctb-kpi.ctb-kpi-acao:focus-visible { border-color: var(--me-red); box-shadow: 0 2px 10px rgba(0, 0, 0, .06); outline: none; }
.ctb-kpi.ctb-kpi-acao.ativo { border-color: var(--me-red); box-shadow: inset 0 0 0 1.5px var(--me-red); }