/* ==========================================================================
   BPP — Boxeando pela Paz
   Tokens derivados da logomarca: púrpura das letras e das luvas, grafite da
   pantera, off-white do papel e o lilás acinzentado da corda do anel.
   Regra: cores, espaços e tipografia só entram por tokens (:root).
   ========================================================================== */

/* ---------- Fontes (Montserrat local, WOFF2 latino) ---------- */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/montserrat-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/montserrat-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/montserrat-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/montserrat-latin-700-normal.woff2") format("woff2"); }

/* ---------- Tokens ---------- */
:root {
  /* Cor */
  --bpp-off-white: #f7f5f0;
  --bpp-papel: #fdfcf9;
  --bpp-tinta: #221c21;
  --bpp-tinta-suave: #5a5158;
  --bpp-linha: #e3dce1;
  --bpp-roxo-900: #2e0d29;
  --bpp-roxo-800: #4b1742;   /* letras da logo */
  --bpp-roxo-600: #6b2a63;   /* ação principal */
  --bpp-roxo-500: #86407f;
  --bpp-roxo-300: #c9b3c6;
  --bpp-roxo-100: #efe6ee;
  --bpp-roxo-50: #f7f1f6;
  --bpp-corda-a: #b79ab1;    /* corda do anel: fio escuro */
  --bpp-corda-b: #efe6ee;    /* corda do anel: fio claro */
  --bpp-perigo: #a4262c;
  --bpp-perigo-fundo: #fbeeee;
  --bpp-perigo-borda: #e9c4c6;
  --bpp-sucesso: #1b5a3a;
  --bpp-sucesso-fundo: #edf6f0;
  --bpp-sucesso-borda: #c3dfcd;
  --bpp-atencao: #6b4700;
  --bpp-atencao-fundo: #fbf3e2;
  --bpp-atencao-borda: #ecd7a5;

  /* Espaçamento (base 4 px) */
  --bpp-e1: .25rem;
  --bpp-e2: .5rem;
  --bpp-e3: .75rem;
  --bpp-e4: 1rem;
  --bpp-e5: 1.5rem;
  --bpp-e6: 2rem;
  --bpp-e7: 3rem;

  /* Bordas */
  --bpp-raio: .5rem;
  --bpp-borda-campo: 1.5px solid #cbbdc8;

  /* Tipografia */
  --bpp-fonte: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bpp-t-pequeno: .8125rem;
  --bpp-t-base: 1rem;
  --bpp-t-media: 1.125rem;
  --bpp-t-titulo: 1.625rem;
  --bpp-t-numero: 2rem;

  /* Campos e botões */
  --bpp-altura-toque: 2.75rem;   /* 44 px */
  --bpp-altura-campo: 3rem;      /* 48 px */
  --bpp-foco: 0 0 0 .1875rem rgba(107, 42, 99, .22);

  /* Bootstrap 5.3 lê estas variáveis */
  --bs-body-font-family: var(--bpp-fonte);
  --bs-body-font-size: var(--bpp-t-base);
  --bs-body-line-height: 1.6;
  --bs-body-color: var(--bpp-tinta);
  --bs-body-color-rgb: 34, 28, 33;
  --bs-body-bg: var(--bpp-off-white);
  --bs-body-bg-rgb: 247, 245, 240;
  --bs-primary: var(--bpp-roxo-600);
  --bs-primary-rgb: 107, 42, 99;
  --bs-link-color: var(--bpp-roxo-600);
  --bs-link-color-rgb: 107, 42, 99;
  --bs-link-hover-color: var(--bpp-roxo-800);
  --bs-link-hover-color-rgb: 75, 23, 66;
  --bs-border-color: var(--bpp-linha);
  --bs-secondary-color: var(--bpp-tinta-suave);
  --bs-form-invalid-color: var(--bpp-perigo);
  --bs-form-invalid-border-color: var(--bpp-perigo);
  --bs-border-radius: var(--bpp-raio);
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: env(safe-area-inset-top, 0px); }
body { font-feature-settings: "tnum" 0; }
h1, h2, h3 { font-weight: 700; letter-spacing: -.01em; color: var(--bpp-roxo-900); line-height: 1.2; }
h1 { font-size: var(--bpp-t-titulo); }
h2 { font-size: var(--bpp-t-media); }
a { text-underline-offset: .18em; }
:focus-visible { outline: .1875rem solid var(--bpp-roxo-500); outline-offset: .125rem; }
strong { font-weight: 600; }
.bpp-pular {
  position: absolute; left: var(--bpp-e3); top: -4rem; z-index: 2000;
  background: var(--bpp-roxo-800); color: #fff; padding: var(--bpp-e2) var(--bpp-e4);
  border-radius: var(--bpp-raio); text-decoration: none; font-weight: 600;
}
.bpp-pular:focus { top: var(--bpp-e3); }

/* ---------- Campos ---------- */
.form-label { font-size: .875rem; font-weight: 600; color: var(--bpp-tinta); margin-bottom: var(--bpp-e2); }
.form-control, .form-select {
  min-height: var(--bpp-altura-campo);
  font-size: 1rem;                     /* 16 px: evita zoom automático no iOS */
  color: var(--bpp-tinta);
  background-color: var(--bpp-papel);
  border: var(--bpp-borda-campo);
  border-radius: var(--bpp-raio);
  padding: var(--bpp-e3) var(--bpp-e4);
}
.form-control::placeholder { color: #8c8189; opacity: 1; }
.form-control:focus, .form-select:focus {
  color: var(--bpp-tinta); background-color: var(--bpp-papel);
  border-color: var(--bpp-roxo-600); box-shadow: var(--bpp-foco);
}
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--bpp-perigo); background-image: none; padding-right: var(--bpp-e4); }
.invalid-feedback { font-size: .875rem; font-weight: 500; }
.bpp-campo { margin-bottom: var(--bpp-e5); }

