/* admin/login.css - dark theme override */

body { background: #06051A; }

/* Dark form side */
.form-side {
  background: #0d0c24;
  border-left: 1px solid rgba(255,255,255,.07);
}

/* Inputs go dark */
.field input {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.12);
  color: #fff;
}
.field input::placeholder { color: rgba(255,255,255,.25); }
.field input:hover  { border-color: rgba(255,255,255,.22); }
.field input:focus  { border-color: rgba(99,102,241,.6); background: rgba(255,255,255,.08); box-shadow: 0 0 0 3px rgba(99,102,241,.14); }
.field label { color: rgba(255,255,255,.38); }

/* Logo stays white (no invert needed on dark bg) */
.form-logo img { filter: none; }

/* Headings */
.auth-heading { color: #fff; }
.auth-sub     { color: rgba(255,255,255,.45); }

/* Admin badge */
.admin-badge {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(99,102,241,.18); border: 1px solid rgba(99,102,241,.35);
  border-radius: 999px; padding: 5px 13px; margin-bottom: 20px;
  font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: #a5b4fc;
}
.admin-badge::before { content:''; width:6px; height:6px; border-radius:50%; background:#818cf8; flex-shrink:0; }

/* Role pills */
.role-pills { display: flex; gap: 8px; margin-bottom: 22px; }
.role-pill {
  flex: 1; height: 36px; border: 1.5px solid rgba(255,255,255,.1);
  border-radius: 8px; background: transparent; color: rgba(255,255,255,.38);
  font: 600 12px/1 var(--font); cursor: pointer; font-family: var(--font);
  display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: all .18s;
}
.role-pill:hover { border-color: rgba(255,255,255,.25); color: rgba(255,255,255,.7); }
.role-pill.active { background: rgba(99,102,241,.2); border-color: rgba(99,102,241,.5); color: #a5b4fc; }

/* Alert on dark */
.alert-error {
  background: rgba(239,68,68,.1); border-color: rgba(239,68,68,.25);
  color: #fca5a5;
}
.alert-error svg path, .alert-error svg circle { stroke: #fca5a5; }

/* Forgot link on dark */
.forgot-link { color: rgba(165,180,252,.8); }
.forgot-link:hover { color: #a5b4fc; opacity: 1; }

/* Footer note on dark */
.footer-note { color: rgba(255,255,255,.28); }
.footer-note a { color: rgba(165,180,252,.7); }
.footer-note a:hover { color: #a5b4fc; }

/* Divider on dark */
.auth-divider { color: rgba(255,255,255,.25); }
.auth-divider::before, .auth-divider::after { background: rgba(255,255,255,.1); }

/* Security note */
.security-note {
  margin-top: 22px; padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.07);
  display: flex; align-items: flex-start; gap: 9px;
  font-size: 11px; color: rgba(255,255,255,.25); line-height: 1.65;
}
.security-note svg { flex-shrink: 0; margin-top: 1px; }