/* Discovery Login Styler - Custom WordPress Login Styles */

/* Reset and base styles */
* {
      box-sizing: border-box;
}

body.login {
      background: linear-gradient(135deg, #f9f9f9 0%, rgba(188, 206, 230, 0.3) 100%);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
      margin: 0;
      padding: 0;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
}

/* Login form container */
.login form {
      background: rgba(255, 255, 255, 0.95);
      backdrop-filter: blur(10px);
      border-radius: 16px;
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
      padding: 40px;
      width: 100%;
      max-width: 400px;
      margin: 0 auto;
      border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Logo styling */
.login h1 {
      text-align: center;
      margin-bottom: 30px;
}

.login h1 a {
      display: block;
      margin: 0 auto;
      transition: transform 0.3s ease;
}

.login h1 a:hover {
      transform: scale(1.05);
}

/* Form fields */
.login form .input,
.login form input[type="text"],
.login form input[type="password"],
.login form input[type="email"] {
      width: 100%;
      padding: 15px 20px;
      border: 2px solid #e1e5e9;
      border-radius: 8px;
      font-size: 16px;
      background: #fff;
      color: #1e293b;
      transition: all 0.3s ease;
      margin-bottom: 20px;
      box-sizing: border-box;
}

.login form .input:focus,
.login form input[type="text"]:focus,
.login form input[type="password"]:focus,
.login form input[type="email"]:focus {
      outline: none;
      border-color: #4e88e8;
      box-shadow: 0 0 0 3px rgba(78, 136, 232, 0.1);
      transform: translateY(-1px);
}

/* Labels */
.login form label {
      display: block;
      margin-bottom: 8px;
      font-weight: 600;
      color: #1e293b;
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 0.5px;
}

/* Submit button */
.login form .submit {
      width: 100%;
      padding: 15px 20px;
      background: linear-gradient(135deg, #4e88e8 0%, #46b4e0 100%);
      border: none;
      border-radius: 8px;
      color: white;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-top: 10px;
}

.login form .submit:hover {
      background: linear-gradient(135deg, #3d7bd8 0%, #3ba3d0 100%);
      transform: translateY(-2px);
      box-shadow: 0 8px 20px rgba(78, 136, 232, 0.3);
}

.login form .submit:active {
      transform: translateY(0);
}

/* Remember me checkbox */
.login form .forgetmenot {
      margin: 20px 0;
}

.login form .forgetmenot label {
      display: flex;
      align-items: center;
      font-weight: 500;
      color: #64748b;
      text-transform: none;
      letter-spacing: normal;
      cursor: pointer;
}

.login form .forgetmenot input[type="checkbox"] {
      margin-right: 8px;
      width: auto;
      height: auto;
}

/* Links */
.login #nav
      text-align: center;
      margin: 20px 0;
}

.login #nav a{
      color: #4e88e8;
      text-decoration: none;
      font-weight: 500;
      transition: color 0.3s ease;
}

.login #nav a:hover{
      color: #3d7bd8;
      text-decoration: underline;
}
/* Hide the "Go to Discovery Content Portal" link */
.login #backtoblog {
      display: none !important;
}

/* Error messages */
.login .message,
.login #login_error {
      background: #fef2f2;
      border: 1px solid #fecaca;
      border-radius: 8px;
      padding: 15px;
      margin-bottom: 20px;
      color: #dc2626;
      font-size: 14px;
      text-align: center;
}

.login .message {
      background: #f0f9ff;
      border-color: #bae6fd;
      color: #0369a1;
}

/* Success messages */
.login .updated {
      background: #f0fdf4;
      border: 1px solid #bbf7d0;
      border-radius: 8px;
      padding: 15px;
      margin-bottom: 20px;
      color: #059669;
      font-size: 14px;
      text-align: center;
}

/* Password reset form */
.login .reset-pass {
      text-align: center;
      margin-top: 20px;
}

/* Custom footer */
.discovery-login-footer {
      text-align: center;
      margin-top: 30px;
	  margin-bottom: 20px;
      color: rgba(23, 23, 23, 0.8);
      font-size: 12px;
}

.discovery-login-footer p {
      margin: 0;
}

/* Responsive design */
@media (max-width: 480px) {
      .login form {
            padding: 30px 20px;
            margin: 20px;
            border-radius: 12px;
      }

      .login h1 a {
            width: 250px !important;
            height: 65px !important;
      }

      .login form .input,
      .login form input[type="text"],
      .login form input[type="password"],
      .login form input[type="email"] {
            padding: 12px 16px;
            font-size: 16px;
            /* Prevent zoom on iOS */
      }

      .login form .submit {
            padding: 12px 16px;
      }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
      .login form {
            background: rgba(30, 41, 59, 0.95);
            border-color: rgba(255, 255, 255, 0.1);
      }

      .login form .input,
      .login form input[type="text"],
      .login form input[type="password"],
      .login form input[type="email"] {
            background: #1e293b;
            border-color: #475569;
            color: #f1f5f9;
      }

      .login form label {
            color: #f1f5f9;
      }

      .login form .forgetmenot label {
            color: #cbd5e1;
      }
}

/* Loading states */
.login form .submit:disabled {
      opacity: 0.6;
      cursor: not-allowed;
      transform: none;
}

/* Focus visible for accessibility */
.login form .input:focus-visible,
.login form input[type="text"]:focus-visible,
.login form input[type="password"]:focus-visible,
.login form input[type="email"]:focus-visible {
      outline: 2px solid #4e88e8;
      outline-offset: 2px;
}

/* Print styles */
@media print {
      .login {
            background: white !important;
      }

      .login form {
            box-shadow: none;
            border: 1px solid #ccc;
      }
}