/* Campo de senha: campo + botão de mostrar/ocultar como uma peça só */
.bpp-senha { border-radius: var(--bpp-raio); }
.bpp-senha .form-control { border-right: 0; border-radius: var(--bpp-raio) 0 0 var(--bpp-raio); }
.bpp-senha .form-control:focus { box-shadow: none; }
.bpp-senha .bpp-btn-icone {
  border: var(--bpp-borda-campo); border-left: 0; background: var(--bpp-papel);
  border-radius: 0 var(--bpp-raio) var(--bpp-raio) 0; width: var(--bpp-altura-campo);
}
.bpp-senha:focus-within { box-shadow: var(--bpp-foco); }
.bpp-senha:focus-within .form-control, .bpp-senha:focus-within .bpp-btn-icone { border-color: var(--bpp-roxo-600); }
.bpp-senha:has(.is-invalid) .bpp-btn-icone { border-color: var(--bpp-perigo); }

/* ---------- Botões ---------- */
.btn {
  min-height: var(--bpp-altura-toque); font-weight: 600; font-size: 1rem;
  border-radius: var(--bpp-raio); padding: var(--bpp-e3) var(--bpp-e5);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--bpp-e2);
}
.btn:focus-visible { box-shadow: none; outline: .1875rem solid var(--bpp-roxo-500); outline-offset: .125rem; }
.btn-primary {
  --bs-btn-bg: var(--bpp-roxo-600); --bs-btn-border-color: var(--bpp-roxo-600); --bs-btn-color: #fff;
  --bs-btn-hover-bg: var(--bpp-roxo-800); --bs-btn-hover-border-color: var(--bpp-roxo-800); --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--bpp-roxo-900); --bs-btn-active-border-color: var(--bpp-roxo-900); --bs-btn-active-color: #fff;
  --bs-btn-disabled-bg: var(--bpp-roxo-500); --bs-btn-disabled-border-color: var(--bpp-roxo-500); --bs-btn-disabled-color: #fff;
}
.btn-outline-primary {
  --bs-btn-color: var(--bpp-roxo-600); --bs-btn-border-color: var(--bpp-roxo-300);
  --bs-btn-hover-bg: var(--bpp-roxo-50); --bs-btn-hover-color: var(--bpp-roxo-800); --bs-btn-hover-border-color: var(--bpp-roxo-600);
  --bs-btn-active-bg: var(--bpp-roxo-100); --bs-btn-active-color: var(--bpp-roxo-800); --bs-btn-active-border-color: var(--bpp-roxo-600);
}
.bpp-acao { margin-top: var(--bpp-e2); }
.bpp-btn-icone {
  width: var(--bpp-altura-toque); min-height: var(--bpp-altura-toque); padding: 0;
  color: var(--bpp-tinta-suave); background: transparent; border: 0; font-size: 1.375rem;
}
.bpp-btn-icone:hover { background: var(--bpp-roxo-100); color: var(--bpp-roxo-800); }
.btn.is-enviando { pointer-events: none; }

/* ---------- Alertas e selos ---------- */
.bpp-alerta { display: flex; gap: var(--bpp-e3); align-items: flex-start; font-size: .9375rem; font-weight: 500; border-radius: var(--bpp-raio); padding: var(--bpp-e3) var(--bpp-e4); }
.bpp-alerta .ti { font-size: 1.25rem; margin-top: .05rem; flex: none; }
.alert-danger  { --bs-alert-color: var(--bpp-perigo); --bs-alert-bg: var(--bpp-perigo-fundo); --bs-alert-border-color: var(--bpp-perigo-borda); }
.alert-success { --bs-alert-color: var(--bpp-sucesso); --bs-alert-bg: var(--bpp-sucesso-fundo); --bs-alert-border-color: var(--bpp-sucesso-borda); }
.alert-warning { --bs-alert-color: var(--bpp-atencao); --bs-alert-bg: var(--bpp-atencao-fundo); --bs-alert-border-color: var(--bpp-atencao-borda); }
.bpp-selo { display: inline-block; font-size: var(--bpp-t-pequeno); font-weight: 600; padding: .125rem var(--bpp-e2); border-radius: .375rem; white-space: nowrap; }
.bpp-selo--atencao { background: var(--bpp-atencao-fundo); color: var(--bpp-atencao); }
.bpp-selo--ok { background: var(--bpp-sucesso-fundo); color: var(--bpp-sucesso); }
.bpp-selo--neutro { background: var(--bpp-roxo-100); color: var(--bpp-roxo-800); }

/* ---------- Corda do anel: o detalhe de identidade ---------- */
.bpp-corda {
  background: repeating-linear-gradient(135deg, var(--bpp-corda-a) 0 .1875rem, var(--bpp-corda-b) .1875rem .375rem);
}

/* ---------- Telas de entrada e erro ---------- */
.bpp-auth { min-height: 100vh; min-height: 100dvh; }
.bpp-auth__principal {
  min-height: inherit; display: flex; justify-content: center;
  padding: max(var(--bpp-e6), env(safe-area-inset-top)) var(--bpp-e5) max(var(--bpp-e6), env(safe-area-inset-bottom));
}
.bpp-auth__coluna { width: 100%; max-width: 25rem; margin-block: auto; }
.bpp-marca { display: flex; justify-content: center; margin-bottom: var(--bpp-e5); }
.bpp-marca__logo { width: 12.5rem; height: auto; max-width: 60%; }
.bpp-marca__logo--pequena { width: 6rem; max-width: none; }
.bpp-auth .bpp-titulo { text-align: center; margin-bottom: var(--bpp-e2); }
.bpp-auth .bpp-apoio { text-align: center; }
.bpp-apoio { color: var(--bpp-tinta-suave); font-size: .9375rem; margin-bottom: var(--bpp-e5); }
.bpp-nota { color: var(--bpp-tinta-suave); font-size: var(--bpp-t-pequeno); text-align: center; margin: var(--bpp-e5) 0 0; }
.bpp-depuracao { font-size: .75rem; background: var(--bpp-papel); border: 1px solid var(--bpp-linha); padding: var(--bpp-e3); overflow: auto; max-height: 16rem; }

