/* ===== Login (clean + responsive) ===== */

#loginCard{
  padding: 14px;
}

#loginCard .login-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: end;
}

#loginCard .lf label{
  display: block;
  margin: 0 0 6px;
  font-size: 12px;
}

#loginCard .lf input{
  width: 100% !important;
  min-width: 0;
  height: 42px;
}

#loginCard #btnLogin{
  height: 42px;
  width: 100%;
}

/* tablet/desktop: inline fields + fixed button width */
@media (min-width: 720px){
  #loginCard .login-grid{
    grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) 120px;
    column-gap: 12px;
  }

  #loginCard #btnLogin{
    width: 120px;
    justify-self: end;
  }
}

/* wide desktop: don’t let inputs stretch too much */
@media (min-width: 1100px){
  #loginCard .login-grid{
    grid-template-columns: 360px 360px 120px;
    justify-content: start;
  }
}

.pw-wrap{ display:flex; gap:8px; align-items:center; }
.pw-wrap input{ flex:1; }
.pw-eye{
  height:42px; min-width:44px;
  border:1px solid rgba(255,255,255,.15);
  background: rgba(0,0,0,.25);
  color:#e5e7eb; border-radius:10px;
  cursor:pointer;
}

/* Navbar */
.navbar .nav-link { font-weight: 500; }
.navbar .nav-link:hover { opacity: .85; }

.nav-login-icon { color:#111; opacity:.85; transition: .15s ease; }
.nav-login-icon:hover { opacity:1; transform: translateY(-1px); }
.nav-login-icon i { line-height: 1; }

/* FIX: mobile/landscape login modal must fit the viewport and keep button reachable */
#adminLoginModal.show{
  align-items: flex-start !important;   /* was center; center hides footer on small heights */
  padding-top: .5rem;
  padding-bottom: env(safe-area-inset-bottom);
}

#adminLoginModal .modal-dialog{
  width: min(520px, calc(100% - 1rem)) !important;
  max-width: min(520px, calc(100% - 1rem)) !important;
  margin: .5rem auto !important;

  max-height: calc(100dvh - 1rem);
}

#adminLoginModal .modal-content{
  max-height: calc(100dvh - 1rem);
  display: flex;
  flex-direction: column;
}

#adminLoginModal .modal-body{
  flex: 1 1 auto;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

#adminLoginModal .modal-footer{
  position: sticky;
  bottom: 0;
  background: #fff;
  padding-bottom: calc(.75rem + env(safe-area-inset-bottom));
}