/* === Modern WP Login Styles === */

body.login {
  background: #062252;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  background-image:url('../images/WaveBackground.svg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: bottom right;
}
.login label:not(:last-child) {
    font-size: 16px;
    font-weight: 700;
    color: #062252;
}

/* Center the login form nicely */
#login {
  width: 360px;
  padding: 2.5rem 2rem 2rem;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}
.login form{
    border:none;
    padding:0px;
    box-shadow: none;
}

/* Logo */
.login h1 a {
  background-image: url('../images/Login.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 50px;
  margin-bottom: 1rem;
}

/* Input fields */
#loginform input[type="text"],
#loginform input[type="password"],
#lostpasswordform input[type="text"],
#resetpassform input[type="password"] {
  border-radius: 6px;
  border: 1px solid #ccc;
  padding: 10px 12px;
  width: 100%;
  font-size:18px;
  transition: border-color 0.2s, box-shadow 0.2s;
}

#loginform input:focus,
#lostpasswordform input:focus,
#resetpassform input:focus {
  border-color: #0057ff;
  box-shadow: 0 0 0 2px rgba(0, 87, 255, 0.15);
}

/* Login button */
.wp-core-ui .button-primary {
  background: #062252;
  border: none;
  border-radius: 6px;
  box-shadow: 0 3px 10px rgba(0, 87, 255, 0.25);
  text-shadow: none;
  transition: all 0.2s ease-in-out;
  width:100%;
  margin-top:1em;
  font-weight:700;
  text-transform: uppercase;
  font-size:16px;
}

.wp-core-ui .button-primary:hover {
  background: #0043cc;
  box-shadow: 0 4px 14px rgba(0, 67, 204, 0.35);
  transform: translateY(-1px);
}

/* Links */
.login #nav{
    padding:0px;
}
.login #nav a{
  color: #555;
  text-decoration: none;
  transition: color 0.2s;
}

.login #nav a:hove{
  color: #0057ff;
}
.login #backtoblog{
    display: none;
}

/* Subtle fade-in animation */
body.login #login {
  animation: fadeInUp 1.5s ease forwards;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}