/* ---------- Painel ---------- */
.bpp-topo {
  position: sticky; top: 0; z-index: 1020;
  display: flex; align-items: center; justify-content: space-between;
  padding: calc(var(--bpp-e2) + env(safe-area-inset-top, 0px)) var(--bpp-e4) calc(var(--bpp-e2) + .4375rem);
  background: var(--bpp-papel);
}
.bpp-topo::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: .4375rem;
  background: repeating-linear-gradient(135deg, var(--bpp-corda-a) 0 .1875rem, var(--bpp-corda-b) .1875rem .375rem);
}
.bpp-topo__marca { display: inline-flex; align-items: center; gap: var(--bpp-e3); color: var(--bpp-roxo-800); font-weight: 700; text-decoration: none; letter-spacing: -.01em; }

.bpp-estrutura { min-height: 100vh; min-height: 100dvh; }
.bpp-menu {
  padding: 0;
  /* Bootstrap define estas variáveis no próprio elemento; por isso o ajuste fica aqui */
  --bs-offcanvas-bg: var(--bpp-papel);
  --bs-offcanvas-width: min(20rem, 86vw);
  --bs-offcanvas-border-width: 0;
  --bs-offcanvas-box-shadow: 0 0 2rem rgba(46, 13, 41, .18);
}
.bpp-menu__topo { display: flex; align-items: center; justify-content: space-between; padding: var(--bpp-e4) var(--bpp-e4) var(--bpp-e3); padding-top: calc(var(--bpp-e4) + env(safe-area-inset-top, 0px)); }
.bpp-menu__marca { display: inline-flex; align-items: center; gap: var(--bpp-e3); color: var(--bpp-roxo-800); font-weight: 700; line-height: 1.15; text-decoration: none; letter-spacing: -.01em; }
.bpp-menu__nav { flex: 1 1 auto; padding: var(--bpp-e3); overflow-y: auto; }
.bpp-menu__rodape { padding: var(--bpp-e3) var(--bpp-e3) calc(var(--bpp-e3) + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--bpp-linha); display: grid; gap: var(--bpp-e1); }
.bpp-usuario { margin: 0 var(--bpp-e3) var(--bpp-e2); display: grid; line-height: 1.3; }
.bpp-usuario strong { font-size: .9375rem; }
.bpp-usuario span { font-size: var(--bpp-t-pequeno); color: var(--bpp-tinta-suave); }
.bpp-nav { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--bpp-e1); }
.bpp-nav__link {
  display: flex; align-items: center; gap: var(--bpp-e3); width: 100%;
  min-height: var(--bpp-altura-toque); padding: var(--bpp-e2) var(--bpp-e3);
  color: var(--bpp-tinta); font-weight: 500; font-size: .9375rem; text-decoration: none;
  border-radius: var(--bpp-raio); background: transparent; border: 0; text-align: left;
}
.bpp-nav__link .ti { font-size: 1.375rem; color: var(--bpp-tinta-suave); }
.bpp-nav__link:hover { background: var(--bpp-roxo-50); color: var(--bpp-roxo-800); }
.bpp-nav__link.is-ativo { background: var(--bpp-roxo-100); color: var(--bpp-roxo-800); font-weight: 600; }
.bpp-nav__link.is-ativo .ti, .bpp-nav__link:hover .ti { color: var(--bpp-roxo-600); }

.bpp-conteudo { padding: var(--bpp-e5) var(--bpp-e4) calc(var(--bpp-e7) + env(safe-area-inset-bottom, 0px)); min-width: 0; }
.bpp-conteudo:focus { outline: none; }
.bpp-cabecalho-pagina { margin-bottom: var(--bpp-e5); }
.bpp-cabecalho-pagina h1 { margin-bottom: var(--bpp-e1); }
.bpp-cabecalho-pagina .bpp-apoio { margin-bottom: 0; }
.bpp-formulario { max-width: 26rem; }
.bpp-secao { margin-top: var(--bpp-e6); }
.bpp-secao h2 { margin-bottom: var(--bpp-e3); }
.bpp-vazio { color: var(--bpp-tinta-suave); padding: var(--bpp-e4) 0; border-top: 1px solid var(--bpp-linha); }
.bpp-vazio p { max-width: 34rem; margin: 0; }

/* Totais: leitura direta, sem caixas */
.bpp-metricas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bpp-e4) var(--bpp-e4); margin: 0; padding: 0; }
.bpp-metrica { border-left: .1875rem solid var(--bpp-roxo-300); padding: var(--bpp-e1) 0 var(--bpp-e1) var(--bpp-e3); margin: 0; }
.bpp-metrica dt { font-size: var(--bpp-t-pequeno); font-weight: 500; color: var(--bpp-tinta-suave); line-height: 1.3; }
.bpp-metrica dd { margin: var(--bpp-e1) 0 0; font-size: var(--bpp-t-numero); font-weight: 700; line-height: 1.1; color: var(--bpp-roxo-800); font-variant-numeric: tabular-nums; }

.bpp-tabela { --bs-table-bg: transparent; font-size: .9375rem; margin: 0; }
.bpp-tabela th { font-size: var(--bpp-t-pequeno); font-weight: 600; color: var(--bpp-tinta-suave); border-bottom-color: var(--bpp-roxo-300); white-space: nowrap; }
.bpp-tabela td { vertical-align: middle; border-color: var(--bpp-linha); }

