/*-----------------------------------------------------------------------------------*/
/* Kilwins – Custom wp-login.php styles */
/*-----------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------*/
/* Variables */
/*-----------------------------------------------------------------------------------*/
:root {
  --kilwins-chocolate: #5c4033;
  --kilwins-chocolate-light: #7d5a47;
  --kilwins-cream: #faf6f0;
  --kilwins-cream-dark: #f0e9df;
  --kilwins-gold: #b8860b;
  --kilwins-brown-text: #4a3728;
  --kilwins-form-bg: rgba(255, 248, 240, 0.97);
  --kilwins-shadow: 0 4px 24px rgba(92, 64, 51, 0.12);
  --kilwins-radius: 8px;
}

/*-----------------------------------------------------------------------------------*/
/* Page background */
/*-----------------------------------------------------------------------------------*/
body.login {
  background: linear-gradient(160deg, #faf6f0 0%, #f0e9df 40%, #e8ddd0 100%);
  background-attachment: fixed;
}

/*-----------------------------------------------------------------------------------*/
/* Logo */
/*-----------------------------------------------------------------------------------*/
.login h1 a {
  width: 140px;
  height: 140px;
  background-size: 140px 140px;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 50%;
  box-shadow: var(--kilwins-shadow);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.login h1 a:hover {
  transform: scale(1.03);
  box-shadow: 0 6px 28px rgba(92, 64, 51, 0.18);
}

/*-----------------------------------------------------------------------------------*/
/* Login container */
/*-----------------------------------------------------------------------------------*/
#login {
  width: 380px;
  padding-top: 8%;
}

/*-----------------------------------------------------------------------------------*/
/* Form panel */
/*-----------------------------------------------------------------------------------*/
.login #loginform {
  border-radius: var(--kilwins-radius);
  background: var(--kilwins-form-bg);
  border: 1px solid rgba(92, 64, 51, 0.12);
  box-shadow: var(--kilwins-shadow);
  padding: 28px 26px 24px;
}

.login #loginform label {
  color: var(--kilwins-brown-text);
  font-weight: 600;
}

/*-----------------------------------------------------------------------------------*/
/* Inputs */
/*-----------------------------------------------------------------------------------*/
.login #loginform input[type="text"],
.login #loginform input[type="password"] {
  border: 1px solid rgba(92, 64, 51, 0.2);
  border-radius: 6px;
  background: #fff;
  color: var(--kilwins-brown-text);
  padding: 10px 12px;
  font-size: 15px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.login #loginform input[type="text"]:focus,
.login #loginform input[type="password"]:focus {
  border-color: var(--kilwins-chocolate);
  box-shadow: 0 0 0 2px rgba(92, 64, 51, 0.15);
  outline: none;
}

/*-----------------------------------------------------------------------------------*/
/* Submit button */
/*-----------------------------------------------------------------------------------*/
.login #loginform input[type="submit"] {
  background: var(--kilwins-chocolate) !important;
  border: none !important;
  border-radius: 6px;
  color: #fff !important;
  font-weight: 600;
  padding: 4px 20px;
  font-size: 15px;
  text-shadow: none;
  box-shadow: 0 2px 8px rgba(92, 64, 51, 0.3);
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.login #loginform input[type="submit"]:hover {
  background: var(--kilwins-chocolate-light) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(92, 64, 51, 0.35);
}

.login #loginform input[type="submit"]:active {
  transform: translateY(0);
}

/*-----------------------------------------------------------------------------------*/
/* Links */
/*-----------------------------------------------------------------------------------*/
.login #nav a,
.login #backtoblog a {
  color: var(--kilwins-chocolate) !important;
  text-decoration: none;
  transition: color 0.2s ease;
}

.login #nav a:hover,
.login #backtoblog a:hover {
  color: var(--kilwins-chocolate-light) !important;
  text-decoration: underline;
}

/*-----------------------------------------------------------------------------------*/
/* Messages */
/*-----------------------------------------------------------------------------------*/
.login .message,
.login .success {
  border-left-color: var(--kilwins-chocolate);
  background: var(--kilwins-cream);
  border-radius: 6px;
}

.login .login-error {
  border-left-color: #c0392b;
  border-radius: 6px;
}

/*-----------------------------------------------------------------------------------*/
/* reCAPTCHA */
/*-----------------------------------------------------------------------------------*/
.g-recaptcha {
  margin-bottom: 16px;
}
