/* =========================================================
   ZimmerSistema · LOGIN
   ---------------------------------------------------------
   Objetivo: oferecer um login elegante e refinado,
   visualmente consistente com o restante do sistema.

   - Sem estilos inline
   - Responsivo
   - Contraste e acessibilidade
========================================================= */

.zs-login{
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;

  /* fundo premium (gradiente + luz suave) */
  background:
    radial-gradient(1200px 800px at 20% 10%, rgba(255,255,255,.16), rgba(255,255,255,0) 55%),
    radial-gradient(900px 600px at 85% 30%, rgba(255,255,255,.10), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #0b2342 0%, #0f3a58 45%, #2a6b7a 100%);
}

/* textura sutil, sem poluir */
.zs-login::before{
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .35;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(255,255,255,.18) 1px, transparent 0);
  background-size: 22px 22px;
  mix-blend-mode: overlay;
}

.zs-login__wrap{
  width: 100%;
  max-width: 460px;
}

.zs-login__card{
  position: relative;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 18px;
  box-shadow: 0 22px 55px rgba(0,0,0,.25);
  padding: 26px 26px 18px;
  padding-top: 26px; /* se hoje estiver maior */
}

.zs-login__brand{
  display: grid;
  justify-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.zs-login__mark{
  width: 54px;
  height: auto;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.10));
}

.zs-login__wordmark{
  width: min(340px, 100%);
  height: auto;
}

.zs-login__subtitle{
  margin: 0 0 16px 0;
  text-align: center;
  color: rgba(33,37,41,.75);
  font-size: .95rem;
}

/* inputs */
.zs-login__input .input-group-text{
  background: #f4f6f9;
  border-color: #e6e9ef;
  color: rgba(33,37,41,.65);
}

.zs-login__input .form-control{
  border-color: #e6e9ef;
}

.zs-login__input .form-control:focus{
  border-color: rgba(var(--zs-primary-rgb), .55);
  box-shadow: 0 0 0 .2rem rgba(var(--zs-primary-rgb), .18);
}

/* botão */
.zs-login__btn{
  border-radius: 12px;
  padding: 10px 12px;
  font-weight: 600;
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

.zs-login__btn:hover{
  transform: translateY(-1px);
}

.zs-login__btn:active{
  transform: translateY(0);
}

.zs-login__footer{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(15, 23, 42, .08);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: .78rem;
  color: rgba(15, 23, 42, .55);
  letter-spacing: .2px;
}

.zs-login__footer .zs-sep{
  margin: 0 .35rem;
  color: rgba(15, 23, 42, .35);
}

/* mobile */
@media (max-width: 420px){
  .zs-login{
    padding: 16px;
  }
  .zs-login__card{
    padding: 22px 18px 16px;
  }
  .zs-login__mark{
    width: 48px;
  }
}

.zs-brand-lockup{
  width: clamp(240px, 32vw, 320px); /* antes costuma ficar grande demais */
  height: auto;
  display: block;
  margin: 0 auto 12px;
}