/* Desktop: menu fixo à esquerda, com a corda do anel na borda */
@media (min-width: 992px) {
  :root { --bpp-t-titulo: 1.875rem; }
  .bpp-estrutura { display: grid; grid-template-columns: 16.5rem minmax(0, 1fr); transition: grid-template-columns .2s ease; }
  .bpp-estrutura .bpp-menu {
    position: sticky; top: 0; height: 100vh; height: 100dvh; align-self: start;
    display: flex; flex-direction: column; overflow: hidden;
    background: var(--bpp-papel) !important; padding-right: .4375rem;
  }
  .bpp-estrutura .bpp-menu::after {
    content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: .4375rem;
    background: repeating-linear-gradient(45deg, var(--bpp-corda-a) 0 .1875rem, var(--bpp-corda-b) .1875rem .375rem);
  }
  .bpp-conteudo { padding: var(--bpp-e6) var(--bpp-e7) var(--bpp-e7); }
  .bpp-metricas { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------- SweetAlert2 ---------- */
.swal2-popup { font-family: var(--bpp-fonte); border-radius: .75rem; color: var(--bpp-tinta); }
.swal2-title { font-size: 1.25rem; font-weight: 700; color: var(--bpp-roxo-900); }
.swal2-html-container { font-size: .9375rem; }
.swal2-styled { border-radius: var(--bpp-raio) !important; font-weight: 600 !important; min-height: var(--bpp-altura-toque); }
.swal2-styled.swal2-confirm { background-color: var(--bpp-roxo-600) !important; }
.swal2-styled.swal2-cancel { background-color: var(--bpp-roxo-100) !important; color: var(--bpp-roxo-800) !important; }
.swal2-styled:focus { box-shadow: var(--bpp-foco) !important; }

/* ---------- Movimento reduzido ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Cadastro público (celular)
   ========================================================================== */
.bpp-publico { min-height: 100vh; min-height: 100dvh; }
.bpp-publico__principal {
  display: flex; justify-content: center;
  padding: max(var(--bpp-e5), env(safe-area-inset-top)) max(var(--bpp-e4), env(safe-area-inset-right)) calc(var(--bpp-e7) + env(safe-area-inset-bottom)) max(var(--bpp-e4), env(safe-area-inset-left));
}
.bpp-publico__coluna { width: 100%; max-width: 34rem; }
.bpp-centro { text-align: center; }
.bpp-destaque { font-size: var(--bpp-t-media); font-weight: 500; color: var(--bpp-tinta); }
.bpp-opc { font-weight: 400; color: var(--bpp-tinta-suave); }
.bpp-ajuda { font-size: var(--bpp-t-pequeno); color: var(--bpp-tinta-suave); margin: var(--bpp-e1) 0 0; }
.bpp-invalido { color: var(--bpp-perigo); font-size: .875rem; font-weight: 500; margin: var(--bpp-e2) 0 0; }

/* Topo do cadastro: logo + título lado a lado, sem ocupar a tela inteira no celular */
.bpp-cadastro-topo { display: flex; align-items: center; gap: var(--bpp-e4); margin-bottom: var(--bpp-e5); }
.bpp-cadastro-topo .bpp-titulo { margin: 0 0 var(--bpp-e1); font-size: 1.5rem; }
.bpp-cadastro-topo .bpp-apoio { margin: 0; font-size: .875rem; }
.bpp-marca__logo--topo { width: 6rem; height: 6rem; flex: none; max-width: none; }
@media (max-width: 359.98px) {
  .bpp-cadastro-topo { flex-direction: column; text-align: center; }
}

/* Progresso: a trilha é a corda do anel; o fio roxo preenche conforme as etapas */
.bpp-progresso { margin-bottom: var(--bpp-e5); }
.bpp-progresso__texto { display: flex; flex-wrap: wrap; gap: var(--bpp-e1) var(--bpp-e3); align-items: baseline; margin: 0 0 var(--bpp-e2); font-size: .9375rem; }
.bpp-progresso__texto > span { color: var(--bpp-tinta-suave); }
.bpp-trilha {
  height: .625rem; border-radius: .3125rem; overflow: hidden; border: 1px solid var(--bpp-corda-a);
  background: repeating-linear-gradient(135deg, var(--bpp-corda-a) 0 .1875rem, var(--bpp-corda-b) .1875rem .375rem);
}
.bpp-trilha__fio { height: 100%; background: var(--bpp-roxo-600); width: 16.667%; transition: width .25s ease; }
.bpp-trilha__fio.p-2 { width: 33.333%; }
.bpp-trilha__fio.p-3 { width: 50%; }
.bpp-trilha__fio.p-4 { width: 66.667%; }
.bpp-trilha__fio.p-5 { width: 83.333%; }
.bpp-trilha__fio.p-6 { width: 100%; }

/* Etapas e campos */
.bpp-etapa[hidden], [data-se][hidden] { display: none !important; }
.bpp-etapa h2 { font-size: 1.25rem; margin: 0 0 var(--bpp-e4); }
.bpp-etapa h2:focus { outline: none; }
.bpp-subtitulo { font-size: 1.0625rem; margin: var(--bpp-e6) 0 var(--bpp-e2); }
.bpp-bloco { border: 0; border-top: 1px solid var(--bpp-linha); margin: var(--bpp-e5) 0 0; padding: var(--bpp-e4) 0 0; min-width: 0; }
.bpp-bloco > legend { float: none; width: auto; padding: 0 var(--bpp-e2) 0 0; margin: 0 0 var(--bpp-e3); font-size: 1rem; font-weight: 700; color: var(--bpp-roxo-900); }
fieldset.bpp-campo { border: 0; padding: 0; margin-inline: 0; min-width: 0; }
fieldset.bpp-campo > legend { float: none; width: auto; padding: 0; margin-bottom: var(--bpp-e2); font-size: .875rem; }
.bpp-campo .invalid-feedback { display: none; margin-top: var(--bpp-e1); }
.bpp-campo.tem-erro .invalid-feedback { display: block; }
.bpp-campo.tem-erro .form-control, .bpp-campo.tem-erro .form-select { border-color: var(--bpp-perigo); }
.bpp-campo.tem-erro .bpp-opcao { border-color: var(--bpp-perigo); }
.bpp-idade { margin: calc(var(--bpp-e3) * -1) 0 var(--bpp-e5); font-size: .875rem; color: var(--bpp-roxo-800); font-weight: 600; }

/* Opções (rádio/caixa): alvo de toque de 44 px ou mais */
.bpp-opcoes { display: flex; flex-wrap: wrap; gap: var(--bpp-e2); }
.bpp-opcoes--coluna { flex-direction: column; }
.bpp-opcao {
  display: flex; align-items: center; gap: var(--bpp-e3); min-height: var(--bpp-altura-campo);
  padding: var(--bpp-e2) var(--bpp-e4); background: var(--bpp-papel); border: var(--bpp-borda-campo);
  border-radius: var(--bpp-raio); cursor: pointer; font-size: 1rem; line-height: 1.35;
}
.bpp-opcoes:not(.bpp-opcoes--coluna) .bpp-opcao { flex: 1 1 6rem; }
.bpp-opcao input { width: 1.375rem; height: 1.375rem; flex: none; margin: 0; accent-color: var(--bpp-roxo-600); }
.bpp-opcao:has(input:checked) { border-color: var(--bpp-roxo-600); background: var(--bpp-roxo-50); }
.bpp-opcao:has(input:focus-visible) { outline: .1875rem solid var(--bpp-roxo-500); outline-offset: .125rem; }
.bpp-opcao--caixa { width: 100%; }

.bpp-aviso { display: flex; gap: var(--bpp-e3); align-items: flex-start; background: var(--bpp-roxo-50); border-left: .25rem solid var(--bpp-roxo-300); padding: var(--bpp-e3) var(--bpp-e4); margin: 0 0 var(--bpp-e5); font-size: .9375rem; }
.bpp-aviso .ti { font-size: 1.25rem; color: var(--bpp-roxo-600); flex: none; margin-top: .1rem; }
.bpp-aviso p { margin: 0; }
.bpp-aviso--fino { padding: var(--bpp-e2) var(--bpp-e3); margin-top: calc(var(--bpp-e3) * -1); }

/* Navegação: no fluxo normal (nada fixo que o teclado possa cobrir) */
.bpp-navegacao { display: flex; flex-direction: column; gap: var(--bpp-e3); margin-top: var(--bpp-e6); }
.bpp-navegacao .btn { width: 100%; min-height: var(--bpp-altura-campo); }

/* Revisão e termos */
.bpp-revisao { display: grid; gap: var(--bpp-e4); margin-bottom: var(--bpp-e4); }
.bpp-revisao__secao { border-top: 1px solid var(--bpp-linha); padding-top: var(--bpp-e3); }
.bpp-revisao__cab { display: flex; justify-content: space-between; align-items: center; gap: var(--bpp-e3); }
.bpp-revisao__cab h3 { font-size: 1rem; margin: 0; }
.bpp-revisao__cab .btn { min-height: var(--bpp-altura-toque); padding: var(--bpp-e2) var(--bpp-e3); font-size: .875rem; }
.bpp-revisao dl { margin: var(--bpp-e2) 0 0; display: grid; gap: var(--bpp-e2); }
.bpp-revisao dt { font-size: var(--bpp-t-pequeno); font-weight: 500; color: var(--bpp-tinta-suave); }
.bpp-revisao dd { margin: 0; overflow-wrap: anywhere; }
.bpp-termo { margin-bottom: var(--bpp-e5); }
.bpp-termo__texto { border: var(--bpp-borda-campo); border-radius: var(--bpp-raio); background: var(--bpp-papel); margin-bottom: var(--bpp-e3); }
.bpp-termo__texto summary { display: flex; gap: var(--bpp-e3); align-items: center; min-height: var(--bpp-altura-campo); padding: var(--bpp-e2) var(--bpp-e4); cursor: pointer; font-weight: 600; }
.bpp-termo__texto summary .ti { color: var(--bpp-roxo-600); font-size: 1.25rem; }
.bpp-termo__corpo { padding: 0 var(--bpp-e4) var(--bpp-e3); font-size: .9375rem; }
.bpp-termo__corpo p { margin: 0 0 var(--bpp-e3); overflow-wrap: anywhere; }

/* Sucesso */
.bpp-sucesso { text-align: center; padding-top: var(--bpp-e5); }
.bpp-sucesso:focus { outline: none; }
.bpp-sucesso__icone .ti { font-size: 3.5rem; color: var(--bpp-sucesso); }
.bpp-sucesso h2 { margin: var(--bpp-e2) 0 var(--bpp-e3); }
.bpp-sucesso[hidden] { display: none; }
.bpp-protocolo { margin: var(--bpp-e5) 0; text-align: left; display: grid; gap: var(--bpp-e3); border-top: .1875rem solid var(--bpp-roxo-300); padding-top: var(--bpp-e4); }
.bpp-protocolo div { display: flex; justify-content: space-between; gap: var(--bpp-e3); align-items: baseline; }
.bpp-protocolo dt { font-weight: 500; color: var(--bpp-tinta-suave); font-size: .9375rem; }
.bpp-protocolo dd { margin: 0; font-weight: 700; color: var(--bpp-roxo-800); text-align: right; }
#sucesso-protocolo { font-size: 1.25rem; letter-spacing: .02em; font-variant-numeric: tabular-nums; }

/* Página para computador/tablet */
.bpp-qr { display: grid; justify-items: center; margin: var(--bpp-e5) 0; }
.bpp-qr__imagem { width: 14rem; height: 14rem; padding: var(--bpp-e3); background: #fff; border: 1px solid var(--bpp-linha); border-radius: var(--bpp-raio); }
.bpp-qr__imagem svg { width: 100%; height: 100%; display: block; }
.bpp-qr__legenda { margin: var(--bpp-e3) 0 0; font-size: .875rem; color: var(--bpp-tinta-suave); }
.bpp-link .input-group .form-control { border-radius: var(--bpp-raio) 0 0 var(--bpp-raio); }
.bpp-link .input-group .btn { border-radius: 0 var(--bpp-raio) var(--bpp-raio) 0; }
.bpp-celular-aqui { margin-top: var(--bpp-e6); padding-top: var(--bpp-e4); border-top: 1px solid var(--bpp-linha); text-align: center; font-size: .9375rem; }
.bpp-celular-aqui[hidden] { display: none; }

@media (min-width: 768px) {
  .bpp-navegacao { flex-direction: row-reverse; }
  .bpp-navegacao .btn { width: auto; min-width: 11rem; }
}
/* Celular deitado: sem cabeçalho gigante; campos continuam em coluna única */
@media (orientation: landscape) and (max-height: 500px) {
  .bpp-cadastro-topo { margin-bottom: var(--bpp-e3); }
  .bpp-marca__logo--topo { width: 4rem; height: 4rem; }
}

/* ==========================================================================
   Painel de alunos: lista, filtros, ficha e formulário
   ========================================================================== */
.bpp-cabecalho-acoes { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--bpp-e3) var(--bpp-e5); }
.bpp-acoes { display: flex; flex-wrap: wrap; gap: var(--bpp-e2); }
.bpp-migalha { margin: 0 0 var(--bpp-e2); font-size: .875rem; }
.bpp-migalha a { display: inline-flex; align-items: center; gap: var(--bpp-e1); text-decoration: none; }
.bpp-metrica dt a { color: inherit; text-decoration: none; }
.bpp-metrica dt a:hover { text-decoration: underline; }
.btn-danger { --bs-btn-bg: var(--bpp-perigo); --bs-btn-border-color: var(--bpp-perigo); --bs-btn-hover-bg: #82191f; --bs-btn-hover-border-color: #82191f; --bs-btn-active-bg: #6c1419; --bs-btn-active-border-color: #6c1419; }

.bpp-filtros { margin-bottom: var(--bpp-e5); }
.bpp-busca { display: flex; gap: var(--bpp-e2); }
.bpp-busca .form-control { flex: 1 1 auto; min-width: 0; }
.bpp-mais-filtros { margin-top: var(--bpp-e3); }
.bpp-mais-filtros summary { display: inline-flex; align-items: center; gap: var(--bpp-e2); min-height: var(--bpp-altura-toque); cursor: pointer; font-weight: 600; color: var(--bpp-roxo-800); }
.bpp-filtros__grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: var(--bpp-e3) var(--bpp-e4); margin: var(--bpp-e2) 0 var(--bpp-e4); }
.bpp-filtros__acoes { display: flex; gap: var(--bpp-e2); }

/* Lista: tabela no desktop, blocos no celular (rótulos vêm do data-rotulo) */
.bpp-lista { width: 100%; border-collapse: collapse; font-size: .9375rem; }
.bpp-lista th { text-align: left; font-size: var(--bpp-t-pequeno); font-weight: 600; color: var(--bpp-tinta-suave); padding: var(--bpp-e2) var(--bpp-e3); border-bottom: 2px solid var(--bpp-roxo-300); white-space: nowrap; }
.bpp-lista td { padding: var(--bpp-e3); border-bottom: 1px solid var(--bpp-linha); vertical-align: middle; }
.bpp-lista__nome { font-weight: 600; text-decoration: none; }
.bpp-lista__nome:hover { text-decoration: underline; }
.bpp-lista tr.is-arquivada td { color: var(--bpp-tinta-suave); }
@media (max-width: 991.98px) {
  .bpp-lista thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .bpp-lista, .bpp-lista tbody, .bpp-lista tr, .bpp-lista td { display: block; }
  .bpp-lista tr { padding: var(--bpp-e3) 0; border-bottom: 1px solid var(--bpp-linha); }
  .bpp-lista td { display: flex; gap: var(--bpp-e3); justify-content: space-between; padding: var(--bpp-e1) 0; border: 0; text-align: right; }
  .bpp-lista td::before { content: attr(data-rotulo); flex: none; font-size: var(--bpp-t-pequeno); color: var(--bpp-tinta-suave); text-align: left; }
  .bpp-lista td:first-child { display: block; text-align: left; font-size: 1.0625rem; }
  .bpp-lista td:first-child::before { display: none; }
}
.bpp-paginacao { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--bpp-e3); margin-top: var(--bpp-e5); }
.bpp-paginacao ul { display: flex; gap: var(--bpp-e1); list-style: none; margin: 0; padding: 0; }
.bpp-paginacao li a { display: inline-flex; align-items: center; justify-content: center; min-width: var(--bpp-altura-toque); min-height: var(--bpp-altura-toque); border-radius: var(--bpp-raio); text-decoration: none; font-weight: 600; }
.bpp-paginacao li a:hover { background: var(--bpp-roxo-50); }
.bpp-paginacao li a.is-atual { background: var(--bpp-roxo-600); color: #fff; }

/* Ficha */
.bpp-ficha-topo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--bpp-e3) var(--bpp-e5); margin-bottom: var(--bpp-e5); }
.bpp-ficha-topo h1 { margin: 0 0 var(--bpp-e2); overflow-wrap: anywhere; }
.bpp-ficha-ident { display: flex; flex-wrap: wrap; gap: var(--bpp-e2); align-items: center; margin: 0; }
.bpp-ficha-grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--bpp-e6) var(--bpp-e6); margin-top: var(--bpp-e5); }
@media (min-width: 1200px) { .bpp-ficha-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bpp-ficha-larga { grid-column: 1 / -1; } }
.bpp-ficha-secao { border-top: .1875rem solid var(--bpp-roxo-300); padding-top: var(--bpp-e3); min-width: 0; margin-bottom: var(--bpp-e5); }
.bpp-ficha-secao h2 { margin-bottom: var(--bpp-e3); }
.bpp-dl { display: grid; gap: var(--bpp-e2); margin: 0 0 var(--bpp-e3); }
.bpp-dl > div { display: grid; grid-template-columns: minmax(7rem, 11rem) minmax(0, 1fr); gap: var(--bpp-e3); }
.bpp-dl dt { font-size: var(--bpp-t-pequeno); font-weight: 500; color: var(--bpp-tinta-suave); padding-top: .15rem; }
.bpp-dl dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 575.98px) { .bpp-dl > div { grid-template-columns: 1fr; gap: 0; } }
.bpp-lista-simples { margin: 0 0 var(--bpp-e3); padding-left: 1.1rem; font-size: .9375rem; }
.bpp-lista-simples li { margin-bottom: var(--bpp-e2); }
.bpp-historico { list-style: none; margin: 0; padding: 0; border-left: .1875rem solid var(--bpp-roxo-100); }
.bpp-historico li { position: relative; padding: 0 0 var(--bpp-e4) var(--bpp-e4); }
.bpp-historico li::before { content: ""; position: absolute; left: -.4375rem; top: .35rem; width: .6875rem; height: .6875rem; border-radius: 50%; background: var(--bpp-roxo-600); }
.bpp-historico small { display: block; color: var(--bpp-tinta-suave); font-size: var(--bpp-t-pequeno); }
.bpp-historico__motivo { color: var(--bpp-tinta-suave); }
.bpp-form-empilhado { display: grid; gap: var(--bpp-e3); max-width: 28rem; margin-top: var(--bpp-e3); }
.bpp-form-empilhado .bpp-campo { margin: 0; }
.bpp-form-linha { display: flex; flex-wrap: wrap; gap: var(--bpp-e2); margin-top: var(--bpp-e2); }
.bpp-form-linha .form-control { flex: 1 1 14rem; }
.bpp-aviso--atencao { background: var(--bpp-atencao-fundo); border-left-color: var(--bpp-atencao-borda); }
.bpp-aviso--atencao .ti { color: var(--bpp-atencao); }
.bpp-aviso h2 { font-size: 1rem; margin: 0 0 var(--bpp-e1); }
.bpp-zona-risco { border-top-color: var(--bpp-perigo-borda); }

