.login-page{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:100svh;min-height:calc(100vh - env(safe-area-inset-top));
  padding-top:env(safe-area-inset-top);
  padding-bottom:calc(80px + env(safe-area-inset-bottom));
  padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);
  background:url('../imagens/Geral/loginback2.png') center center/cover no-repeat fixed;
}

/* Barra Inferior Fixa */
.barra-inferior {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 35px;
  background-image: url('../imagens/Geral/barrainferior.png');
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  background-color: transparent !important;
  z-index: 2500;
  pointer-events: none;
}
.barra-inferior__corner-left {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 34px;
  width: auto;
  z-index: 2550;
}
.barra-inferior__corner-right {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 34px;
  width: auto;
  z-index: 2550;
}

/* Cartão com vidro, borda dourada e brilho sutil */
.login-page .card{
  width:100%;max-width:444px;min-height:383px;margin:0 12px;
  background:url('../imagens/Views/interface/fundo_login_registro.png') center center/100% 100% no-repeat;
  border:none;
  border-radius:12px;
  padding:60px 25px 35px;
  box-shadow:none;
  position:relative;overflow:hidden;
  animation:fadeIn .6s ease-out;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.login-page .card::before{
  content:none;
}
.login-page .card:hover::before{content:none}

/* Logo */
.login-page .brasilis-logo-container {
  text-align: center;
  margin-bottom: -40px;
  position: relative;
  z-index: 3000;
}
.login-page .brasilis-logo-container img {
  max-width: 280px;
  width: 80%;
  height: auto;
  display: inline-block;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.5));
}

.login-page .logo-container {
  text-align: center;
  margin-bottom: -180px;
  position: relative;
  z-index: 10;
}
.login-page .logo-container img {
  max-width: 180px;
  height: auto;
  display: inline-block;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.5));
}

/* Título */
.login-page .card h1{
  color:#3e2723;font-size:18px;font-weight:700;text-align:center;margin:0 0 0px;letter-spacing:.5px;text-shadow:none
}

