/* Paleta: azul-tinta institucional + âmbar (referência ao "Jovem Aprendiz" iniciando a carreira) */
:root {
  --tinta: #1c2b4a;
  --tinta-clara: #2e4370;
  --papel: #f6f4ef;
  --papel-cartao: #ffffff;
  --ambar: #c98a3e;
  --sucesso: #3f8f5f;
  --texto: #232323;
  --texto-suave: #6b6b6b;
  --linha: #e2ded4;
  --erro: #a3403a;

  /* Escala de espaçamento (múltiplos de 4px) */
  --espaco-1: 4px;
  --espaco-2: 8px;
  --espaco-3: 12px;
  --espaco-4: 16px;
  --espaco-5: 24px;
  --espaco-6: 32px;

  /* Bordas arredondadas e sombras sutis, reutilizadas em cards/chips */
  --raio-sm: 8px;
  --raio-md: 12px;
  --raio-lg: 16px;
  --sombra-sm: 0 1px 2px rgba(28, 43, 74, 0.06);
  --sombra-md: 0 2px 10px rgba(28, 43, 74, 0.08);
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

body {
  margin: 0;
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  background: var(--papel);
  color: var(--texto);
}

.tela { min-height: 100vh; }

/* ---- Login ---- */

.tela-login {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(160deg, #24406e 0%, var(--tinta) 55%, #142138 100%);
  padding: 24px;
}

@keyframes login-entrada {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Bloco único (painel escuro + card branco) com sombra e cantos
   compartilhados — empilhado no celular, lado a lado a partir de 900px. */
.login-layout {
  width: 100%;
  max-width: 460px;
  display: flex;
  flex-direction: column;
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra-md);
  overflow: hidden;
  animation: login-entrada 280ms ease-out;
}

.login-painel-lateral {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--espaco-3);
  padding: var(--espaco-6) var(--espaco-5);
  background: linear-gradient(135deg, #33578f 0%, var(--tinta) 75%);
  border-bottom: 3px solid var(--ambar);
}

.login-painel-logo-fundo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: var(--raio-md);
  padding: var(--espaco-3) var(--espaco-4);
}

.login-painel-logo {
  height: 56px;
  width: auto;
  display: block;
}

.login-painel-marca {
  margin: 0;
  color: #ffffff;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 600;
  font-size: 12px;
}

@media (min-width: 900px) {
  .login-layout {
    max-width: 940px;
    flex-direction: row;
  }

  .login-painel-lateral {
    flex: 0 0 42%;
    border-bottom: none;
    border-right: 3px solid var(--ambar);
    padding: var(--espaco-6);
  }

  .login-painel-logo-fundo {
    padding: var(--espaco-5) var(--espaco-6);
  }

  .login-painel-logo {
    height: 110px;
  }

  .login-painel-marca {
    letter-spacing: 0.14em;
    font-size: 13px;
  }

  .cartao-login {
    flex: 0 0 58%;
  }
}

.cartao-login {
  width: 100%;
  background: var(--papel-cartao);
  padding: var(--espaco-6) 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.marca {
  margin: 0 0 4px;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tinta-clara);
  font-weight: 600;
}

.cartao-login h1 {
  margin: 0 0 var(--espaco-2);
  font-size: 24px;
  line-height: 1.25;
  font-weight: 700;
  color: var(--tinta);
}

.subtitulo {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 var(--espaco-6);
  font-size: 14px;
  color: var(--texto-suave);
}

.icone-cadeado {
  flex: 0 0 auto;
  color: var(--texto-suave);
}

label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  margin-bottom: 6px;
  color: var(--texto-suave);
}

.campo-com-icone {
  position: relative;
  margin-bottom: var(--espaco-4);
}

.icone-cadeado-input {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--texto-suave);
  pointer-events: none;
}

input[type="password"],
input[type="text"] {
  width: 100%;
  padding: 13px 14px;
  border: 1px solid var(--linha);
  border-radius: var(--raio-md);
  font-size: 15px;
  margin-bottom: var(--espaco-4);
  transition: border-color 200ms ease, box-shadow 200ms ease;
}