/* Formulário do painel (novo/editar): uma coluna, largura confortável */
.bpp-form-aluno { max-width: 38rem; }
.bpp-form-aluno .bpp-bloco:first-of-type { border-top: 0; padding-top: 0; }
.bpp-barra-acoes { display: flex; flex-wrap: wrap; gap: var(--bpp-e3); margin-top: var(--bpp-e6); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Ajustes de densidade da lista de alunos */
.bpp-lista td { white-space: nowrap; }
.bpp-lista td:first-child { white-space: normal; min-width: 11rem; }
.bpp-lista__sub { display: block; font-size: var(--bpp-t-pequeno); color: var(--bpp-tinta-suave); }
.bpp-lista th, .bpp-lista td { padding-inline: var(--bpp-e2); }
.bpp-acoes .btn { flex: 1 1 auto; }
@media (min-width: 576px) { .bpp-acoes .btn { flex: 0 0 auto; } }
@media (max-width: 991.98px) {
  .bpp-lista td { white-space: normal; }
  .bpp-lista td[data-rotulo="Recebida em"] { display: none; }
  .bpp-lista tr { padding: var(--bpp-e3) 0; }
  .bpp-lista__sub { display: inline; margin-left: var(--bpp-e2); }
}

/* Foto do aluno e anexos no cadastro */
.bpp-foto__area { display: flex; gap: var(--bpp-e4); align-items: center; }
.bpp-foto__previa { flex: none; width: 5.5rem; height: 5.5rem; border-radius: 50%; overflow: hidden; background: var(--bpp-roxo-100); border: 2px solid var(--bpp-roxo-300); display: flex; align-items: center; justify-content: center; color: var(--bpp-roxo-500); font-size: 2.5rem; }
.bpp-foto__previa img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bpp-foto__acoes { min-width: 0; }
.bpp-foto__acoes .bpp-ajuda { margin-top: var(--bpp-e2); }
.bpp-foto__remover { color: var(--bpp-perigo); padding-left: 0; }
.bpp-foto__botao:has(+ input:focus-visible), .bpp-anexo label:has(+ input:focus-visible) { outline: .1875rem solid var(--bpp-roxo-500); outline-offset: .125rem; }
.bpp-anexo { margin-top: var(--bpp-e3); }
.bpp-anexo[hidden] { display: none !important; }
.bpp-ajuda--acima { margin: 0 0 var(--bpp-e3); font-size: .9375rem; }

/* Avatar/foto do aluno */
.bpp-avatar { display: inline-flex; align-items: center; justify-content: center; flex: none; border-radius: 50%; overflow: hidden; background: var(--bpp-roxo-100); color: var(--bpp-roxo-500); vertical-align: middle; }
.bpp-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bpp-avatar--sm { width: 2.25rem; height: 2.25rem; font-size: 1.125rem; margin-right: var(--bpp-e2); }
.bpp-avatar--xl { width: 5rem; height: 5rem; font-size: 2.25rem; border: 2px solid var(--bpp-roxo-300); }
.bpp-lista td:first-child { min-width: 13rem; }
.bpp-ficha-id { display: flex; align-items: center; gap: var(--bpp-e4); min-width: 0; }
.bpp-ficha-avatar { flex: none; border-radius: 50%; }
.bpp-foto-atual { display: flex; gap: var(--bpp-e4); align-items: center; margin-bottom: var(--bpp-e6); }
.bpp-foto-atual .bpp-avatar--xl { width: 7rem; height: 7rem; }
.bpp-foto-atual h2 { margin-bottom: var(--bpp-e1); }
.bpp-avatares { border: 0; padding: 0; margin: 0 0 var(--bpp-e5); min-width: 0; }
.bpp-avatares legend { float: none; width: auto; font-size: 1rem; font-weight: 700; margin-bottom: var(--bpp-e3); color: var(--bpp-roxo-900); }
.bpp-avatares__grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr)); gap: var(--bpp-e3); }
.bpp-avatar-opcao { position: relative; display: grid; justify-items: center; gap: var(--bpp-e1); padding: var(--bpp-e2); border: var(--bpp-borda-campo); border-radius: var(--bpp-raio); background: var(--bpp-papel); cursor: pointer; font-size: var(--bpp-t-pequeno); color: var(--bpp-tinta-suave); }
.bpp-avatar-opcao img { width: 4.5rem; height: 4.5rem; border-radius: 50%; object-fit: cover; }
.bpp-avatar-opcao input { position: absolute; top: var(--bpp-e2); left: var(--bpp-e2); width: 1.25rem; height: 1.25rem; accent-color: var(--bpp-roxo-600); }
.bpp-avatar-opcao:has(input:checked) { border-color: var(--bpp-roxo-600); background: var(--bpp-roxo-50); color: var(--bpp-roxo-800); font-weight: 600; }
.bpp-avatar-opcao:has(input:focus-visible) { outline: .1875rem solid var(--bpp-roxo-500); outline-offset: .125rem; }
.bpp-docs { list-style: none; margin: 0 0 var(--bpp-e3); padding: 0; display: grid; gap: var(--bpp-e2); }
.bpp-docs li { display: flex; flex-wrap: wrap; gap: var(--bpp-e2) var(--bpp-e3); justify-content: space-between; align-items: center; padding: var(--bpp-e2) 0; border-bottom: 1px solid var(--bpp-linha); }
.bpp-docs__nome { display: inline-flex; gap: var(--bpp-e2); align-items: center; min-width: 0; overflow-wrap: anywhere; }
.bpp-docs__acoes { display: inline-flex; gap: var(--bpp-e2); }
.bpp-docs__acoes form { margin: 0; }
.bpp-form-termo { max-width: 46rem; }
.bpp-textarea { min-height: 16rem; font-size: 1rem; line-height: 1.5; resize: vertical; }
.bpp-lista--quebra td { white-space: normal; }
.bpp-lista td.bpp-lista__acoes { white-space: normal; text-align: right; }
.bpp-acoes-linha { display: flex; flex-wrap: wrap; gap: var(--bpp-e2); align-items: center; justify-content: flex-end; }
.bpp-acoes-linha form { margin: 0; }
.bpp-acoes-linha .btn { padding-inline: .875rem; }
.bpp-lista__retorno { max-width: 18rem; overflow-wrap: anywhere; }

