/* D&A Hauliers — Login page, in the same look as the Operations
   Management System. Loaded only by templates/accounts/login.html. */
.content-wrapper { margin-left: 0 !important; }
.content-wrapper > .watermark { display: none; }

.login-wrap {
  position: fixed; inset: 0; z-index: 1050;
  display: flex; align-items: center; justify-content: center;
  padding: 24px 16px; overflow-y: auto;
  background: linear-gradient(160deg, var(--bg) 0%, var(--bg-2) 100%);
}
.login-watermark {
  position: fixed; top: -7vh; right: 1vw;
  width: min(66vw, 1100px); height: 116vh;
  background: var(--wm-image) no-repeat right center / contain;
  opacity: var(--wm-opacity); pointer-events: none; z-index: 0;
}
.login-card {
  position: relative; z-index: 1;
  width: 100%; max-width: 420px;
  background: var(--surface);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 1px solid var(--border); border-radius: 20px;
  box-shadow: var(--shadow); padding: 34px 32px 30px;
  margin: auto;
}
.login-card .logo { width: 100%; max-width: 330px; height: auto; display: block; margin: 0 auto 20px; }
.login-card .logo-dark { display: none; }
body.dark-mode .login-card .logo-light { display: none; }
body.dark-mode .login-card .logo-dark { display: block; }
.login-card h1 { font-size: 19px; font-weight: 800; text-align: center; margin: 0 0 4px; }
.login-card .sub { text-align: center; color: var(--text); font-weight: 600; margin: 0 0 22px; }

.login-row { margin-bottom: 14px; }
.login-row label { display: block; font-size: 12.5px; font-weight: 800; margin-bottom: 6px; color: var(--text); }
.login-password { position: relative; }
.login-password .form-control { padding-right: 44px; }
.login-toggle-password {
  position: absolute; top: 50%; right: 8px; transform: translateY(-50%);
  width: 32px; height: 32px; border: 0; background: none; border-radius: 8px;
  color: var(--text-muted); display: flex; align-items: center; justify-content: center;
}
.login-toggle-password:hover { background: var(--green-wash); color: var(--green-deep); }

.login-links { display: flex; justify-content: flex-end; margin: -2px 0 14px; }
.login-links a { font-size: 12.5px; font-weight: 700; color: var(--green-deep); text-decoration: none; }
.login-links a:hover { text-decoration: underline; }

.login-button { width: 100%; padding: 12px 18px; font-size: 14.5px; }
.login-alert {
  background: var(--danger-wash); border: 1px solid var(--danger); color: var(--danger);
  border-radius: 12px; padding: 10px 14px; font-weight: 700; font-size: 13px; margin-bottom: 14px;
}
.login-form-message { text-align: center; color: var(--text-muted); font-size: 13px; font-weight: 600;
  margin: 14px 0 0; min-height: 1em; }
.login-form-message:empty { display: none; }
