/* Auth landing pages (verify / reset) — night wash + card that follows site theme */

.auth-page .page-shell {
  background:
    radial-gradient(ellipse at 70% 20%, rgba(255, 123, 2, 0.12), transparent 50%),
    linear-gradient(180deg, #2a1a40 0%, #0e0e14 55%, #050508 100%);
}

html[data-theme="light"] .auth-page .page-shell {
  background:
    radial-gradient(ellipse at 70% 20%, rgba(255, 123, 2, 0.14), transparent 50%),
    linear-gradient(180deg, #fff7ee 0%, #f4efe4 45%, #e8dfd2 100%);
}

.auth-card {
  max-width: 520px;
  margin: 0 auto;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
  /* Dark mode default: charcoal card, not cream paper */
  background: #1c1c22 !important;
  color: #f4efe4;
}

.auth-card h1,
.auth-card p,
.auth-card label {
  color: #f4efe4;
}

.auth-card .auth-footnote {
  color: #c8c0b4;
}

.auth-card-logo {
  background: transparent;
  text-align: center;
  padding: 22px 16px 8px;
}

.auth-card-logo img {
  max-width: 280px;
  width: 70%;
  height: auto;
  display: inline-block;
}

.auth-card h1 {
  margin-top: 0.4em;
}

.auth-card .auth-form input[type="email"],
.auth-card .auth-form input[type="password"],
.auth-card .auth-form input[type="text"] {
  background: #111114;
  color: #f4efe4;
  border: 1px solid #3a3a40;
}

.auth-card .auth-form input::placeholder {
  color: #8a847a;
}

.auth-primary,
.auth-card .paper-btn.auth-primary {
  background: #ff7b02 !important;
  border-color: #ff7b02 !important;
  color: #fff !important;
}

.auth-footnote {
  font-size: 0.95rem;
  opacity: 0.9;
}

.auth-actions-row {
  margin-top: 1.25rem;
}

.auth-status.is-success {
  color: #6dce8b;
}

.auth-status.is-error {
  color: #ff8f8f;
}

/* Light site theme: cream paper card */
html[data-theme="light"] .auth-card {
  background: #f4efe4 !important;
  color: #2a2430;
  box-shadow: 0 16px 40px rgba(42, 36, 48, 0.18);
}

html[data-theme="light"] .auth-card h1,
html[data-theme="light"] .auth-card p,
html[data-theme="light"] .auth-card label {
  color: #2a2430;
}

html[data-theme="light"] .auth-card .auth-footnote {
  color: #4a4650;
}

html[data-theme="light"] .auth-card .auth-form input[type="email"],
html[data-theme="light"] .auth-card .auth-form input[type="password"],
html[data-theme="light"] .auth-card .auth-form input[type="text"] {
  background: #ffffff;
  color: #2a2430;
  border: 1px solid #c8bca8;
}

html[data-theme="light"] .auth-card .auth-form input::placeholder {
  color: #8a847a;
}