:root{
  --rpm-bg:#0f172a; --rpm-card:#111827; --rpm-text:#e5e7eb; --rpm-border:rgba(255,255,255,.08);
  --rpm-accent:#6366f1; --rpm-accent-2:#8b5cf6; --rpm-danger:#ef4444;
}
@media (prefers-color-scheme: light){
  :root{ --rpm-bg:#f3f4f6; --rpm-card:#ffffff; --rpm-text:#111827; --rpm-border:rgba(0,0,0,.08); }
}
.rpm-login-form-wrap{
  max-width:420px;margin:6rem auto;padding:2rem;color:var(--rpm-text);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));
  backdrop-filter: blur(8px); border:1px solid var(--rpm-border);
  border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.rpm-login-form-wrap h2{margin:0 0 1rem;font-size:1.5rem;}
.rpm-login-error{
  background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.4);
  color:var(--rpm-text); padding:.75rem 1rem;border-radius:12px;margin-bottom:1rem;
}

/* Success messages used on lost password and reset flows */
.rpm-login-success{
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.35);
  color:var(--rpm-text);
  padding:.75rem 1rem;
  border-radius:12px;
  margin-bottom:1rem;
}

/* Place the forgot password and back‑to‑login links on their own line and center them */
.rpm-login-form .rpm-forgot-password,
.rpm-login-form .rpm-back-to-login{
  text-align:center;
  margin-top:.5rem;
}

/* Style the anchor links within the support rows using the accent colour */
.rpm-forgot-password a,
.rpm-back-to-login a{
  color: var(--rpm-accent);
  text-decoration:none;
  font-weight:600;
  transition:opacity .2s ease;
}
.rpm-forgot-password a:hover,
.rpm-back-to-login a:hover{
  opacity:.9;
}
.rpm-login-form label{display:block;font-weight:600;margin-bottom:.375rem}
.rpm-login-form input[type="text"], .rpm-login-form input[type="password"]{
  width:100%;padding:.85rem 1rem;border-radius:12px;border:1px solid var(--rpm-border);
  background:var(--rpm-card); color:var(--rpm-text); outline:none;
  transition:box-shadow .2s ease,border-color .2s ease,transform .05s ease;
}
.rpm-login-form input:focus{
  box-shadow:0 0 0 3px color-mix(in srgb, var(--rpm-accent) 40%, transparent);
  border-color: var(--rpm-accent); transform: translateY(-1px);
}
.rpm-login-form .rpm-remember{display:flex;gap:.5rem;align-items:center}
.rpm-login-form .rpm-login-submit input[type="submit"]{
  width:100%;padding:.95rem 1rem;border-radius:12px;border:1px solid transparent;
  background:linear-gradient(90deg,var(--rpm-accent),var(--rpm-accent-2));
  color:white;font-weight:700;cursor:pointer;transition:transform .08s ease,opacity .2s ease;
}
.rpm-login-form .rpm-login-submit input[type="submit"]:hover{opacity:.95}
.rpm-login-form .rpm-login-submit input[type="submit"]:active{transform:translateY(1px)}
