/* Escolástica - visual. Verde da identidade da escola sobre fundo "mármore"; a cor viva (menta) só marca onde você está.
   Tipografia: Newsreader (títulos e números) + Public Sans (interface). Sem Google Fonts o sistema usa Georgia e a fonte do sistema. */

:root {
  --acropole: #0F4A41;
  --acropole-escuro: #0A3530;
  --menta: #46E0BD;
  --marmore: #F4F6F5;
  --papel: #FFFFFF;
  --tinta: #14211E;
  --tinta-suave: #4A5A55;
  --linha: #D8DFDC;
  --linha-forte: #AEBBB6;
  --foco: #1C7C68;
  --ok-fundo: #E3F4EE;
  --bronze: #8A5A0B;
  --bronze-fundo: #F8EEDA;
  --rubi: #A8231B;
  --rubi-fundo: #FBEAE8;
  --serifa: "Newsreader", Georgia, "Times New Roman", serif;
  --sans: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--marmore); color: var(--tinta); font: 15px/1.5 var(--sans); font-variant-numeric: tabular-nums; }
h1, h2, h3 { font-family: var(--serifa); font-weight: 600; letter-spacing: -0.01em; margin: 0; color: var(--tinta); }
h1 { font-size: 30px; line-height: 1.15; }
h2 { font-size: 20px; line-height: 1.25; }
h3 { font-size: 16px; font-family: var(--sans); font-weight: 600; letter-spacing: 0; }
p { margin: 0; }
a { color: var(--foco); }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