#campo-senha {
  padding-left: 44px;
  margin-bottom: 0;
}

input:focus {
  outline: none;
  border-color: var(--tinta-clara);
  box-shadow: 0 0 0 3px rgba(46, 67, 112, 0.15);
}

button[type="submit"] {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: var(--raio-md);
  background: var(--tinta);
  color: white;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}

button[type="submit"]:hover {
  background: var(--tinta-clara);
  transform: translateY(-1px);
  box-shadow: var(--sombra-sm);
}

button[type="submit"]:focus-visible {
  outline: 2px solid var(--ambar);
  outline-offset: 2px;
}

.mensagem-erro {
  color: var(--erro);
  font-size: 13px;
  margin: 10px 0 0;
}

/* entrada pelo Portal (no lugar do antigo campo de senha) */
.aviso-login {
  font-size: 14px;
  color: var(--tinta);
  margin: 0 0 16px;
}
.botao-portal {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 14px;
  border-radius: var(--raio-md);
  background: var(--tinta);
  color: white;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  transition: background-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}
.botao-portal:hover {
  background: var(--tinta-clara);
  transform: translateY(-1px);
  box-shadow: var(--sombra-sm);
}
.botao-portal:focus-visible {
  outline: 2px solid var(--ambar);
  outline-offset: 2px;
}
.botao-portal[hidden] { display: none; }

/* ---- App principal ---- */

.cabecalho {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 28px;
  background: var(--tinta);
}

.cabecalho-logo {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.logo-cabecalho {
  height: 44px;
  width: auto;
  display: block;
}

.marca-central {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 17px;
  font-weight: 700;
  white-space: nowrap;
  pointer-events: none;
}

.cabecalho-direita {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
}

.credito {
  font-size: 12px;
  color: #9aa5bd;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .marca-central { font-size: 13px; }
  .credito { display: none; }
}

.botao-texto {
  background: none;
  border: none;
  color: #cfd6e6;
  font-size: 14px;
  cursor: pointer;
  padding: 4px;
}

.botao-texto:hover { color: white; }

.botao-sair {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: var(--raio-sm);
  padding: 6px 14px;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}

.botao-sair:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.5);
}

.botao-sair:focus-visible {
  outline: 2px solid var(--ambar);
  outline-offset: 2px;
}

.icone-sair {
  flex: 0 0 auto;
}

#botao-voltar {
  color: var(--tinta-clara);
  font-weight: 600;
  margin-bottom: 8px;
}

#botao-voltar:hover { color: var(--tinta); text-decoration: underline; }

.barra-acoes-detalhe {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.botao-baixar {
  background: var(--tinta);
  color: white;
  border: none;
  border-radius: var(--raio-sm);
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

.botao-baixar:hover { background: var(--tinta-clara); }

/* ---- Impressão: mostra só a ficha do aluno, sem menus nem botões ---- */
@media print {
  .cabecalho,
  .painel-busca,
  #botao-voltar,
  .botao-baixar,
  .botao-consolidar-turmas,
  .dica-consolidar,
  #status-consolidar,
  .checkbox-turma {
    display: none !important;
  }
  .cabecalho-impressao {
    display: flex !important;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--tinta);
  }
  .logo-impressao {
    height: 48px;
    width: auto;
  }
  .titulo-impressao {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--tinta);
  }
  .tabela-turmas th:first-child,
  .tabela-turmas td:first-child {
    display: none;
  }
  body { background: white; font-size: 11pt; }
  .painel-detalhe { max-width: none; padding: 0; }
  .bloco {
    break-inside: avoid;
    border: 1px solid #ccc;
    box-shadow: none; /* sombra não serve pra impressão, só polui */
  }
  /* Cabeçalho da tabela repete em cada página, e cada linha nunca quebra
     no meio (fica inteira numa página ou passa pra próxima). */
  thead { display: table-header-group; }
  tr { break-inside: avoid; page-break-inside: avoid; }
  .freq-data-item { break-inside: avoid; }
  /* Nunca depender só da cor pra indicar falta/presença na impressão P&B */
  .freq-data-item.freq-falta { border-width: 2px; }
  .freq-data-item.freq-falta-justificada { border-width: 2px; border-style: dashed; }
}

