:root {
  --marinho: #0b2545;
  --azul: #13508f;
  --fundo: #f7f7f5;
  --texto: #1d2733;
  --foco: #b45309;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--fundo);
  color: var(--texto);
  font: 1rem/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

a { color: var(--azul); }

a:focus-visible, button:focus-visible {
  outline: 3px solid var(--foco);
  outline-offset: 2px;
}

.pular { position: absolute; left: -999px; }
.pular:focus { left: 0.5rem; top: 0.5rem; background: #fff; padding: 0.5rem; z-index: 10; }

.topo { background: var(--marinho); color: #fff; }
.topo .linha {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 1rem; max-width: 72rem; margin: 0 auto; padding: 0.75rem 1rem;
}
.topo a { color: #fff; text-decoration: none; }
.marca { font-weight: 700; font-size: 1.25rem; }
.marca .instituicao { font-weight: 400; font-size: 1rem; opacity: 0.85; margin-left: 0.5rem; }
.menu { display: flex; align-items: center; gap: 1rem; }
.menu form { margin: 0; }
.sair { background: var(--azul); color: #fff; border: 0; border-radius: 4px; padding: 0.4rem 0.9rem; cursor: pointer; font: inherit; }

.pagina { max-width: 72rem; margin: 0 auto; padding: 1.5rem 1rem; }
.mensagens { list-style: none; padding: 0; }
.mensagens li, .aviso { border-left: 4px solid var(--azul); background: #fff; padding: 0.6rem 0.9rem; margin: 0 0 0.75rem; }
.botao { background: var(--azul); color: #fff; border: 0; border-radius: 4px; padding: 0.6rem 1.2rem; font: inherit; cursor: pointer; }

.tabela { border-collapse: collapse; width: 100%; background: #fff; margin: 0 0 1rem; }
.tabela th, .tabela td { border: 1px solid #d5dae1; padding: 0.4rem 0.6rem; text-align: left; vertical-align: top; }
.tabela thead th { background: var(--marinho); color: #fff; }
.tabela .num { text-align: right; }
.tabela tr.grupo th { background: #e4ebf3; color: var(--marinho); }
.tabela tr.cursada td { color: #4b5563; }
.tabela input[type="text"], .tabela input[type="number"] { width: 100%; font: inherit; }
.tabela .acoes { white-space: nowrap; }
.busca { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; margin: 0 0 1rem; }
.busca .botao, .botao { text-decoration: none; display: inline-block; }
.paginacao { display: flex; gap: 1rem; align-items: center; margin: 1rem 0; }
.erro { display: block; color: #9b1c1c; font-size: 0.9rem; }
.erro ul { margin: 0.25rem 0; padding-left: 1.2rem; }
.formulario input[type="text"], .formulario input[type="number"], .formulario select { font: inherit; min-width: 18rem; max-width: 100%; }
.ficha { display: grid; grid-template-columns: max-content 1fr; gap: 0.2rem 1rem; }
.ficha dt { font-weight: 600; }
.ficha dd { margin: 0; }
.menu a[aria-current="page"] { border-bottom: 2px solid #fff; }
.rotulo-oculto { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Grade de oferta por curso e turno */
.rolagem { overflow-x: auto; margin: 0 0 1rem; }
.rolagem .tabela { margin: 0; width: auto; min-width: 100%; }
.tabela .centro, .tabela td.centro { text-align: center; vertical-align: middle; }
.grade td.sit-prevista { background: #e3f0e6; }
.grade td.sit-antecipavel { background: #fdf1d6; }
.grade td.sit-pendente { background: #e6eaf2; }
.legenda .sit-prevista { background: #e3f0e6; padding: 0 0.35rem; }
.legenda .sit-antecipavel { background: #fdf1d6; padding: 0 0.35rem; }
.legenda .sit-pendente { background: #e6eaf2; padding: 0 0.35rem; }
.cursada { color: #4b5563; font-style: italic; }

/* Quadro semanal da grade */
.quadro { table-layout: fixed; min-width: 56rem; }
.quadro th[scope="row"] { width: 8rem; white-space: nowrap; background: #e4ebf3; color: var(--marinho); }
.quadro .horario { font-weight: 400; font-size: 0.85rem; }
.quadro td.celula { font-size: 0.9rem; }
.quadro .itens { list-style: none; margin: 0; padding: 0; }
.quadro .itens li { margin: 0 0 0.4rem; }
.quadro .detalhe { display: block; font-size: 0.8rem; color: #4b5563; }
.quadro .marca { display: block; font-size: 0.8rem; margin-top: 0.25rem; font-weight: 600; }
.quadro td.conflito { background: #fbe3e3; border-left: 4px solid #9b1c1c; }
.quadro td.conflito .marca { color: #9b1c1c; }
.quadro td.aviso { background: #fdf1d6; border-left: 4px solid var(--foco); margin: 0; }
.quadro td.aviso .marca { color: #7a3b05; }
.quadro .indisponivel { display: block; font-size: 0.8rem; font-style: italic; color: #4b5563; }
.quadro a.alocar { display: block; font-size: 0.8rem; margin-top: 0.25rem; }
.em-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0; }
.lista-simples { list-style: none; padding: 0; }
.lista-simples li { margin: 0 0 0.75rem; }
