/* lmex-auth.css — align login/register with lmex.ai design system.
   Tokens pulled from lmex.ai Next.js build (Space Grotesk + navy palette). */

:root {
  --lmex-bg-0:       #080c12;
  --lmex-bg-1:       #0a1018;
  --lmex-bg-2:       #0e1622;
  --lmex-panel:      #1a2840;
  --lmex-panel-hi:   #1e3050;
  --lmex-border:     #1e3050;
  --lmex-text-muted: #7da0bc;
  --lmex-text-dim:   #3d5a72;
  --lmex-text:       #e2eaf4;
  --lmex-brand:      #276fdd;
  --lmex-brand-hi:   #4a8ce8;
  --lmex-teal:       #23b0a8;
  --lmex-success:    #3dd68c;
  --lmex-danger:     #f05252;
}

body,
.auth-page-wrapper,
.auth-page-content,
.card,
.form-control,
.btn,
label,
h1, h2, h3, h4, h5, h6, p, a, span, div {
  font-family: 'Space Grotesk', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}

/* Page background — flat lmex.ai navy, no particle/overlay noise */
body { background-color: var(--lmex-bg-1) !important; color: var(--lmex-text) !important; }

.auth-page-wrapper { background-color: var(--lmex-bg-1); }
.auth-one-bg-position.auth-one-bg,
.auth-one-bg {
  background-image: none !important;
  background-color: var(--lmex-bg-2) !important;
}
.auth-one-bg .bg-overlay { background: transparent !important; opacity: 1 !important; }
/* Soften the swooping SVG shape so it blends with the flat panel below */
.auth-one-bg .shape svg path { fill: var(--lmex-bg-1) !important; }

/* Card */
.auth-page-content .card {
  background-color: var(--lmex-panel) !important;
  border: 1px solid var(--lmex-border) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
  border-radius: 12px;
}

/* Headings + copy */
.auth-page-content .card h5,
.auth-page-content .card .text-primary {
  color: var(--lmex-text) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em;
}
.auth-page-content .card p,
.auth-page-content .card .text-muted,
.auth-page-content .text-white-50 { color: var(--lmex-text-muted) !important; }
.auth-page-content .form-label { color: var(--lmex-text) !important; font-weight: 500 !important; }

/* Inputs */
.auth-page-content .form-control,
.auth-page-content .input-group-text {
  background-color: var(--lmex-bg-2) !important;
  border: 1px solid var(--lmex-border) !important;
  color: var(--lmex-text) !important;
  border-radius: 8px;
  padding: 0.65rem 0.9rem;
}
.auth-page-content .form-control::placeholder { color: var(--lmex-text-dim) !important; }
.auth-page-content .form-control:focus {
  border-color: var(--lmex-brand) !important;
  background-color: var(--lmex-bg-2) !important;
  color: var(--lmex-text) !important;
  box-shadow: 0 0 0 3px rgba(39, 111, 221, 0.25) !important;
}
.auth-page-content .password-addon { color: var(--lmex-text-muted) !important; }
.auth-page-content .form-check-input {
  background-color: var(--lmex-bg-2);
  border-color: var(--lmex-border);
}
.auth-page-content .form-check-input:checked {
  background-color: var(--lmex-brand);
  border-color: var(--lmex-brand);
}
.auth-page-content .form-check-label { color: var(--lmex-text-muted) !important; }

/* Primary CTA (Sign In / Sign Up) — brand blue, not Velzon green */
.auth-page-content .btn-success,
.auth-page-content .btn-primary {
  background-color: var(--lmex-brand) !important;
  border-color: var(--lmex-brand) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  border-radius: 8px;
  padding: 0.7rem 1rem;
  transition: background-color 0.15s ease, transform 0.08s ease;
}
.auth-page-content .btn-success:hover,
.auth-page-content .btn-primary:hover {
  background-color: var(--lmex-brand-hi) !important;
  border-color: var(--lmex-brand-hi) !important;
}
.auth-page-content .btn-success:active,
.auth-page-content .btn-primary:active { transform: translateY(1px); }

/* Links */
.auth-page-content a,
.auth-page-content .text-primary {
  color: var(--lmex-brand) !important;
  text-decoration: none;
}
.auth-page-content a:hover { color: var(--lmex-brand-hi) !important; }

/* Alerts (flash messages) */
.auth-page-content .alert-success {
  background-color: rgba(61, 214, 140, 0.12) !important;
  border-color: rgba(61, 214, 140, 0.3) !important;
  color: var(--lmex-success) !important;
}
.auth-page-content .alert-danger {
  background-color: rgba(240, 82, 82, 0.12) !important;
  border-color: rgba(240, 82, 82, 0.3) !important;
  color: var(--lmex-danger) !important;
}

/* Logo wordmark label under logo image */
.auth-page-content .text-white-50 { color: var(--lmex-text-muted) !important; }

/* Footer */
.auth-page-wrapper .footer .text-muted { color: var(--lmex-text-dim) !important; }