/* Fora da impressão (tela normal), o cabeçalho de impressão fica
   escondido — ele só existe pra aparecer no PDF gerado pelo "Baixar PDF". */
.cabecalho-impressao {
  display: none;
}

/* ---- Tela de busca: hub de módulos ---- */
/* Container mais largo (1100px, igual às outras telas) preparado pra
   receber novos módulos/relatórios no futuro sem precisar redesenhar o
   layout — a busca fica em destaque, os módulos secundários ficam abaixo. */

.painel-busca {
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px 24px 80px;
}

.painel-detalhe {
  max-width: 1100px;
  margin: 0 auto;
  padding: 32px 24px 80px;
}

@keyframes hub-entrada {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.hub-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}

.busca-destaque {
  width: 100%;
  max-width: 640px;
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra-md);
  padding: 32px 32px 28px;
  animation: hub-entrada 250ms ease-out;
}

.busca-destaque h1 {
  font-size: 22px;
  font-weight: 700;
  color: var(--tinta);
  margin: 0 0 6px;
}

.busca-subtitulo {
  font-size: 14px;
  color: var(--texto-suave);
  margin: 0 0 24px;
}

.campo-busca-wrapper {
  position: relative;
}

.icone-busca {
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--texto-suave);
  pointer-events: none;
}

#campo-busca {
  width: 100%;
  height: 54px;
  padding: 0 16px 0 46px;
  font-size: 16px;
  border: 1px solid var(--linha);
  border-radius: var(--raio-md);
  background: var(--papel-cartao);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

#campo-busca:focus {
  outline: none;
  border-color: var(--tinta-clara);
  box-shadow: 0 0 0 4px rgba(46, 67, 112, 0.15);
}

.status-busca {
  font-size: 13px;
  color: var(--texto-suave);
  min-height: 18px;
  margin: 10px 2px 0;
}

.lista-resultados {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}

.lista-resultados li {
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  border-radius: var(--raio-sm);
  box-shadow: var(--sombra-sm);
  padding: 13px 16px;
  margin-bottom: 8px;
  cursor: pointer;
  font-size: 15px;
  transition: border-color 150ms ease;
}

.lista-resultados li:hover {
  border-color: var(--tinta-clara);
}

.lista-resultados li.selecionado {
  border-color: var(--tinta);
  background: #eef1f8;
  font-weight: 600;
}

/* Área secundária: preparada pra crescer — hoje tem um card (relatório de
   faltas), amanhã pode ganhar mais cards nessa mesma grade sem quebrar. */
.secao-modulos {
  width: 100%;
  max-width: 780px;
  animation: hub-entrada 250ms ease-out 80ms both;
}

.secao-modulos-titulo {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--texto-suave);
  margin: 0 0 12px;
  padding: 0 4px;
}

.lista-cards-modulo {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 640px) {
  .lista-cards-modulo {
    grid-template-columns: repeat(2, 1fr);
  }
}

.card-modulo {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  border-radius: var(--raio-md);
  box-shadow: var(--sombra-sm);
  padding: 16px 18px;
  font-size: 15px;
  font-weight: 600;
  color: var(--texto);
  text-align: left;
  cursor: pointer;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.card-modulo:hover {
  border-color: var(--tinta-clara);
  box-shadow: var(--sombra-md);
  transform: translateY(-1px);
}

.card-modulo:focus-visible {
  outline: 2px solid var(--tinta-clara);
  outline-offset: 2px;
}

.card-modulo-icone {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--raio-sm);
  background: var(--papel);
  color: var(--tinta);
}

.card-modulo-nome {
  flex: 1 1 auto;
}

.card-modulo-seta {
  flex: 0 0 auto;
  color: var(--texto-suave);
}