/* Menu lateral recolhível (desktop). Recolhido: só o emblema e os ícones, com dica ao passar o mouse ou focar. */
.bpp-menu__alternar { flex: none; }
.bpp-seta-expandir { display: none; }
.bpp-dica { position: relative; }
@media (min-width: 992px) {
  .bpp-estrutura .bpp-menu { z-index: 1030; }
  .menu-recolhido .bpp-estrutura { grid-template-columns: 4.75rem minmax(0, 1fr); }
  .menu-recolhido .bpp-estrutura .bpp-menu { overflow: visible; }
  .menu-recolhido .bpp-menu__topo { flex-direction: column; justify-content: flex-start; gap: var(--bpp-e2); padding-inline: 0; }
  .menu-recolhido .bpp-menu__nav { overflow: visible; padding-inline: var(--bpp-e2); }
  .menu-recolhido .bpp-menu__rodape { padding-inline: var(--bpp-e2); }
  .menu-recolhido .bpp-seta-recolher { display: none; }
  .menu-recolhido .bpp-seta-expandir { display: inline-block; }
  /* o texto sai da vista mas continua sendo o nome acessível do link */
  .menu-recolhido .bpp-menu__marca span, .menu-recolhido .bpp-nav__link span {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .menu-recolhido .bpp-usuario { display: none; }
  .menu-recolhido .bpp-nav__link { justify-content: center; padding-inline: 0; }
  .menu-recolhido .bpp-dica::after {
    content: attr(data-rotulo); position: absolute; left: calc(100% + .75rem); top: 50%; transform: translateY(-50%);
    padding: .375rem .75rem; border-radius: .5rem; background: var(--bpp-roxo-900); color: #fff;
    font-size: .875rem; font-weight: 500; line-height: 1.3; white-space: nowrap; letter-spacing: 0;
    box-shadow: 0 .25rem 1rem rgba(46, 13, 41, .25); pointer-events: none;
    opacity: 0; visibility: hidden; transition: opacity .12s ease;
  }
  .menu-recolhido .bpp-dica:hover::after, .menu-recolhido .bpp-dica:focus-visible::after { opacity: 1; visibility: visible; }
}