/**
 * Estilos solo para la página de login.
 * Se carga después de estilos.css para tener prioridad.
 */

/* Reset y contenedor principal en login */
body.login-page {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 24px !important;
  background: linear-gradient(145deg, #1A2F5E 0%, #1D6FA4 50%, #2E9DC5 100%) !important;
  background-attachment: fixed !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  color: #1A202C !important;
}

body.login-page .login-wrap {
  width: 100% !important;
  max-width: 400px !important;
  margin: 0 auto !important;
  flex-shrink: 0 !important;
}

body.login-page .login-card {
  background: #fff !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 50px rgba(0,0,0,.25) !important;
  padding: 36px 32px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

body.login-page .login-logo {
  text-align: center !important;
  margin-bottom: 28px !important;
}

body.login-page .login-logo-img {
  display: block !important;
  max-width: 120px !important;
  height: auto !important;
  margin: 0 auto 14px !important;
  border-radius: 8px !important;
  background: #F4F6F9 !important;
}

body.login-page .login-logo h1 {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #1A2F5E !important;
  margin: 0 0 4px !important;
}

body.login-page .login-logo p {
  font-size: 13px !important;
  color: #5D6D7E !important;
  margin: 0 !important;
}

body.login-page .login-form {
  width: 100% !important;
  display: block !important;
}

body.login-page .login-form .form-group {
  margin-bottom: 18px !important;
}

body.login-page .login-form label {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #4A5568 !important;
  margin-bottom: 6px !important;
}

body.login-page .login-form input[type="email"],
body.login-page .login-form input[type="password"] {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 12px 14px !important;
  border: 2px solid #E2E8F0 !important;
  border-radius: 10px !important;
  font-family: inherit !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}

body.login-page .login-form input:focus {
  outline: none !important;
  border-color: #1D6FA4 !important;
}

body.login-page .login-form .btn-block {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 8px 0 0 !important;
  padding: 14px 20px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
  border: none !important;
  background: #1D6FA4 !important;
  color: #fff !important;
  cursor: pointer !important;
  font-family: inherit !important;
}

body.login-page .login-form .btn-block:hover {
  background: #1A2F5E !important;
}

body.login-page .login-error {
  display: block !important;
  background: #FDEDEC !important;
  color: #922B21 !important;
  padding: 12px 14px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  margin-bottom: 18px !important;
  border: 1px solid rgba(146,43,33,.2) !important;
}

@media (max-width: 480px) {
  body.login-page {
    padding: 16px !important;
  }
  body.login-page .login-card {
    padding: 28px 24px !important;
  }
}
