/* ===========================================================
   Dark reskin for login.html / signup.html ONLY — scoped entirely
   under .authpage so nothing here touches .field/.btn/.seg etc.
   as used elsewhere (dashboard.html reuses those same base classes
   for its own, still-light, admin forms).

   Brings the auth pages in line with the new dark landing page —
   previously a bright light-blue SaaS panel sat one click after a
   dark cinematic hero, the single biggest visual-consistency gap
   found in the nav/overall audit.
=========================================================== */

.authpage {
  --auth-bg: #06080c;
  --auth-bg-2: #0d1218;
  --auth-fg: #f3f5f7;
  --auth-fg-dim: #8a93a0;
  --auth-line: rgba(243, 245, 247, 0.14);
  background: var(--auth-bg-2);
}

.authpage .side {
  background:
    radial-gradient(120% 85% at 18% 8%, rgba(0, 175, 240, 0.16), transparent 58%),
    radial-gradient(95% 75% at 92% 24%, rgba(255, 77, 103, 0.08), transparent 55%),
    var(--auth-bg);
}
.authpage .side .big { color: var(--auth-fg); }
.authpage .side .sub { color: var(--auth-fg-dim); }
.authpage .side .trust .t { color: var(--auth-fg-dim); }

.authpage .form-side { background: var(--auth-bg-2); }
.authpage .formcard .logo { color: var(--auth-fg); }
.authpage .formcard h1 { color: var(--auth-fg); }
.authpage .formcard .subt { color: var(--auth-fg-dim); }

.authpage .field label { color: var(--auth-fg-dim); }
.authpage .field input,
.authpage .field select {
  background: #10151c;
  border-color: var(--auth-line);
  color: var(--auth-fg);
}
.authpage .field input::placeholder { color: #5a6270; }
.authpage .field input:focus,
.authpage .field select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(0, 175, 240, 0.18);
}

.authpage .seg { background: #10151c; }
.authpage .seg button { color: var(--auth-fg-dim); }
.authpage .seg button.on { background: #1c232c; color: var(--blue); }

.authpage .checkline { color: var(--auth-fg-dim); }
.authpage .checkline a { color: var(--blue); }

.authpage .alt { color: var(--auth-fg-dim); }
.authpage .alt a { color: var(--blue); }

.authpage .btn-soft { background: #1c232c; color: var(--auth-fg); }
.authpage .btn-soft:hover { background: #262e39; }

@media (max-width: 820px) {
  .authpage .form-side { background: var(--auth-bg); }
}