/* Campos */
.login-page .field{margin-bottom:5px;position:relative;text-align:center}
.login-page .field-row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  width:85%;
  margin:0 auto 5px;
}
.login-page .field-row .field{
  width:100%;
  margin-bottom:0;
}
.login-page .field-row .field input{
  width:100%;
}
.login-page .field-row .field label{
  width:100%;
}
.login-page .field label{
  display:block;margin-bottom:3px;color:#4e342e;font-weight:600;font-size:11px;text-shadow:none;text-align:left;width:85%;margin-left:auto;margin-right:auto
}
.login-page .field input{
  width:85%;padding:8px 12px;border:2px solid #8d6e63;border-radius:6px;font-size:12px;transition:all .3s cubic-bezier(.4,0,.2,1);background:rgba(255, 248, 225, 0.4);color:#3e2723;backdrop-filter:blur(2px);box-shadow:inset 0 1px 3px rgba(0,0,0,.1);margin:0 auto;display:block
}
.login-page .field input::placeholder{color:rgba(62, 39, 35, 0.6);font-style:italic;font-size:11px}
.login-page .field input:hover{border-color:#6d4c41;background:rgba(255, 248, 225, 0.6)}
.login-page .field input:focus{
  outline:none;border-color:#3e2723;box-shadow:0 0 0 2px rgba(62, 39, 35, 0.1),inset 0 1px 3px rgba(0,0,0,.1);background:rgba(255, 248, 225, 0.8);transform:translateY(-1px)
}

/* Botão Principal (Dourado) */
.login-page .btn {
  width:85%;padding:10px 16px;
  background: linear-gradient(135deg, #cd853f 0%, #daa520 50%, #cd853f 100%);
  color:#2f1b14;
  border:2px solid #8b4513;
  border-radius:6px;
  font-size:13px;font-weight:700;cursor:pointer;
  transition:all .2s ease;
  text-transform:uppercase;letter-spacing:.5px;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.3);
  position:relative;overflow:hidden;margin:0 auto;display:block
}
.login-page .btn:hover {
  background: linear-gradient(135deg, #daa520 0%, #ffd700 50%, #daa520 100%);
  transform: scale(1.05);
}
.login-page .btn:active {
  transform: scale(0.95);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.3);
}

/* Botão Link Externo (Marrom com Efeitos) */
.login-page .muted-outside a {
  width:85%;padding:10px 16px;
  background: linear-gradient(135deg, #8b4513 0%, #a0522d 50%, #8b4513 100%);
  color:#fdf5e6 !important;
  border:2px solid #5d4037 !important;
  border-radius:6px;
  font-size:13px;font-weight:700;cursor:pointer;
  transition:all .2s ease;
  text-transform:uppercase;letter-spacing:.5px;
  box-shadow: inset 0 1px 3px rgba(255,255,255,0.2), 0 2px 4px rgba(0,0,0,0.4) !important;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.8);
  position:relative;overflow:hidden;margin:0 auto;display:block;
  text-decoration: none; /* Para o link */
  text-align: center;
}
.login-page .muted-outside a:hover {
  filter: brightness(1.15);
  transform: scale(1.02);
  border-color: #6d4c41 !important;
  background: linear-gradient(135deg, #a0522d 0%, #bcaaa4 50%, #a0522d 100%) !important;
  box-shadow: inset 0 1px 3px rgba(255,255,255,0.3), 0 4px 8px rgba(0,0,0,0.5) !important;
  text-decoration: none;
}
.muted-outside a:active {
  transform: scale(0.98);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.5);
}

/* Ajustes específicos para o link fora do card */
.muted-outside a {
  width: auto;
  display: inline-block;
  min-width: 150px;
  margin-top: 10px;
  margin-left: 10px; /* Separar do texto se estiver na mesma linha */
}

/* Links */
.login-page a{color:#4e342e;text-decoration:none;font-size:13px;font-weight:600;display:inline-block;padding:6px 12px;border-radius:6px;margin:0 4px;background:rgba(62, 39, 35, 0.05);border:1px solid rgba(62, 39, 35, 0.2);transition:all .3s cubic-bezier(.4,0,.2,1)}
.login-page a:hover{color:#3e2723;background:rgba(62, 39, 35, 0.1);border-color:rgba(62, 39, 35, 0.4);transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}

/* Mensagens */
.login-page .error{background:rgba(220,53,69,.9);backdrop-filter:blur(10px);color:#fff;padding:10px 15px;border-radius:8px;margin-bottom:15px;text-align:center;font-size:13px;font-weight:500;border:1px solid rgba(220,53,69,.5);box-shadow:0 4px 15px rgba(220,53,69,.3),inset 0 1px 0 rgba(255,255,255,.1)}

/* Mensagens fora do card */
.muted-outside {
  text-align: center;
  margin-top: 15px;
  color: #fdf5e6;
  font-weight: 600;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
  font-size: 14px;
}
.muted-outside a {
  color: #ffd700;
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px dashed rgba(255,215,0,0.5);
  transition: all .2s;
}
.muted-outside a:hover {
  color: #fff;
  border-bottom-color: #fff;
  text-shadow: 0 0 5px rgba(255,215,0,0.6);
}

/* Responsividade */
@media (max-height: 800px) {
  /* Ajuste para telas com pouca altura (como laptops 1366x768) */
  .login-page .brasilis-logo-container img {max-width: 250px;}
  .login-page .logo-container img {max-width: 160px;}
  .login-page .brasilis-logo-container {margin-bottom: -35px;}
  .login-page .logo-container {margin-bottom: -160px;}
  
  .login-page .card {
    max-width: 400px;
    padding-top: 60px;
    min-height: 350px;
  }
}

@media (max-width:768px){
  .login-page .card{padding:20px 18px;border-radius:10px}
  .login-page .card h1{font-size:20px;margin-bottom:18px}
}
@media (max-width:480px){
  .login-page .card{max-width:90%;padding:18px 15px; min-height: auto;}
  .login-page .card h1{font-size:18px;margin-bottom:10px}
  .login-page .field{margin-bottom:12px}

  /* Ajuste de logos mobile */
  .login-page .brasilis-logo-container img {max-width: 200px;}
  .login-page .logo-container img {max-width: 130px;}
  .login-page .brasilis-logo-container {margin-bottom: -25px;}
  .login-page .logo-container {margin-bottom: -130px;}
  
  /* Ajuste de padding do card para compensar logo menor */
  .login-page .card {
    padding-top: 45px;
  }
}

@media (max-width:360px){
  .login-page .brasilis-logo-container img {max-width: 160px;}
  .login-page .logo-container img {max-width: 100px;}
  .login-page .brasilis-logo-container {margin-bottom: -20px;}
  .login-page .logo-container {margin-bottom: -100px;}
  
  .login-page .card {
    padding-top: 40px;
    padding-bottom: 20px;
  }
  .login-page .card h1 {font-size: 16px;}
  .login-page .btn {padding: 8px 12px; font-size: 12px;}
}