/* CRM Pro — Custom WP Login Page */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Space+Grotesk:wght@600;700&display=swap');

:root {
  --clr-bg:      #0d0f14;
  --clr-surface: #13161e;
  --clr-border:  #252836;
  --clr-accent:  #4f8ef7;
  --clr-accent2: #7c5cfc;
  --clr-text:    #e8eaf0;
  --clr-muted:   #7b82a0;
}

body.login {
  background-color: var(--clr-bg);
  background-image:
    radial-gradient(ellipse 700px 500px at 20% 10%, rgba(79,142,247,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 500px 400px at 80% 80%, rgba(124,92,252,0.06) 0%, transparent 60%);
  font-family: 'DM Sans', sans-serif;
}

/* Logo area */
#login h1 a {
  background-image: none !important;
  background: linear-gradient(135deg, var(--clr-accent), var(--clr-accent2));
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin: 0 auto;
  box-shadow: 0 8px 24px rgba(79,142,247,0.35);
}

#login h1 a::before {
  content: '📊';
  font-size: 24px;
}

/* Main card */
#loginform,
#lostpasswordform,
#registerform {
  background: var(--clr-surface) !important;
  border: 1px solid var(--clr-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.5) !important;
  padding: 32px 28px !important;
  position: relative;
  overflow: hidden;
}

#loginform::before,
#lostpasswordform::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--clr-accent), var(--clr-accent2));
}

/* Labels */
.login label {
  color: var(--clr-muted) !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  font-family: 'DM Sans', sans-serif !important;
}

/* Inputs */
.login input[type="text"],
.login input[type="password"] {
  background: #1a1e2a !important;
  border: 1px solid var(--clr-border) !important;
  border-radius: 8px !important;
  color: var(--clr-text) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.9375rem !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.login input[type="text"]:focus,
.login input[type="password"]:focus {
  border-color: var(--clr-accent) !important;
  box-shadow: 0 0 0 3px rgba(79,142,247,0.18) !important;
  outline: none !important;
}

/* Submit button */
.wp-core-ui .button-primary {
  background: linear-gradient(135deg, var(--clr-accent), var(--clr-accent2)) !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  padding: 11px 20px !important;
  box-shadow: 0 4px 16px rgba(79,142,247,0.3) !important;
  transition: all 0.2s ease !important;
  text-shadow: none !important;
}

.wp-core-ui .button-primary:hover {
  opacity: 0.9 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 24px rgba(79,142,247,0.4) !important;
}

/* Remember me checkbox */
.login .forgetmenot label {
  color: var(--clr-muted) !important;
}

/* Links */
.login #nav a,
.login #backtoblog a {
  color: var(--clr-muted) !important;
  font-size: 0.8125rem;
  transition: color 0.2s;
}

.login #nav a:hover,
.login #backtoblog a:hover {
  color: var(--clr-accent) !important;
}

/* Error / message boxes */
.login .message,
#login_error {
  background: rgba(244,63,94,0.1) !important;
  border-left: 4px solid #f43f5e !important;
  border-radius: 0 8px 8px 0 !important;
  color: #fda4af !important;
  font-size: 0.875rem !important;
  font-family: 'DM Sans', sans-serif !important;
}

.login .message {
  background: rgba(34,211,165,0.1) !important;
  border-left-color: #22d3a5 !important;
  color: #6ee7b7 !important;
}

/* Container */
#login {
  padding-top: 8vh !important;
  width: 360px !important;
}