.painel-relatorio-secao {
  max-width: 1100px;
  margin: 0 auto;
  padding: 32px 24px 80px;
}

.painel-relatorio-secao h1 {
  font-size: 20px;
  color: var(--tinta);
  margin: 20px 0 16px;
}

.botao-voltar-relatorio {
  color: var(--tinta-clara);
  font-weight: 600;
}

.botao-voltar-relatorio:hover {
  color: var(--tinta);
  text-decoration: underline;
}

.linha-filtro-relatorio {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 4px;
}

#campo-mes-relatorio {
  padding: 10px 12px;
  font-size: 15px;
  border: 1px solid var(--linha);
  border-radius: var(--raio-sm);
  background: var(--papel-cartao);
}

.botao-baixar-excel {
  background: var(--sucesso);
  margin-bottom: 14px;
}

.botao-baixar-excel:hover {
  background: #326b48;
}

/* Em telas estreitas, mesmo com o painel largo, deixa a tabela rolar de
   lado em vez de espremer as colunas — nunca quebra o layout. */
.tabela-scroll {
  overflow-x: auto;
}

.tabela-relatorio {
  min-width: 760px;
}

.tabela-relatorio td,
.tabela-relatorio th {
  vertical-align: top;
}

.tabela-relatorio tbody tr:nth-child(even) {
  background: var(--papel);
}

.tabela-relatorio .col-estreita {
  white-space: nowrap;
  width: 1%;
}

.linha-clicavel {
  cursor: pointer;
}

.linha-clicavel:hover {
  background: var(--papel) !important;
}

/* ---- Módulo Certificados: veredito aprovado/reprovado ---- */

.veredicto-certificado {
  border-radius: var(--raio-md);
  padding: 18px 20px;
  margin-bottom: 16px;
  border: 1px solid var(--linha);
}

.veredicto-titulo {
  display: block;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 8px;
}

.veredicto-aprovado {
  background: #eaf5ee;
  border-color: var(--sucesso);
}

.veredicto-aprovado .veredicto-titulo {
  color: var(--sucesso);
}

.veredicto-reprovado {
  background: #fbecea;
  border-color: var(--erro);
}

.veredicto-reprovado .veredicto-titulo {
  color: var(--erro);
}

.veredicto-obs {
  font-size: 13px;
  color: var(--texto-suave);
  margin: 0;
}

.veredicto-resumo-disciplinas {
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 10px 0;
}

.lista-motivos-certificado {
  margin: 0;
  padding-left: 20px;
  font-size: 14px;
}

.lista-motivos-certificado li {
  margin-bottom: 4px;
}

.bloco-diagnostico {
  background: #1c2b4a;
  color: #d7e2f5;
  padding: 16px;
  border-radius: var(--raio-md);
  font-size: 12px;
  line-height: 1.5;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 70vh;
  overflow-y: auto;
}

/* ---- Calendário das turmas: um quadro por turma ---- */

.grade-quadros-turma {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

@media (min-width: 720px) {
  .grade-quadros-turma {
    grid-template-columns: repeat(2, 1fr);
  }
}

.quadro-turma {
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  border-radius: var(--raio-md);
  box-shadow: var(--sombra-sm);
  padding: 16px 18px;
}

.quadro-turma-titulo {
  margin: 0 0 12px;
  font-size: 15px;
  color: var(--tinta);
  border-bottom: 1px solid var(--linha);
  padding-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.etiqueta-status-turma {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 2px 8px;
  border-radius: 999px;
}

.etiqueta-status-ativa {
  background: #eaf5ee;
  color: var(--sucesso);
}

.etiqueta-status-encerrada {
  background: #eee;
  color: var(--texto-suave);
}

.quadro-turma-periodo {
  margin: -6px 0 10px;
  font-size: 12px;
  color: var(--texto-suave);
}

.checkbox-incluir-encerradas {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--texto-suave);
  font-weight: 400;
  margin: 4px 0 14px;
  cursor: pointer;
}

.checkbox-incluir-encerradas input {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--tinta);
}

