/* ==========================================================================
   Página agregadora — a lista dos testes da disciplina
   Disciplina de Oncologia · FCM · UERJ

   Complementa o estilo.css, que é COPIADO SEM ALTERAÇÃO das páginas de teste.
   As variáveis (--marca, --borda, --raio…) vêm de lá; aqui só existe o que a
   lista precisa e que as páginas de prova não têm. Manter essa separação é o
   que permite atualizar o estilo.css de todas as páginas de uma vez só.
   ========================================================================== */

.lista-testes {
  list-style: none;
  margin: 0 0 3rem;
  padding: 0;
  display: grid;
  gap: 1rem;
}

/* O cartão inteiro é o link — alvo grande, que funciona bem no celular. */
.teste {
  display: block;
  padding: 1.5rem 1.6rem;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-left: 4px solid var(--marca);
  border-radius: var(--raio);
  box-shadow: var(--sombra);
  color: inherit;
  text-decoration: none;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}

.teste:hover,
.teste:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(27, 36, 34, .08), 0 14px 32px rgba(27, 36, 34, .09);
}

.teste:focus-visible { outline: 3px solid var(--marca); outline-offset: 3px; }

.teste__aula {
  display: block;
  margin-bottom: .3rem;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tinta-suave);
}

.teste__titulo {
  margin: 0 0 .5rem;
  font-size: clamp(1.2rem, 3.2vw, 1.45rem);
  font-weight: 600;
  line-height: 1.25;
  color: var(--marca);
}

.teste__descricao {
  margin: 0 0 .9rem;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--tinta-suave);
}

.teste__rodape {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .9rem;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: .8125rem;
  color: var(--tinta-suave);
}

.teste__selo {
  padding: .2rem .6rem;
  background: var(--marca-clara);
  border-radius: 999px;
  font-weight: 600;
  color: var(--marca);
}

/* A seta só se move no hover do cartão inteiro — reforça que o alvo é o
   cartão, não um "leia mais" escondido no canto. */
.teste__seta {
  margin-left: auto;
  font-weight: 700;
  color: var(--marca);
  transition: transform .15s;
}

.teste:hover .teste__seta { transform: translateX(3px); }

@media (prefers-reduced-motion: reduce) {
  .teste, .teste__seta { transition: none; }
  .teste:hover { transform: none; }
}

/* ===================================================== CARTÃO DO ENAMED ==== */
/* Fica em primeiro na lista e precisa se distinguir dos testes de aula sem
   quebrar a família visual: mesma forma, peso diferente. */

.teste--enamed {
  border-left-width: 6px;
  background: linear-gradient(135deg, var(--marca-clara), var(--superficie) 62%);
}

.teste__aula--destaque { color: var(--marca); }

.teste__selo--destaque {
  background: var(--marca);
  color: var(--superficie);
}

@media (prefers-color-scheme: dark) {
  .teste__selo--destaque { color: #0d1514; }
}