/* Telas sem nav: login, primeiro acesso, sem acesso — cartão centralizado */

/* Mesmo fundo do lado do acesso na tela de entrada: malha de pontos fraca e
   um clarão atrás do cartão. Quem clica em "criar conta" na entrada não pode
   sentir que caiu noutro site — e cartão sozinho no branco liso parece página
   que não terminou de carregar. */
.auth-tela {
  position: relative;
  isolation: isolate;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: none;
  padding: var(--e4);
  background:
    radial-gradient(60% 45% at 50% 42%, rgba(37, 99, 235, 0.07) 0%, transparent 70%),
    var(--fundo);
}

.auth-tela::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: radial-gradient(currentColor 1px, transparent 1px);
  background-size: 22px 22px;
  color: var(--borda-forte);
  opacity: 0.5;
  -webkit-mask-image: radial-gradient(70% 55% at 50% 45%, transparent 35%, #000 85%);
  mask-image: radial-gradient(70% 55% at 50% 45%, transparent 35%, #000 85%);
}

.auth-card {
  width: 100%;
  max-width: 380px;
  box-shadow: var(--sombra-lg);
}

.auth-card .card-titulo {
  text-align: center;
  margin-bottom: var(--e5);
}

.sem-acesso-icone {
  font-size: 2.5rem;
  text-align: center;
  margin-bottom: var(--e3);
}

.sem-acesso-texto {
  text-align: center;
  color: var(--texto-suave);
  margin-bottom: var(--e5);
}

a.btn {
  text-decoration: none;
  text-align: center;
  display: inline-block;
}

/* Cadastro de empresa tem mais campos que o login — cabe um cartao mais largo */
.auth-card-largo { max-width: 520px; }

/* Aviso de periodo de teste, na barra do topo */
.aviso-teste {
  background: var(--alerta-suave);
  color: var(--alerta);
  border-radius: 99px;
  padding: 0.25rem 0.7rem;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
}