.area-ano-encerradas {
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid var(--linha);
  border-radius: var(--raio-sm);
  background: var(--papel-cartao);
}

.area-ano-encerradas label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 6px;
}

.area-ano-encerradas select {
  width: 100%;
  max-width: 200px;
  padding: 8px 10px;
  border: 1px solid var(--linha);
  border-radius: var(--raio-sm);
  background: var(--papel);
  color: var(--texto);
  font-size: 14px;
}

.dica-ano-encerradas {
  font-size: 12px;
  color: var(--texto-suave);
  margin: 8px 0 0;
}

.botao-filtro-turma {
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  color: var(--texto);
  padding: 8px 14px;
  border-radius: var(--raio-sm);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}

.botao-filtro-turma:hover {
  border-color: var(--tinta-clara);
}

.botao-filtro-turma-ativo {
  background: var(--tinta);
  border-color: var(--tinta);
  color: white;
}

.tabela-quadro-turma {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.tabela-quadro-turma td,
.tabela-quadro-turma th {
  text-align: left;
  padding: 6px 4px;
  border-bottom: 1px solid var(--linha);
  vertical-align: top;
}

.linha-disciplina-proxima-fim td {
  background: #fbecea;
  color: var(--erro);
  font-weight: 600;
}

.etiqueta-proxima-fim {
  display: inline-block;
  background: var(--erro);
  color: white;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 1px 6px;
  border-radius: 999px;
  margin-left: 6px;
  vertical-align: middle;
}

/* ---- Detalhe do aluno ---- */

.painel-detalhe h2 {
  font-size: 22px;
  color: var(--tinta);
  margin: 20px 0 4px;
}

.linha-turma {
  font-size: 14px;
  color: var(--texto-suave);
  margin: 0 0 16px;
}

.grade-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 24px;
}

.chip-info {
  display: flex;
  flex-direction: column;
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  border-radius: var(--raio-sm);
  padding: 8px 14px;
  min-width: 100px;
}

