:root {
  --cor-inicio: #757575;
  --cor-alunos: #22a559;
  --cor-associacoes: #d35400;
  --cor-pagamentos: #3498db;
  --cor-resumo: #808000;
  --cor-relatorios: #b8860b;
  --cor-sobre: #7d3c98;
  --vermelho-destaque: #800000;
  --cinza-texto: #6b6b6b;
  --fundo: #ffffff;
  --borda: #e2e2e2;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: 'Segoe UI', Arial, Helvetica, sans-serif;
  background: #f4f4f4;
  color: #222;
}

.barra-titulo {
  background: #000000;
  color: #ffffff;
  text-align: center;
  font-weight: bold;
  letter-spacing: .03em;
  padding: 8px 12px;
  font-size: .95rem;
}

nav.abas {
  display: flex;
  flex-wrap: wrap;
  background: #222;
}

nav.abas .aba {
  position: relative;
  padding: 14px 22px 18px;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  letter-spacing: .04em;
  transition: opacity .15s;
}

nav.abas .aba::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 5px;
  background: transparent;
}

nav.abas .aba:hover { opacity: .85; }

nav.abas .aba.ativa {
  background: #ffffff !important;
  color: #000000 !important;
}

nav.abas .aba.ativa::after {
  background-image: repeating-linear-gradient(
    to right,
    #ff1a1a 0, #ff1a1a 9px,
    #000000 9px, #000000 18px
  );
}

.cor-inicio      { background: var(--cor-inicio); }
.cor-alunos      { background: var(--cor-alunos); }
.cor-associacoes { background: var(--cor-associacoes); }
.cor-pagamentos  { background: var(--cor-pagamentos); }
.cor-resumo      { background: var(--cor-resumo); }
.cor-relatorios  { background: var(--cor-relatorios); color:#fff !important; }
.cor-sobre       { background: var(--cor-sobre); }

main {
  max-width: 1000px;
  margin: 0 auto;
  padding: 16px 16px 40px;
  background: var(--fundo);
  min-height: 80vh;
}

h1 { font-size: 1.4rem; margin-top: 0; }

table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 16px;
}
.tabela-scroll {
  width: 100%;
  overflow-x: auto;
}
th, td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--borda);
  text-align: left;
  font-size: .92rem;
}
th { background: #fafafa; }
tr:hover td { background: #f9f9f9; }

.status-Ativo    { color: #1e7e34; font-weight: bold; }
.status-Atrasado { color: #a05a00; font-weight: bold; }
.status-Inativo  { color: #888; font-weight: bold; }

.barra-acoes {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

input[type=text], input[type=date], input[type=number], input[type=email],
select, textarea {
  padding: 7px 9px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: .95rem;
}

textarea { width: 100%; min-height: 90px; font-family: inherit; }

.btn {
  display: inline-block;
  padding: 8px 16px;
  border-radius: 4px;
  border: none;
  background: #333;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  font-size: .9rem;
}
.btn:hover { background: #111; }
.btn.perigo { background: #a02020; }
.btn.perigo:hover { background: #7a1414; }
.btn.secundario { background: #888; }

.grade-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 700px; }
.grade-form .campo-full { grid-column: 1 / -1; }
.grade-form label { display: block; font-size: .82rem; color: #555; margin-bottom: 4px; }
.grade-form input, .grade-form select, .grade-form textarea { width: 100%; }

.cartoes-resumo { display: flex; gap: 16px; flex-wrap: wrap; margin: 16px 0 24px; }
.cartao {
  flex: 1 1 160px;
  padding: 16px;
  border-radius: 8px;
  color: #fff;
  text-align: center;
}
.cartao .num { font-size: 2rem; font-weight: bold; display: block; }
.cartao.total     { background: #333; }
.cartao.ativos    { background: #1e7e34; }
.cartao.atrasados { background: #a05a00; }
.cartao.inativos  { background: #888; }

/* Início - identidade visual */
.inicio-logo { text-align: center; padding: 14px 0 4px; }
.inicio-logo img { max-width: 140px; }
.inicio-wordmark {
  text-align: center;
  font-size: 1.7rem;
  font-weight: 800;
  letter-spacing: .02em;
  margin-bottom: 14px;
}
.inicio-wordmark .ikga { color: #000; }
.inicio-wordmark .bra { color: #1e7e34; }
.inicio-wordmark .sil { color: #d7ac00; }

.lista-contatos { max-width: 780px; margin: 0 auto; }
.lista-contatos h2 {
  color: var(--vermelho-destaque);
  font-size: .9rem;
  letter-spacing: .06em;
  margin: 14px 0 4px;
}
.linha-contato {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px solid var(--borda);
}
.linha-contato .icone {
  width: 20px; height: 20px;
  border-radius: 5px;
  flex-shrink: 0;
}
.linha-contato .rotulo {
  color: var(--cinza-texto);
  letter-spacing: .05em;
  font-size: .76rem;
  flex: 1;
}
.linha-contato a {
  color: var(--vermelho-destaque);
  font-weight: bold;
  text-decoration: none;
  font-size: .95rem;
}
.linha-contato a:hover { text-decoration: underline; }
.ic-facebook  { background: #3b5998; }
.ic-instagram { background: #c13584; }
.ic-youtube   { background: #ff0000; }
.ic-email     { background: #666; }
.ic-site      { background: #1e7e34; }

.mensagem {
  padding: 10px 14px;
  border-radius: 6px;
  margin-bottom: 16px;
  font-size: .9rem;
}
.mensagem.sucesso { background: #e6f4ea; color: #1e7e34; border: 1px solid #b7dfc2; }
.mensagem.erro     { background: #fbe7e7; color: #a02020; border: 1px solid #f0bcbc; }

.rodape-sobre { margin-top: 30px; color: #555; line-height: 1.7; }

@media print {
  nav.abas, .barra-acoes, .btn { display: none !important; }
  main { max-width: 100%; padding: 0; }
}

@media (max-width: 480px) {
  .barra-titulo { font-size: .72rem; padding: 6px 8px; }
  nav.abas .aba { padding: 10px 12px 14px; font-size: .82rem; }
  main { padding: 10px 10px 24px; }
  .inicio-logo { padding: 8px 0 2px; }
  .inicio-logo img { max-width: 100px; }
  .inicio-wordmark { font-size: 1.3rem; margin-bottom: 8px; }
  .lista-contatos h2 { margin: 10px 0 2px; font-size: .78rem; }
  .linha-contato { padding: 5px 0; gap: 8px; }
  .linha-contato .icone { width: 16px; height: 16px; }
  .linha-contato .rotulo { font-size: .68rem; }
  .linha-contato a { font-size: .84rem; }
}