/* === Shared Background === */
body.login,
body.wp-core-ui {
  background-color: #f2f2f2;
}

/* === Login + Logout Box Styling === */
body.login #login,
body.wp-core-ui #login {
  width: 400px;
  padding: 40px;
  margin-top: 80px;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  animation: fadeIn 0.6s ease-in-out;
}

/* === Logo (Login + Logout Pages) === */
body.login h1 a,
body.wp-core-ui h1 a {
  background-image: url('https://docs.greyfox.global/wp-content/uploads/2025/09/GFH_management-Site-Logo.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100px;
}

/* === Input Fields (Login Only) === */
body.login input[type="text"],
body.login input[type="password"] {
  border-radius: 6px;
  border: 1px solid #ccc;
  padding: 12px;
}

/* === Login Button === */
body.login .button-primary {
  background-color: #333333;
  border-color: #222222;
  box-shadow: none;
  text-shadow: none;
  border-radius: 6px;
}

/* === Message Banner === */
body.login .message {
  border-left: 4px solid #ff9900;
}

/* === Hide "Back to Site" Link === */
body.login #backtoblog,
body.wp-core-ui #backtoblog {
  display: none;
}

/* === Center & Style Confirmation Text === */
body.login #login p,
body.wp-core-ui #login p {
  font-size: 16px;
  text-align: center;
  color: #333;
}

body.login #login p a,
body.wp-core-ui #login p a {
  color: #333;
  font-weight: bold;
  text-decoration: underline;
}

/* === Fade In Animation === */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.m365-login-btn {
    margin-bottom: 20px !important; /* pushes Turnstile down */
}