.chip-rotulo {
  font-size: 11px;
  color: var(--texto-suave);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.chip-valor {
  font-size: 15px;
  color: var(--tinta);
  font-weight: 600;
}

.bloco {
  background: var(--papel-cartao);
  border: 1px solid var(--linha);
  border-radius: var(--raio-md);
  box-shadow: var(--sombra-sm);
  padding: 18px 20px;
  margin-bottom: 16px;
}

.bloco h3 {
  margin: 0 0 12px;
  font-size: 15px;
  color: var(--tinta);
  border-bottom: 1px solid var(--linha);
  padding-bottom: 8px;
}

.titulo-disciplinas-duplicadas {
  margin: 20px 0 6px;
  font-size: 14px;
  color: var(--tinta);
  padding-top: 14px;
  border-top: 1px dashed var(--linha);
}

.bloco table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.bloco table td,
.bloco table th {
  text-align: left;
  padding: 6px 4px;
  border-bottom: 1px solid var(--linha);
}

.vazio {
  font-size: 13px;
  color: var(--texto-suave);
  font-style: italic;
}

.tabela-desempenho-consolidado {
  table-layout: fixed;
}

.tabela-desempenho-consolidado .col-larga-estreita {
  width: 100px;
}

.tabela-desempenho-consolidado .col-centralizada {
  text-align: center;
}

.tabela-desempenho-consolidado td,
.tabela-desempenho-consolidado th {
  font-size: 15px;
  padding: 10px 6px;
}

.observacao-ocorrencia {
  font-size: 12px;
  color: var(--texto-suave);
}

.marca-atual {
  color: var(--ambar);
  font-size: 12px;
  font-weight: 600;
}

.dica-consolidar {
  font-size: 13px;
  color: var(--texto-suave);
  margin: -4px 0 12px;
}

.checkbox-turma {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}

.marcar-turma {
  width: 17px;
  height: 17px;
  cursor: pointer;
  accent-color: var(--tinta);
}

.botao-consolidar-turmas {
  margin-top: 14px;
}

.duas-colunas {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-bottom: 16px;
}

.duas-colunas .bloco {
  margin-bottom: 0;
}

@media (min-width: 720px) {
  .duas-colunas {
    grid-template-columns: 1fr 1fr;
  }
}

.nao-realizada {
  color: var(--texto-suave);
  font-style: italic;
  font-size: 13px;
}

/* ---- Frequência: linha do tempo (item novo, isolado do resto) ---- */

.linha-tempo {
  position: relative;
  padding-left: 20px;
  border-left: 2px solid var(--linha);
}

.linha-tempo-item {
  position: relative;
  padding-bottom: 14px;
}

.linha-tempo-item:last-child {
  padding-bottom: 0;
}

.linha-tempo-ponto {
  position: absolute;
  left: -25px;
  top: 3px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 2px solid var(--papel-cartao);
}

.linha-tempo-item.presenca .linha-tempo-ponto {
  background: var(--sucesso);
}

.linha-tempo-item.falta .linha-tempo-ponto {
  background: var(--erro);
}

.linha-tempo-conteudo {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 14px;
}

.linha-tempo-data {
  font-weight: 600;
  color: var(--tinta);
  min-width: 70px;
}

.linha-tempo-disciplina {
  color: var(--texto);
}

.linha-tempo-situacao {
  margin-left: auto;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.linha-tempo-item.presenca .linha-tempo-situacao {
  color: var(--sucesso);
}

.linha-tempo-item.falta .linha-tempo-situacao {
  color: var(--erro);
}

.frequencia-lista {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px var(--espaco-5);
}

@media (min-width: 640px) {
  .frequencia-lista { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 900px) {
  .frequencia-lista { grid-template-columns: repeat(4, 1fr); }
}

.frequencia-disciplina {
  min-width: 0; /* deixa o grid encolher a coluna sem estourar o card */
}

.frequencia-disciplina-cabecalho {
  margin-bottom: 6px;
}

.frequencia-disciplina-nome {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 12px;
  font-weight: 600;
  color: var(--tinta);
  line-height: 1.3;
}

.frequencia-disciplina-faltas {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--erro);
  margin-top: 2px;
}

.freq-datas {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
}

.freq-data-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid var(--linha);
  border-radius: var(--raio-sm);
  padding: 3px 5px;
}

.freq-data-item .freq-data-dia {
  font-size: 10px;
  color: var(--texto-suave);
  white-space: nowrap;
}

.freq-data-item .freq-data-marca {
  font-size: 12px;
  font-weight: 700;
}

.freq-data-item.freq-presenca .freq-data-marca {
  color: var(--sucesso);
}

.freq-data-item.freq-falta {
  border-color: var(--erro);
}

.freq-data-item.freq-falta .freq-data-marca {
  color: var(--erro);
}

.freq-data-item.freq-falta-justificada {
  border-color: var(--ambar);
}

.freq-data-item.freq-falta-justificada .freq-data-marca {
  color: var(--ambar);
}

.freq-data-item.freq-futura {
  opacity: 0.55;
}

.freq-data-item.freq-futura .freq-data-marca {
  color: var(--texto-suave);
}

.freq-resumo {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--espaco-3);
  margin-top: var(--espaco-5);
  padding-top: var(--espaco-4);
  border-top: 1px solid var(--linha);
}

@media (min-width: 520px) {
  .freq-resumo { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 760px) {
  .freq-resumo { grid-template-columns: repeat(5, 1fr); }
}

.freq-resumo-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--espaco-3);
  background: var(--papel);
  border-radius: var(--raio-sm);
}

.freq-resumo-valor {
  font-size: 20px;
  font-weight: 700;
  color: var(--tinta);
}

.freq-resumo-rotulo {
  font-size: 11px;
  color: var(--texto-suave);
  margin-top: 2px;
}

.freq-resumo-presenca .freq-resumo-valor { color: var(--sucesso); }
.freq-resumo-falta .freq-resumo-valor { color: var(--erro); }
.freq-resumo-justificada .freq-resumo-valor { color: var(--ambar); }