/* ---------- casca: menu lateral + área principal ---------- */
.casca { display: grid; grid-template-columns: 268px minmax(0, 1fr); min-height: 100vh; }
.lateral { background: var(--acropole); color: #E6F2EF; display: flex; flex-direction: column; padding: 20px 14px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.lateral :focus-visible { outline-color: var(--menta); }
.lateral__marca { display: flex; align-items: center; gap: 12px; padding: 4px 8px 18px; color: #fff; }
.lateral__marca svg { flex: none; color: var(--menta); }
.lateral__titulo { font-family: var(--serifa); font-size: 22px; font-weight: 600; line-height: 1.1; }
.lateral__sub { font-size: 12px; color: #A9C9C1; }

.nav { display: flex; flex-direction: column; gap: 14px; }
.nav__grupo { display: flex; flex-direction: column; gap: 2px; }
.nav__titulo { font-size: 12px; color: #8FB6AC; padding: 0 10px 3px; font-weight: 500; }
.nav__item { display: flex; align-items: center; gap: 12px; padding: 6px 12px; border-radius: 6px; color: #E6F2EF; text-decoration: none; position: relative; }
.nav__item .icone { flex: none; color: #9FD0C4; }
.nav__item.active .icone { color: var(--menta); }
.nav__item:hover { background: rgba(255,255,255,.08); }
.nav__item.active { background: rgba(255,255,255,.12); color: #fff; font-weight: 600; }
.nav__item.active::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 4px; border-radius: 0 4px 4px 0; background: var(--menta); }
.nav__item--desabilitado { color: #7FA79C; cursor: default; }
.nav__item--desabilitado:hover { background: none; }

.principal { min-width: 0; display: flex; flex-direction: column; }
.topo { display: flex; align-items: center; gap: 12px; padding: 12px 32px; background: var(--papel); border-bottom: 1px solid var(--linha); position: sticky; top: 0; z-index: 5; }
.topo__data { color: var(--tinta-suave); flex: 1; }
.topo__usuario { display: flex; align-items: center; gap: 10px; }
.topo__menu { display: none; }
.conteudo { padding: 28px 32px 56px; max-width: 1280px; width: 100%; }
.casca__veu { display: none; }

.pagina-cab { display: flex; align-items: end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.pagina-cab__apoio { color: var(--tinta-suave); margin-top: 4px; }

/* ---------- botões, chips, avisos ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 6px; border: 1px solid var(--linha-forte); background: var(--papel); color: var(--tinta); font: 600 14px/1 var(--sans); cursor: pointer; text-decoration: none; }
.btn:hover:not(:disabled) { border-color: var(--acropole); }
.btn:disabled { color: #8A9A95; background: #EEF2F0; cursor: not-allowed; }
.btn--primario { background: var(--acropole); border-color: var(--acropole); color: #fff; }
.btn--primario:hover:not(:disabled) { background: var(--acropole-escuro); }
.btn--fantasma { border-color: transparent; background: transparent; }
.btn--cheio { width: 100%; }
.btn--icone { width: 40px; padding: 0; }

.chip { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; background: #E8EEEC; color: var(--tinta); white-space: nowrap; }
.chip--ok { background: var(--ok-fundo); color: #0B5A48; }
.chip--atencao { background: var(--bronze-fundo); color: var(--bronze); }

.aviso { padding: 10px 14px; border-radius: 8px; border: 1px solid var(--linha-forte); background: var(--papel); margin-bottom: 16px; }
.aviso--erro { background: var(--rubi-fundo); border-color: #E5B1AC; color: #7A1913; }
.aviso--ok { background: var(--ok-fundo); border-color: #A9D9CB; color: #0B4E3E; }
.aviso--atencao { background: var(--bronze-fundo); border-color: #E4CB9C; color: #6F4708; }

/* ---------- painéis e abas ---------- */
.painel { background: var(--papel); border: 1px solid var(--linha); border-radius: 12px; padding: 20px 22px; min-width: 0; }
.painel__cab { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.painel__apoio { color: var(--tinta-suave); margin: 4px 0 16px; }
.dividido { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: 20px; align-items: start; }

.abas { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--linha-forte); margin-bottom: 22px; }
.aba { padding: 10px 14px; text-decoration: none; color: var(--tinta-suave); border-bottom: 3px solid transparent; margin-bottom: -1px; font-weight: 500; }
.aba:hover { color: var(--tinta); }
.aba--ativa { color: var(--tinta); font-weight: 600; border-bottom-color: var(--acropole); }

/* ---------- trilha do membro (Visão geral) ---------- */
.trilha { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: relative; }
.trilha::before { content: ""; position: absolute; left: 10%; right: 10%; top: 27px; height: 2px; background: var(--linha-forte); }
.etapa { position: relative; }
.etapa__botao { display: grid; justify-items: center; gap: 6px; width: 100%; padding: 14px 6px 12px; background: transparent; border: 0; border-radius: 10px; cursor: pointer; font: inherit; color: inherit; }
.etapa__botao:hover { background: var(--marmore); }
.etapa--ativa .etapa__botao { background: var(--ok-fundo); }
.etapa__no { width: 18px; height: 18px; border-radius: 50%; background: var(--papel); border: 3px solid var(--acropole); position: relative; z-index: 1; }
.etapa--ativa .etapa__no { background: var(--menta); }
.etapa__nome { font-weight: 500; text-align: center; min-height: 2.8em; display: flex; align-items: center; }
.etapa__qtde { font-family: var(--serifa); font-size: 38px; font-weight: 600; line-height: 1; }
.etapa__barra { display: flex; align-items: flex-end; width: 26px; height: 72px; margin-top: 4px; }
.etapa__barra > span { display: block; width: 100%; background: var(--acropole); border-radius: 4px 4px 0 0; min-height: 3px; }
.trilha__nota { margin-top: 14px; color: var(--tinta-suave); font-size: 14px; }
.trilha--auto { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
.trilha--auto::before { left: 8%; right: 8%; }

/* ---------- listas de nomes e tabelas ---------- */
.lista { list-style: none; margin: 0; padding: 0; max-height: 540px; overflow-y: auto; border-top: 1px solid var(--linha); }
.lista__item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 4px; border-bottom: 1px solid var(--linha); }
.lista__item a { color: var(--tinta); text-decoration: none; }
.lista__item a:hover { text-decoration: underline; color: var(--foco); }
.lista__detalhe { color: var(--tinta-suave); font-size: 13px; white-space: nowrap; }

.tabela-rolagem { overflow-x: auto; }
.grade { width: 100%; border-collapse: collapse; }
.grade th { text-align: left; font-size: 13px; font-weight: 600; color: var(--tinta-suave); padding: 8px 10px; border-bottom: 1px solid var(--linha-forte); white-space: nowrap; }
.grade td { padding: 9px 10px; border-bottom: 1px solid var(--linha); }
.grade tbody tr:hover { background: #F8FAF9; }
.grade .num { text-align: right; }
.grade tfoot td { font-weight: 600; border-bottom: 0; border-top: 1px solid var(--linha-forte); }
.grade__linha--ativa { background: var(--ok-fundo); }
.btn-ver { height: 32px; padding: 0 12px; font-size: 13px; }

.vazio { color: var(--tinta-suave); padding: 24px 8px; text-align: center; }
.vazio--pagina { max-width: 460px; margin: 18vh auto 0; display: grid; gap: 14px; justify-items: center; }
.carregando { color: var(--tinta-suave); padding: 16px 4px; }

/* ---------- formulários ---------- */
.form-grade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px 16px; }
.col-2 { grid-column: span 2; } .col-3 { grid-column: span 3; } .col-4 { grid-column: span 4; } .col-5 { grid-column: span 5; }
.col-6 { grid-column: span 6; } .col-8 { grid-column: span 8; } .col-12 { grid-column: span 12; }
.campo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.campo__rotulo { font-size: 13px; font-weight: 500; color: var(--tinta-suave); }
.campo__ajuda { font-size: 12px; color: var(--tinta-suave); }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], select, textarea {
  width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--linha-forte); border-radius: 6px; background: var(--papel); color: var(--tinta); font: inherit; }
textarea { height: auto; min-height: 120px; padding: 10px 12px; resize: vertical; }
input:disabled, select:disabled, textarea:disabled { background: #EEF2F0; color: #55655F; }
input:hover:not(:disabled), select:hover:not(:disabled), textarea:hover:not(:disabled) { border-color: var(--acropole); }
.marcar { display: flex; align-items: center; gap: 10px; height: 40px; }
.marcar input { width: 18px; height: 18px; accent-color: var(--acropole); }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.secao { margin-top: 26px; }
.secao > h2 { margin-bottom: 14px; font-size: 18px; }
.barra-acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* ---------- Cadastro de membros: seletor + formulário ---------- */
.membros { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.membros--sem-lista { grid-template-columns: minmax(0, 1fr); }
.seletor { position: sticky; top: 72px; display: grid; gap: 12px; }
.seletor .lista { max-height: calc(100vh - 320px); }
.seletor__item { width: 100%; text-align: left; background: transparent; border: 0; padding: 9px 6px; cursor: pointer; font: inherit; color: var(--tinta); border-radius: 6px; display: flex; justify-content: space-between; gap: 8px; }
.seletor__item:hover { background: var(--marmore); }
.seletor__item[aria-current=true] { background: var(--ok-fundo); font-weight: 600; }

/* ---------- entrada (login) ---------- */
.entrada-pagina { background: var(--acropole); min-height: 100vh; display: grid; place-items: center; padding: 20px; }
.entrada { display: grid; grid-template-columns: 1fr 1fr; width: min(900px, 100%); background: var(--papel); border-radius: 14px; overflow: hidden; }
.entrada__marca { background: var(--acropole-escuro); color: #fff; padding: 48px 40px; display: flex; flex-direction: column; justify-content: end; gap: 10px; min-height: 360px; }
.entrada__marca svg { color: var(--menta); margin-bottom: 8px; }
.entrada__nome { font-family: var(--serifa); font-size: 34px; font-weight: 600; line-height: 1.05; }
.entrada__apoio { color: #A9C9C1; max-width: 26ch; }
.entrada__form { padding: 48px 40px; display: grid; gap: 16px; align-content: center; }
.entrada-pagina .vazio--pagina { background: var(--papel); border-radius: 14px; padding: 40px; margin: 0; }

#blazor-error-ui { display: none; position: fixed; inset: auto 16px 16px 16px; z-index: 50; background: var(--rubi-fundo); border: 1px solid #E5B1AC; color: #7A1913; padding: 12px 16px; border-radius: 8px; }
#blazor-error-ui .reload, #blazor-error-ui .dismiss { margin-left: 12px; cursor: pointer; }

/* ---------- telas pequenas ---------- */
@media (max-width: 1000px) {
  .dividido, .membros { grid-template-columns: minmax(0, 1fr); }
  .seletor { position: static; }
  .seletor .lista { max-height: 260px; }
}
@media (max-width: 900px) {
  .casca { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: fixed; z-index: 30; inset: 0 auto 0 0; width: 280px; transform: translateX(-100%); transition: transform .18s ease; }
  .casca--menu-aberto .lateral { transform: none; }
  .casca--menu-aberto .casca__veu { display: block; position: fixed; inset: 0; z-index: 20; background: rgba(10,30,26,.5); border: 0; }
  .topo { padding: 10px 16px; }
  .topo__menu { display: inline-flex; }
  .conteudo { padding: 20px 16px 48px; }
  .col-2, .col-3, .col-4, .col-5, .col-6, .col-8 { grid-column: span 12; }
  .entrada { grid-template-columns: 1fr; }
  .entrada__marca { min-height: 0; padding: 28px; }
}
@media (max-width: 700px) {
  .trilha { grid-template-columns: minmax(0, 1fr); }
  .trilha::before { display: none; }
  .etapa__botao { grid-template-columns: 24px 1fr auto; justify-items: start; align-items: center; padding: 10px; }
  .etapa__nome { min-height: 0; }
  .etapa__qtde { font-size: 28px; }
  .etapa__barra { display: none; }
  .topo__data { display: none; }
}

.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

input[readonly] { background: #EEF2F0; color: #55655F; }
.aviso-lista { display: grid; gap: 8px; margin-bottom: 16px; }
.aviso-lista .aviso { margin: 0; }
.tabela-linha-acoes { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---------- turmas e chamadas ---------- */
.bloco-acao { border-top: 1px solid var(--linha); padding-top: 18px; margin-top: 18px; display: grid; gap: 12px; }
.bloco-acao h3 { margin: 0; }
.linha-form { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; }
.linha-form .campo { min-width: 180px; }
.grade input[type=number].nota { width: 72px; height: 34px; padding: 0 8px; }
.freq { display: flex; align-items: center; gap: 10px; min-width: 150px; }
.freq__valor { min-width: 58px; }
.freq__barra { flex: 1; height: 6px; border-radius: 3px; background: #E8EEEC; }
.freq__barra > span { display: block; height: 6px; border-radius: 3px; background: var(--acropole); }
.escolha-lista { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linha); max-height: 260px; overflow-y: auto; }
.escolha-lista li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 4px; border-bottom: 1px solid var(--linha); }
.chamada-grade { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 880px; }
.chamada-grade th, .chamada-grade td { padding: 9px 10px; border-bottom: 1px solid var(--linha); }
.chamada-grade thead th { font-size: 13px; font-weight: 600; color: var(--tinta-suave); border-bottom: 1px solid var(--linha-forte); white-space: nowrap; text-align: center; }
.chamada-grade th.chamada__nome, .chamada-grade td.chamada__nome { text-align: left; position: sticky; left: 0; background: var(--papel); font-weight: 500; white-space: nowrap; }
.chamada-grade td.chamada__celula { text-align: center; }
.chamada-grade .chamada__nova { background: var(--ok-fundo); }
.chamada-grade thead th.chamada__nova { border-bottom: 3px solid var(--menta); color: var(--tinta); }
.chamada-grade input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--acropole); }
.chamada-grade .chamada__nova input[type=checkbox] { width: 20px; height: 20px; }

/* ---------- janela (modal) ---------- */
.janela__fundo { position: fixed; inset: 0; z-index: 60; background: rgba(10, 30, 26, .55); display: grid; place-items: center; padding: 20px; }
.janela { background: var(--papel); border-radius: 12px; width: min(940px, 100%); max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.janela__cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px; border-bottom: 1px solid var(--linha); }
.janela__corpo { padding: 18px 22px; overflow: auto; }
.janela__rodape { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 22px; border-top: 1px solid var(--linha); }

/* ---------- grade do Acompanhamento: colunas Membro e Ativo fixas, o resto rola ---------- */
.acomp-rolagem { overflow: auto; max-height: calc(100vh - 340px); min-height: 320px; border: 1px solid var(--linha); border-radius: 10px; background: var(--papel); }
.acomp { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; }
.acomp th, .acomp td { padding: 6px 10px; border-bottom: 1px solid var(--linha); white-space: nowrap; background: var(--papel); text-align: left; vertical-align: middle; }
.acomp thead th { position: sticky; z-index: 3; font-size: 13px; font-weight: 600; color: var(--tinta-suave); }
.acomp__titulos th { top: 0; height: 38px; background: #EEF3F1; }
.acomp__filtros th { top: 38px; background: #F6F8F7; padding: 4px 6px; font-weight: 400; }
.acomp__filtros input, .acomp__filtros select, .acomp td input[type=text], .acomp td input[type=date], .acomp td select { height: 32px; padding: 0 8px; font-size: 14px; width: 100%; min-width: 0; }
.acomp__fixa { position: sticky; z-index: 2; }
.acomp thead .acomp__fixa { z-index: 4; }
.acomp__nome { left: 0; width: 250px; min-width: 250px; max-width: 250px; overflow: hidden; text-overflow: ellipsis; }
.acomp__ativo { left: 250px; width: 72px; min-width: 72px; text-align: center !important; box-shadow: 2px 0 0 var(--linha); }
.acomp tbody tr:nth-child(even) td { background: #F8FAF9; }
.acomp tbody tr:hover td { background: var(--ok-fundo); }
.acomp input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--acropole); cursor: pointer; }
.acomp input[type=checkbox]:disabled { cursor: not-allowed; }
.acomp .num { text-align: right; font-variant-numeric: tabular-nums; }
.acomp .c-cpf { min-width: 150px; } .acomp .c-data { min-width: 150px; } .acomp .c-tel { min-width: 160px; }
.acomp .c-lista { min-width: 190px; } .acomp .c-integ { min-width: 220px; } .acomp .c-areas { min-width: 220px; }
.acomp .c-curto { min-width: 90px; }
.acomp__integ { display: flex; gap: 6px; align-items: center; }
.link-celula { background: none; border: 0; padding: 0; font: inherit; color: var(--foco); text-decoration: underline; cursor: pointer; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; text-align: left; }
.vazio-celula { color: var(--tinta-suave); }
.acomp-barra { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.janela textarea { min-height: 260px; }

/* ---------- editor de texto formatado (Acompanhamento) ---------- */
.editor { border: 1px solid var(--linha-forte); border-radius: 10px; background: var(--papel); overflow: hidden; }
.editor__barra { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px; border-bottom: 1px solid var(--linha); background: #F6F8F7; }
.editor__btn { min-width: 34px; height: 34px; padding: 0 9px; border: 1px solid transparent; border-radius: 6px; background: transparent; font: inherit; font-size: 14px; color: var(--tinta); cursor: pointer; }
.editor__btn:hover { background: var(--ok-fundo); border-color: var(--linha-forte); }
.editor__sep { width: 1px; height: 22px; background: var(--linha-forte); margin: 0 4px; }
.editor__area { min-height: 280px; max-height: 55vh; overflow: auto; padding: 14px 18px; outline: none; line-height: 1.55; }
.editor__area:focus { box-shadow: inset 0 0 0 2px var(--foco); }
.editor__area--leitura { background: #F8FAF9; }
.editor__area p { margin: 0 0 .6em; }
.editor__area ul, .editor__area ol { margin: .3em 0 .6em 1.4em; padding: 0; }
.editor__area h3 { font-size: 1.1em; margin: .7em 0 .3em; font-family: var(--serifa); }
.editor__area blockquote { margin: .5em 0; padding-left: 12px; border-left: 3px solid var(--linha-forte); color: var(--tinta-suave); }

/* ---------- multi-escola: filial no topo ---------- */
.topo__filial { height: 36px; min-width: 190px; max-width: 280px; padding: 0 10px; border: 1px solid var(--linha-forte); border-radius: 8px; background: var(--papel); font: inherit; font-weight: 600; color: var(--acropole); }
.chip--filial { background: var(--ok-fundo); font-weight: 600; }

/* ---------- logos ---------- */
.lateral__logo { flex: none; width: 46px; height: 46px; }
.lateral__cartao { background: #fff; border-radius: 14px; padding: 12px 14px; margin: 0 2px 16px; display: grid; place-items: center; }
.lateral__logo-cartao { width: 100%; max-width: 176px; height: auto; display: block; }
.entrada__logo { width: 120px; height: 120px; margin-bottom: 10px; }
.vazio__logo { display: block; width: min(300px, 80%); height: auto; margin: 0 auto 18px; }

/* ---------- foto dos membros ---------- */
.avatar { width: var(--av, 32px); height: var(--av, 32px); border-radius: 50%; object-fit: cover; flex: none; background: var(--ok-fundo); }
.avatar--inicial { display: inline-grid; place-items: center; color: var(--acropole); font-weight: 600; font-size: calc(var(--av, 32px) * .38); letter-spacing: .02em; user-select: none; }
.com-avatar { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.seletor__item { display: flex; align-items: center; gap: 10px; }
.seletor__nome { flex: 1; min-width: 0; text-align: left; }
.chamada__nome .com-avatar { font-weight: inherit; }
.foto-editor { display: flex; align-items: center; gap: 18px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--linha); flex-wrap: wrap; }
.foto-editor__acoes { display: grid; gap: 6px; max-width: 460px; }

/* ---------- lista em sanfona (Turmas e Lista de chamadas) ---------- */
.tl { display: grid; gap: 18px; }
.tl__cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; padding-bottom: 14px; border-bottom: 1px solid var(--linha); }
.tl__titulo { display: flex; align-items: center; gap: 16px; }
.tl__icone { color: var(--acropole); display: inline-flex; }
.tl__titulo h1 { margin: 0; }
.tl__apoio { margin: 4px 0 0; color: var(--texto-suave, #566B65); max-width: 52ch; }
.tl__filtros { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.tl__filtros select { height: 40px; }
.tl__busca { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border: 1px solid var(--linha-forte); border-radius: 8px; background: var(--papel); color: var(--acropole); }
.tl__busca input { border: 0; outline: 0; background: transparent; min-width: 200px; height: 100%; padding: 0; }
.btn--escuro { background: #2B2B2B; color: #fff; border-color: #2B2B2B; }
.btn--escuro:hover { background: #111; }
.sanfona th { white-space: nowrap; }
.sanfona .num { text-align: right; }
.sanfona__seta { width: 40px; padding-right: 0; }
.sanfona__botao { display: inline-grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 6px; background: transparent; color: inherit; cursor: pointer; transition: transform .15s ease; }
.sanfona__botao:hover { background: rgba(0,0,0,.06); }
.sanfona__botao[aria-expanded="true"] { transform: rotate(180deg); }
.sanfona__titulo { border: 0; background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; padding: 0; }
.sanfona__titulo:hover { text-decoration: underline; }
.sanfona__linha--aberta td { background: rgba(15,74,65,.04); }
.sanfona__detalhe td { background: rgba(15,74,65,.04); padding-top: 4px; padding-bottom: 16px; }
.sanfona__dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px 24px; margin: 0; }
.sanfona__dl dt { font-size: 12px; color: #566B65; }
.sanfona__dl dd { margin: 2px 0 0; font-weight: 500; }
.sanfona__col-acoes { text-align: right; white-space: nowrap; }
.sanfona__col-acoes .tabela-linha-acoes { justify-content: flex-end; }
.tl__paginas { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; color: #566B65; }
.menu-suspenso { position: relative; display: inline-block; }
.menu-suspenso > summary { list-style: none; cursor: pointer; display: inline-grid; place-items: center; min-width: 38px; }
.menu-suspenso > summary::-webkit-details-marker { display: none; }
.menu-suspenso__itens { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 220px; background: var(--papel); border: 1px solid var(--linha-forte); border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.14); padding: 6px; display: grid; text-align: left; }
.menu-suspenso__item { display: block; padding: 8px 10px; border-radius: 6px; color: inherit; text-decoration: none; background: transparent; border: 0; font: inherit; text-align: left; cursor: pointer; }
.menu-suspenso__item:hover { background: rgba(15,74,65,.08); }

/* ---------- relatório mensal ---------- */
.rm__abas { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.rm__abas-lista { display: flex; gap: 6px; flex: 1; overflow-x: auto; padding: 2px; }
.rm__aba { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; min-width: 96px; padding: 8px 12px; border: 1px solid var(--linha-forte); border-radius: 10px; background: var(--papel); cursor: pointer; font: inherit; font-weight: 600; color: inherit; }
.rm__aba:hover { background: rgba(15,74,65,.06); }
.rm__aba--ativa { background: var(--acropole); color: #fff; border-color: var(--acropole); }
.rm__aba--ativa .chip { background: rgba(255,255,255,.2); color: #fff; }
.rm__estado { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
/* duas colunas só quando cada cartão tem ao menos 520 px; senão uma por linha (nunca rolar para os lados) */
.rm__grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); gap: 20px; align-items: start; }
.rm__grade > .painel { min-width: 0; }
/* A regra geral das grades não deixa o cabeçalho quebrar linha; aqui o rótulo de cada item PRECISA quebrar. */
.rm__tabela { table-layout: fixed; }
.rm__tabela th.rm__item { white-space: normal; overflow-wrap: anywhere; font-size: 14.5px; font-weight: 500; color: var(--tinta); }
.rm__tabela th.rm__valor, .rm__tabela td.rm__valor { width: 112px; text-align: right; }
.rm__origem { display: block; font-size: 12px; color: #6B7F79; font-weight: 400; margin-top: 2px; }
.rm__tag { display: block; font-size: 11px; color: #6B7F79; }
.rm__entrada { width: 84px; height: 36px; text-align: right; padding: 0 8px; border: 1px solid var(--linha-forte); border-radius: 6px; font: inherit; }   /* até 5 dígitos */
.rm__entrada--sujo { border-color: var(--acropole); background: rgba(15,74,65,.07); }
.rm__tabela input.rm__entrada { width: 84px; max-width: 84px; }   /* mesma largura em qualquer tela */
/* telas estreitas: o item em cima e o valor embaixo, em largura total */
@media (max-width: 640px) {
  .rm__tabela, .rm__tabela tbody, .rm__tabela tr, .rm__tabela th.rm__item, .rm__tabela td.rm__valor { display: block; width: auto; }
  .rm__tabela thead { display: none; }
  .rm__tabela tr { padding: 8px 0; border-bottom: 1px solid var(--linha); }
  .rm__tabela th.rm__item, .rm__tabela td.rm__valor { border: 0; padding: 2px 4px; }
  .rm__tabela td.rm__valor { text-align: left; }
  .rm__tag { display: inline; margin-left: 8px; }
  .rm__aba { min-width: 78px; padding: 6px 8px; }
  .rm__estado { align-items: flex-start; }
}

/* ---------- áreas do sistema ---------- */
.areas__grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 18px; }
.areas__cartao { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 22px; border: 1px solid var(--linha-forte); border-radius: 14px; background: var(--papel); color: inherit; text-decoration: none; transition: box-shadow .15s ease, transform .15s ease; }
.areas__cartao:hover, .areas__cartao:focus-visible { box-shadow: 0 8px 24px rgba(15,74,65,.16); transform: translateY(-2px); }
.areas__cartao--breve { opacity: .8; }
.areas__icone { display: inline-flex; color: var(--acropole); }
.areas__nome { font-family: "Newsreader", Georgia, serif; font-size: 22px; font-weight: 600; }
.areas__descricao { color: #566B65; font-size: 14px; }
.usuarios__areas { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.marcar--pequeno { font-size: 13px; }

/* ---------- cadastro de membros: cabeçalho e abas ---------- */
.membro-cab__nome { margin: 0 0 6px; font-size: 26px; }
.membro-cab__chips { margin: 0 0 12px; display: flex; gap: 6px; flex-wrap: wrap; }
.abas { display: flex; gap: 2px; border-bottom: 1px solid var(--linha-forte); margin: 4px 0 22px; overflow-x: auto; }
.abas__aba { padding: 10px 16px; border: 0; border-bottom: 3px solid transparent; background: transparent; font: inherit; font-weight: 600; color: #566B65; cursor: pointer; white-space: nowrap; }
.abas__aba:hover { color: var(--acropole); background: rgba(15,74,65,.05); }
.abas__aba--ativa { color: var(--acropole); border-bottom-color: var(--acropole); }
.aba--oculta { display: none; }

/* ---------- cópia das tabelas de apoio entre filiais ---------- */
.copia__grupo { border: 1px solid var(--linha); border-radius: 10px; margin: 12px 0 0; padding: 6px 12px 10px; min-width: 0; }
.copia__grupo legend { font-weight: 600; padding: 0 6px; color: var(--acropole); }
.copia__linha { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 7px 4px; border-bottom: 1px solid var(--linha); cursor: pointer; }
.copia__linha:last-child { border-bottom: 0; }
.copia__linha input { margin-right: 2px; }
.copia__nome { font-weight: 500; min-width: 180px; }
.copia__qtd { color: #566B65; font-size: 13px; }
.copia__aviso { color: #8A4B00; font-size: 13px; }
.copia__dica { color: #6B7F79; font-size: 13px; }
.copia__linha--bloqueada { cursor: default; opacity: .75; }

/* ---------- Biblioteca: escolha de membro e gráficos ---------- */
.escolha-membro input[type=search] { width: 100%; }
.escolha-membro__lista { list-style: none; margin: 8px 0 0; padding: 0; max-height: 260px; overflow-y: auto; border: 1px solid var(--linha); border-radius: 10px; }
.escolha-membro__item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 10px; border: 0; border-bottom: 1px solid var(--linha); background: transparent; font: inherit; text-align: left; cursor: pointer; }
.escolha-membro__lista li:last-child .escolha-membro__item { border-bottom: 0; }
.escolha-membro__item:hover { background: rgba(15,74,65,.06); }
.escolha-membro__item--ativo { background: var(--ok-fundo); font-weight: 600; }
.barras { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.barras__linha { display: grid; grid-template-columns: minmax(90px, 36%) 1fr 36px; gap: 10px; align-items: center; font-size: 14px; }
.barras__rotulo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barras__trilho { background: #E8EEEC; border-radius: 6px; height: 14px; overflow: hidden; }
.barras__preenche { display: block; height: 100%; background: var(--acropole); border-radius: 6px; }
.barras__valor { text-align: right; font-weight: 600; }
.colunas { display: flex; align-items: flex-end; gap: 6px; height: 190px; margin-top: 8px; }
.colunas__item { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.colunas__barra { display: block; width: 100%; max-width: 34px; min-height: 2px; background: var(--acropole); border-radius: 5px 5px 0 0; }
.colunas__valor { font-size: 12px; font-weight: 600; margin-bottom: 2px; }
.colunas__rotulo { font-size: 11px; color: #566B65; margin-top: 4px; white-space: nowrap; }
@media (max-width: 640px) { .colunas__rotulo { font-size: 9px; } }

/* ---------- Biblioteca: painel e listas ---------- */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; margin-bottom: 20px; }
.kpi { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; border: 1px solid var(--linha-forte); border-radius: 14px; background: var(--papel); color: inherit; text-decoration: none; }
.kpi:hover { box-shadow: 0 6px 18px rgba(15,74,65,.14); }
.kpi__valor { font-family: "Newsreader", Georgia, serif; font-size: 34px; font-weight: 600; color: var(--acropole); }
.kpi__rotulo { color: #566B65; font-size: 14px; }
.kpi--atencao .kpi__valor { color: #A3470A; }
.acervo__sub { color: #6B7F79; font-size: 13px; margin-top: 2px; }
.acervo__filtros2 { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; align-items: center; }
.acervo__filtros2 select, .acervo__filtros2 input { height: 38px; max-width: 220px; }
.campo__junto { display: flex; gap: 6px; }
.campo__junto input { flex: 1; min-width: 0; }
.campo__valor { display: block; min-height: 36px; padding-top: 8px; color: #1A2B27; }

/* ---------- Biblioteca: totais com ícone e pizza em 3D ---------- */
.kpi { flex-direction: row; align-items: center; gap: 16px; }
.kpi__icone { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; }
.kpi__icone--verde { background: #E3F1EA; color: #1E6B4E; }
.kpi__icone--azul { background: #E3EDFB; color: #1A5FD0; }
.kpi__icone--vermelho { background: #FCE6E4; color: #C0392B; }
.kpi__icone--teal { background: #DDF3F1; color: #00838F; }
.kpi__texto { display: flex; flex-direction: column; gap: 2px; }
.kpi__valor { font-family: "Inter", system-ui, sans-serif; font-size: 30px; font-weight: 700; line-height: 1.1; color: #1A2B27; }
.pizza { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(200px, 1fr); gap: 16px; align-items: center; }
.pizza__svg { width: 100%; height: auto; max-height: 260px; }
.pizza__legenda { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 14px; }
.pizza__legenda li { display: grid; grid-template-columns: 14px 1fr auto; gap: 10px; align-items: center; }
.pizza__cor { width: 14px; height: 14px; border-radius: 4px; }
.pizza__nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pizza__valor { color: #566B65; white-space: nowrap; }
@media (max-width: 720px) { .pizza { grid-template-columns: 1fr; } }

.campo__maiuscula { text-transform: uppercase; }
.campo__tombo { text-align: center; font-weight: 700; letter-spacing: .5px; }

/* ---------- Ficha do membro: documentos ---------- */
.doc { display: flex; gap: 18px; padding: 14px 0; border-bottom: 1px solid var(--linha); align-items: flex-start; flex-wrap: wrap; }
.doc__imagem { flex: none; width: 150px; height: 100px; border: 1px solid var(--linha); border-radius: 8px; background: #E8EEEC; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.doc__imagem img { width: 100%; height: 100%; object-fit: cover; display: block; }
.doc__vazio { color: #6B7F79; font-size: 13px; }
.doc__campos { flex: 1; min-width: 280px; }

/* ---------- Gestão geral: E-mails ---------- */
.dl-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px 22px; margin: 10px 0; }
.dl-grade dt { font-size: 12px; color: #566B65; text-transform: uppercase; letter-spacing: .04em; }
.dl-grade dd { margin: 2px 0 0; word-break: break-word; }
.tentativa--erro { border-left: 4px solid #B3412F !important; }
.tentativa--ok { border-left: 4px solid #0F4A41 !important; }

/* ---------- Filtro de pesquisa com digitação (campo com lista de sugestões) ---------- */
.combo { position: relative; display: inline-flex; flex-direction: column; min-width: 0; }
.combo__campo { width: 100%; height: 40px; padding: 0 34px 0 12px; border: 1px solid var(--linha-forte); border-radius: 6px; background-color: var(--papel); color: var(--tinta); font: inherit;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2355655F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center; -webkit-appearance: none; appearance: none; }
.combo__campo:hover:not(:disabled) { border-color: var(--acropole); }
.combo__campo::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.combo__campo::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; right: 0; width: 30px; height: 100%; cursor: pointer; }
.combo__campo:disabled { background-color: #EEF2F0; color: #55655F; }
.combo__aviso { position: absolute; top: 100%; left: 0; z-index: 8; margin-top: 3px; max-width: 280px; padding: 6px 10px; border-radius: 6px; background: #FFF1DA; color: #7A4A00; border: 1px solid #C98A1B; font-size: 13px; line-height: 1.3; box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.tl__filtros .combo__campo { height: 40px; min-width: 180px; }
.acervo__filtros2 .combo__campo { height: 38px; max-width: 220px; }
.acomp__filtros .combo { display: block; width: 100%; }
.acomp__filtros .combo__campo { height: 32px; padding: 0 26px 0 8px; font-size: 14px; background-position: right 7px center; }
.acomp__filtros .combo__aviso { max-width: 220px; font-size: 12px; }

/* ---------- Lista inicial do cadastro de membros (foto, nome, CPF, status e Editar) ---------- */
.mlista { list-style: none; margin: 0; padding: 0; border: 1px solid var(--linha); border-radius: 12px; overflow: hidden; background: var(--papel); }
.mlista__cab, .mlista__linha { display: grid; grid-template-columns: 88px minmax(0, 1.7fr) 170px minmax(0, 1.2fr) 112px; gap: 12px; align-items: center; padding: 8px 16px; }   /* a última coluna tem largura FIXA: o cabeçalho e as linhas alinham */
.mlista__cab { background: #F6F8F7; border-bottom: 1px solid var(--linha-forte); font-size: 13px; font-weight: 600; color: var(--tinta-suave); text-transform: uppercase; letter-spacing: .04em; }
.mlista__linha { min-height: 84px; border-bottom: 1px solid var(--linha); }
.mlista__linha:last-child { border-bottom: 0; }
.mlista__linha--faixa { background: #F7F8F7; }
.mlista__linha:hover { background: var(--ok-fundo, #E6F2EE); }
.mlista__foto { display: flex; justify-content: center; }
.mlista__nome { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.mlista__abrir { background: transparent; border: 0; padding: 0; font: inherit; font-size: 19px; color: var(--tinta); text-align: left; cursor: pointer; overflow-wrap: break-word; word-break: normal; }
.mlista__abrir:hover { text-decoration: underline; color: var(--acropole); }
.mlista__cpf, .mlista__status { font-size: 18px; color: var(--tinta); font-variant-numeric: tabular-nums; }
.mlista__rotulo { display: none; }
.mlista__acao { display: flex; justify-content: flex-end; }
.tl__filtros #ml-pp { width: auto; min-width: 140px; }
@media (max-width: 820px) {
  .mlista__cab { display: none; }
  .mlista__linha { grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "foto nome acao" "foto cpf cpf" "foto status status"; column-gap: 12px; row-gap: 2px; padding: 12px; align-items: center; }
  .mlista__foto { grid-area: foto; align-self: start; padding-top: 2px; } .mlista__nome { grid-area: nome; } .mlista__cpf { grid-area: cpf; } .mlista__status { grid-area: status; } .mlista__acao { grid-area: acao; align-self: start; }
  .mlista__abrir { font-size: 17px; }
  .mlista__cpf, .mlista__status { font-size: 15px; color: #566B65; }
  .mlista__rotulo { display: inline; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; margin-right: 6px; }
}
}

/* Busca de dados do livro: escolha dos campos e sugestões de sinopse */
.escolha-campos th[scope=row] { white-space: nowrap; vertical-align: top; }
.escolha-campos__atual { color: var(--tinta-suave, #566B65); max-width: 220px; vertical-align: top; }
.escolha-campos__opcoes { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 2px; }
.escolha-campos__opcoes .marcar { height: auto; align-items: flex-start; padding: 3px 0; gap: 8px; }
.escolha-campos__opcoes .marcar input { flex: 0 0 auto; margin-top: 2px; }
.campo__rotulo-acao { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.btn--pequeno { padding: 4px 10px; min-height: 0; height: auto; font-size: 14px; }
.sinopse-sugerida { border: 1px solid var(--linha); border-radius: 8px; padding: 12px 14px; margin-bottom: 12px; }
.sinopse-sugerida__fonte { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--acropole); }
.sinopse-sugerida p { margin: 6px 0 10px; white-space: pre-line; }
.passos { margin: 8px 0 12px; padding-left: 22px; display: grid; gap: 8px; line-height: 1.5; }

/* ===================== Café & Convivência ===================== */
.cafe-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin: 0 0 18px; }
.cafe-kpi { background: var(--papel); border: 1px solid var(--linha); border-radius: 10px; padding: 12px 14px; display: grid; gap: 2px; }
.cafe-kpi span { font-size: 12px; color: var(--tinta-suave); text-transform: uppercase; letter-spacing: .04em; }
.cafe-kpi strong { font-family: var(--serifa); font-size: 24px; line-height: 1.2; }
.cafe-kpi small { color: var(--tinta-suave); font-size: 12px; }
.cafe-kpi--atencao { border-color: #E4CB9C; background: var(--bronze-fundo); }
.cafe-kpi--ok { border-color: #A9D9CB; background: var(--ok-fundo); }
.painel--destaque { border: 2px solid #E4CB9C; }
.cafe-comandas { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; }
.cafe-comanda { display: grid; gap: 2px; padding: 12px 14px; border: 1px solid var(--linha); border-radius: 10px; background: var(--papel); color: var(--tinta); text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.cafe-comanda:hover { border-color: var(--acropole); box-shadow: 0 3px 10px rgba(15,74,65,.12); }
.cafe-comanda__num { font-size: 12px; color: var(--tinta-suave); }
.cafe-comanda__nome { font-size: 16px; }
.cafe-comanda__info { font-size: 13px; color: var(--tinta-suave); }
.cafe-comanda__total { font-family: var(--serifa); font-size: 22px; color: var(--acropole); margin-top: 4px; }
.cafe-lancamento { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr); gap: 20px; align-items: start; }
.cafe-lancamento--so-comanda { grid-template-columns: minmax(0, 720px); }
.cafe-grupos { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.cafe-grupos__aba { border: 1px solid var(--linha-forte); background: var(--papel); border-radius: 999px; padding: 6px 14px; font: inherit; font-weight: 600; color: var(--tinta-suave); cursor: pointer; }
.cafe-grupos__aba--ativa { background: var(--acropole); border-color: var(--acropole); color: #fff; }
.cafe-itens { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.cafe-item { display: grid; gap: 4px; text-align: left; padding: 14px; min-height: 84px; border: 1px solid var(--linha); border-radius: 10px; background: var(--marmore); font: inherit; color: var(--tinta); cursor: pointer; transition: background .12s, border-color .12s, transform .06s; }
.cafe-item:hover:not(:disabled) { border-color: var(--acropole); background: var(--ok-fundo); }
.cafe-item:active:not(:disabled) { transform: scale(.97); }
.cafe-item__nome { font-weight: 600; line-height: 1.25; }
.cafe-item__preco { color: var(--acropole); font-weight: 600; align-self: end; }
.cafe-conta { position: sticky; top: 72px; }
.cafe-conta__lista { list-style: none; margin: 0; padding: 0; }
.cafe-conta__linha { display: grid; grid-template-columns: minmax(0, 1fr) auto 90px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--linha); }
.cafe-conta__desc { display: grid; min-width: 0; }
.cafe-conta__qtd { display: flex; align-items: center; gap: 6px; }
.cafe-conta__qtd span { min-width: 22px; text-align: center; font-weight: 600; }
.cafe-conta__sub { text-align: right; font-weight: 600; }
.cafe-conta__total { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 0 4px; font-size: 16px; }
.cafe-conta__total strong { font-family: var(--serifa); font-size: 28px; color: var(--acropole); }
.cafe-conta__acoes { margin-top: 12px; flex-wrap: wrap; }
.cafe-formas { display: flex; gap: 10px; }
.cafe-forma { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 14px; border: 2px solid var(--linha); border-radius: 10px; font-weight: 600; cursor: pointer; }
.cafe-forma input { width: 18px; height: 18px; accent-color: var(--acropole); }
.cafe-forma--ativa { border-color: var(--acropole); background: var(--ok-fundo); }
.cafe-troco { display: block; font-family: var(--serifa); font-size: 26px; color: var(--acropole); padding-top: 4px; }
.cafe-pix { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: start; margin-top: 14px; }
.cafe-pix__qr { background: #fff; padding: 8px; border: 1px solid var(--linha); border-radius: 10px; line-height: 0; }
.cafe-pix__texto textarea { width: 100%; font: 12px ui-monospace, monospace; margin: 4px 0 8px; min-height: 0 !important; }
.cafe-cad__linha { display: flex; align-items: center; gap: 8px; }
.cafe-cad__linha .seletor__item { flex: 1; }
.cafe-teste-pix { margin-top: 12px; }
.cafe-teste-pix summary { cursor: pointer; color: var(--foco); font-weight: 600; }
@media (max-width: 1000px) {
  .cafe-lancamento { grid-template-columns: minmax(0, 1fr); }
  .cafe-conta { position: static; }
}
@media (max-width: 560px) {
  .cafe-pix { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .cafe-conta__linha { grid-template-columns: minmax(0, 1fr) auto; }
  .cafe-conta__sub { grid-column: 2; }
}
/* Café: lançamento com cardápio grande (busca, atalhos, grupos) */
.cafe-busca { display: flex; align-items: center; gap: 8px; border: 1px solid var(--linha-forte); border-radius: 8px; padding: 0 10px; background: var(--papel); margin-bottom: 12px; }
.cafe-busca input { flex: 1; border: 0; outline: 0; height: 42px; font: inherit; font-size: 16px; background: transparent; min-width: 0; }
.cafe-busca:focus-within { border-color: var(--acropole); box-shadow: 0 0 0 3px rgba(15,74,65,.12); }
.cafe-grupos__aba small { font-weight: 500; opacity: .7; margin-left: 2px; }
.cafe-grupos__aba--atalho { border-style: dashed; }
.cafe-itens { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; max-height: 62vh; overflow-y: auto; padding-right: 2px; }
.cafe-item { min-height: 70px; padding: 10px 12px; }
.cafe-item__grupo { font-size: 12px; color: var(--tinta-suave); }

/* ===== Economia ===== */
.chip--erro { background: var(--rubi-fundo); color: var(--rubi); }
.linha--apagada td { opacity: .55; }
.linha--apagada td:last-child { opacity: 1; }
a.cafe-kpi--link { text-decoration: none; color: inherit; transition: border-color .12s, box-shadow .12s; }
a.cafe-kpi--link:hover { border-color: var(--acropole); box-shadow: 0 1px 0 var(--acropole); }
.cafe-item.econ-item--sem { opacity: .55; cursor: not-allowed; }
.econ-item__estoque { font-size: 12px; color: var(--tinta-suave); }
.econ-item__estoque--baixo { color: var(--bronze); font-weight: 600; }
.econ-receita { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; align-items: end; height: 220px; margin: 12px 0 6px; }
.econ-receita__mes { display: grid; grid-template-rows: auto 1fr auto; height: 100%; gap: 4px; text-align: center; min-width: 0; }
.econ-receita__valor { font-size: 11px; color: var(--tinta-suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.econ-receita__pilha { display: flex; flex-direction: column; justify-content: flex-end; background: #EEF2F0; border-radius: 6px 6px 0 0; overflow: hidden; }
.econ-receita__pilha span { display: block; width: 100%; }
.econ-receita__li, .econ-legenda__li { background: var(--acropole); }
.econ-receita__ou, .econ-legenda__ou { background: #7BB8A8; }
.econ-receita__ev, .econ-legenda__ev { background: #C99A3E; }
.econ-receita__rotulo { font-size: 12px; color: var(--tinta-suave); text-transform: capitalize; }
.econ-legenda { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 13px; color: var(--tinta-suave); margin: 4px 0 0; }
.econ-legenda span { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }
.econ-eventos { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.econ-eventos li { display: grid; gap: 2px; padding-bottom: 12px; border-bottom: 1px solid var(--linha); }
.econ-eventos li:last-child { border-bottom: 0; padding-bottom: 0; }
.econ-eventos__num { font-size: 13px; color: var(--tinta-suave); }
.econ-barra { display: block; height: 6px; background: #E8EEEC; border-radius: 4px; overflow: hidden; margin-top: 4px; }
.econ-barra span { display: block; height: 100%; background: var(--acropole); }
.econ-pendencias { margin: 0; padding-left: 18px; display: grid; gap: 4px; }
.econ-pendencias .chip { margin-left: 4px; }
.econ-presenca input { width: 20px; height: 20px; }
.econ-descricao summary { cursor: pointer; font-weight: 600; }
@media (max-width: 640px) { .econ-receita { height: 170px; gap: 6px; } .econ-receita__valor { font-size: 10px; } }

/* ===== Divulgação (QR Code, cartaz, imagem) ===== */
.divulgacao { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: start; }
.divulgacao__qr { background: #fff; padding: 8px; border: 1px solid var(--linha); border-radius: 10px; line-height: 0; }
.divulgacao__dados { min-width: 0; display: grid; gap: 4px; }
.divulgacao__dados .campo__junto input { min-width: 0; flex: 1; }
@media (max-width: 640px) { .divulgacao { grid-template-columns: 1fr; } .divulgacao__qr { justify-self: center; } }
.econ-receita__cf, .econ-legenda__cf { background: #8C6A4F; }
