/*
 * Club Locker brand overrides for the login page.
 * Loaded only when no custom/white-label stylesheet is active.
 * Intentionally uses raw values (not CSS custom properties) so this
 * file is fully self-contained — the login page does not load
 * _brand-tokens.scss.
 */

/* ── Fonts ─────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&family=Funnel+Sans:ital,wght@0,300..800;1,300..800&display=swap');

body.login-screen {
  font-family: 'Funnel Sans', 'Roboto', 'Arial', sans-serif;
  background-color: #fff8ee; /* brand-court */
}

/* ── Navbar / login form bar ───────────────────────────────────── */

.login-screen .navbar {
  background: white;
}

.login-screen .navbar a {
  color: #060e27; /* brand-dark-night */
}

.login-screen .navbar .popover a {
  color: #243a82; /* brand-mid-navy */
}

.login-screen .btn.btn-primary {
  background-color: #07184f; /* brand-navy */
  border-color: #07184f;
  border-radius: 8px;
}

/* ── Logo (wordmark version for login) ─────────────────────────── */

.login-screen.is-clublocker .logo {
  background-image: url('/static/images/cl-logo/cl-logo-wordmark.svg');
  background-size: contain;
  background-position: center;
  max-width: 280px;
  height: 260px;
}

.logo-container {
  margin-top: 16px;
}
@media (min-height: 700px) {
  .logo-container {
    margin-top: 20px;
  }
}
@media (min-height: 800px) {
  .logo-container {
    margin-top: 40px;
  }
}

/* ── Mini shield — hidden on brand login, visible for white-label ─ */

.login-screen .shield-container .mini-shield {
  display: none;
}

/* ── "Learn more" CTA block ────────────────────────────────────── */

.learn-more-block {
  font-family: 'Funnel Display', Georgia, serif;
  margin-top: 50px;
}

.learn-more-block a {
  background: transparent;
  color: #07184f; /* brand-navy */
  border: 2px solid #07184f;
  border-radius: 100px;
  padding: 10px 36px;
}

/* ── Social login buttons ──────────────────────────────────────── */

.login-screen .btn-social {
  border-radius: 8px;
}

.login-screen .btn-facebook {
  background-color: #55658e; /* brand-light-blue */
  border-color: #55658e;
}

.login-screen .btn-google {
  background-color: #ff483a; /* brand-flash */
  border-color: #ff483a;
}

/* ── Links (exclude social buttons which have their own colors) ── */

.login-screen a:not(.btn-social) {
  color: #243a82; /* brand-mid-navy */
}