/* /login page — minimal, dark, consistent with the dashboard shell.
 * Reuses the design tokens from /styles.css; no color/spacing values are
 * hardcoded outside of the centering layout below. */

body {
  margin: 0;
  font-family: var(--sans);
  background: var(--bg);
  color: var(--fg);
}

.login-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-card {
  width: 100%;
  max-width: 400px;
  padding: 32px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

.login-brand {
  font-size: 1.05rem;
  font-weight: 600;
  text-align: center;
  margin-bottom: 24px;
  color: var(--fg-muted);
}

/* FIX E — "no organization" dead-end + FIX F(2) "sign-in unavailable"
 * messages, both rendered inside #clerk-sign-in in place of the widget. */
.login-message {
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--fg-muted);
  text-align: center;
  margin: 0 0 20px;
}

.login-signout-btn {
  display: block;
  margin: 0 auto;
}