/**
 * Manager + Admin (Configuration Engine) login styles.
 * Dark navy ground (operator distinction) + indigo accents via school tokens.
 * Used by auth/manager_login.html and auth/admin_login.html.
 * Refreshed 2026-05-10: gold hover (#e0bc48) replaced with school-primary cascade.
 */

body {
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%, color-mix(in oklab, var(--school-primary) 18%, transparent), transparent 60%),
    var(--platform-navy, #0B0E14);
  min-height: 100vh;
}

.manager-login-landing,
.admin-login-landing {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 100%;
  min-height: min(100vh, 100%);
  min-height: min(100dvh, 100%);
  padding: 0;
}

body.control-plane-shell[data-rmc-cp-scroll="canvas"] #cp-main-content.manager-login-landing,
body.control-plane-shell[data-rmc-cp-scroll="canvas"] #cp-main-content.admin-login-landing {
  min-height: 0;
  flex: 1 1 auto;
}

/* Direct child of .cp-shell-content (not .cp-layout); must span the viewport width. */
body.control-plane-shell[data-rmc-cp-scroll="document"] #cp-main-content.manager-login-landing,
body.control-plane-shell[data-rmc-cp-scroll="document"] #cp-main-content.admin-login-landing {
  align-self: stretch !important;
  width: 100%;
  max-width: 100%;
}

.manager-login-landing__stage {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.25rem, 4vw, 2.5rem) 1rem clamp(1rem, 2vw, 1.5rem);
  width: 100%;
}

.manager-login-landing__signin {
  width: 100%;
  max-width: min(720px, 100%);
  margin-inline: auto;
}

/* Desktop: use full container width so layout doesn't look like mobile */
@media (min-width: 992px) {
  .manager-login-landing .container,
  .admin-login-landing .container { max-width: 720px; }
  .manager-login-hero,
  .admin-login-hero { padding: 2rem 2.5rem; }
  .manager-login-hero .hero-logo,
  .admin-login-hero .hero-logo {
    width: 56px; height: 56px; font-size: var(--type-size-headline-m);
  }
  .manager-login-hero strong,
  .admin-login-hero strong { font-size: var(--type-size-headline-m); }
  .manager-login-card,
  .admin-login-card { max-width: 440px; min-width: 380px; }
}

@media (min-width: 1200px) {
  .manager-login-landing .container,
  .admin-login-landing .container { max-width: 560px; }
  .manager-login-card,
  .admin-login-card { max-width: 460px; }
}

/* Hero strip — branded gradient hairline at the top, refined */
.manager-login-hero,
.admin-login-hero {
  border-radius: 16px;
  padding: 1.75rem 2rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  background: linear-gradient(135deg, rgba(26, 22, 18, 0.6), rgba(36, 30, 24, 0.4)); /* off-token-allow: decorative-gradient */
  -webkit-backdrop-filter: saturate(160%) blur(20px);
          backdrop-filter: saturate(160%) blur(20px);
  color: #f5eedd; /* off-token-allow: hex-literal-decorative */
  margin-bottom: 1.5rem;
  box-shadow: 0 0 0 1px rgba(168, 160, 146, 0.14), 0 12px 32px -4px rgba(0, 0, 0, 0.35);
  position: relative;
  overflow: hidden;
}
.manager-login-hero::before,
.admin-login-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--school-primary), var(--school-accent));
}

.manager-login-hero .hero-logo,
.admin-login-hero .hero-logo {
  width: 48px; height: 48px; border-radius: 12px;
  background: linear-gradient(135deg, var(--school-primary), color-mix(in oklab, var(--school-primary) 70%, var(--school-accent)));
  display: grid;
  place-items: center;
  font-size: var(--type-size-headline-m);
  font-weight: 700;
  color: #fff; /* off-token-allow: hex-literal-decorative */
  flex-shrink: 0;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset, 0 4px 12px rgba(0, 0, 0, 0.3);
}

.manager-login-hero strong,
.admin-login-hero strong {
  font-size: var(--type-size-body-l);
  font-weight: 700;
  letter-spacing: -0.015em;
  display: block;
}

.manager-login-hero small,
.admin-login-hero small {
  display: block;
  color: rgba(241, 245, 249, 0.78); /* off-token-allow: rgba-decorative */
  font-size: var(--type-size-caption);
  margin-top: 0.25rem;
  letter-spacing: -0.005em;
}

/* Card — refined glass on dark navy */
.manager-login-card,
.admin-login-card {
  border-radius: 16px !important;
  border: 1px solid rgba(168, 160, 146, 0.18) !important; /* off-token-allow: warm-neutral-overlay */
  background: rgba(11, 17, 32, 0.78) !important; /* off-token-allow: rgba-decorative */
  -webkit-backdrop-filter: saturate(160%) blur(20px);
          backdrop-filter: saturate(160%) blur(20px);
  box-shadow: 0 0 0 1px rgba(168, 160, 146, 0.10), 0 18px 48px -8px rgba(0, 0, 0, 0.45) !important;
  max-width: 100%;
  width: 100%;
  margin: 0 auto;
}

@media (max-width: 991.98px) {
  .manager-login-card,
  .admin-login-card { max-width: 420px; }
}

.manager-login-card .card-body,
.admin-login-card .card-body {
  background: transparent !important;
}

.manager-login-card h1,
.admin-login-card h1 {
  letter-spacing: -0.022em;
  font-weight: 700;
}

/* Form inputs — dark glass with indigo focus */
.manager-login-card .form-control,
.admin-login-card .form-control {
  border-radius: 10px;
  background: rgba(26, 22, 18, 0.6); /* off-token-allow: always-dark-warm-bg */
  border-color: rgba(168, 160, 146, 0.22); /* off-token-allow: warm-neutral-overlay */
  color: #e7eefc; /* off-token-allow: hex-literal-decorative */
  letter-spacing: -0.005em;
  font-weight: 500;
  padding: 10px 14px;
  transition: border-color var(--dur-fast, 150ms) ease, box-shadow var(--dur-fast, 150ms) ease, background var(--dur-fast, 150ms) ease;
}
.manager-login-card .form-control::placeholder,
.admin-login-card .form-control::placeholder { color: rgba(231, 238, 252, 0.5); /* off-token-allow: rgba-decorative */ }
.manager-login-card .form-control:focus,
.admin-login-card .form-control:focus {
  background: rgba(26, 22, 18, 0.85); /* off-token-allow: always-dark-warm-bg */
  border-color: color-mix(in oklab, var(--school-primary) 70%, transparent);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--school-primary) 22%, transparent);
}

.manager-login-card .form-label,
.admin-login-card .form-label {
  color: rgba(241, 245, 249, 0.82); /* off-token-allow: rgba-decorative */
  font-size: var(--type-size-caption);
  font-weight: 500;
  letter-spacing: -0.005em;
  margin-bottom: 6px;
}

/* Primary button — indigo (was gold #e0bc48) */
.manager-login-card .btn-primary,
.admin-login-card .btn-primary {
  background: var(--school-primary) !important;
  border: none !important;
  color: #fff !important; /* off-token-allow: hex-literal-decorative */
  font-weight: 600;
  padding: 11px 14px;
  border-radius: 10px;
  letter-spacing: -0.005em;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.14);
  transition: filter 150ms ease, transform 100ms ease, box-shadow 240ms ease;
}
.manager-login-card .btn-primary:hover,
.admin-login-card .btn-primary:hover {
  filter: brightness(1.06);
  box-shadow: 0 6px 18px -2px color-mix(in oklab, var(--school-primary) 45%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.manager-login-card .btn-primary:active,
.admin-login-card .btn-primary:active {
  transform: scale(0.98);
}

/* Footer link */
.manager-login-footer,
.admin-login-footer {
  margin-top: 1.5rem;
  text-align: center;
}
.manager-login-footer a,
.admin-login-footer a {
  color: rgba(168, 160, 146, 0.9); /* off-token-allow: warm-neutral-overlay */
  text-decoration: none;
  font-size: var(--type-size-caption);
  transition: color 150ms ease;
}
.manager-login-footer a:hover,
.admin-login-footer a:hover {
  color: var(--school-primary);
}

/* Validation + alerts on dark card */
.admin-login-card .form-control.is-invalid {
  border-color: rgba(248, 113, 113, 0.7); /* off-token-allow: rgba-decorative */
}
.admin-login-card .invalid-feedback { color: #fca5a5; /* off-token-allow: hex-literal-decorative */ }

.admin-login-card .admin-login-alert,
.manager-login-card .manager-login-alert,
.admin-login-card .alert-danger,
.admin-login-card .alert-warning,
.manager-login-card .alert-danger,
.manager-login-card .alert-warning {
  background: rgba(220, 38, 38, 0.14); /* off-token-allow: rgba-decorative */
  border: 1px solid rgba(248, 113, 113, 0.36); /* off-token-allow: rgba-decorative */
  color: #fca5a5; /* off-token-allow: hex-literal-decorative */
  border-radius: 10px;
}
.admin-login-card .alert-warning,
.manager-login-card .alert-warning {
  background: color-mix(in oklab, var(--school-accent) 14%, transparent);
  border-color: color-mix(in oklab, var(--school-accent) 36%, transparent);
  color: color-mix(in oklab, var(--school-accent) 85%, #fff);
}

/* Password reset link */
.admin-login-reset a,
.admin-login-card .admin-login-reset a {
  color: rgba(168, 160, 146, 0.9); /* off-token-allow: warm-neutral-overlay */
  text-decoration: none;
  font-size: var(--type-size-caption);
}
.admin-login-reset a:hover,
.admin-login-card .admin-login-reset a:hover {
  color: var(--school-primary);
  text-decoration: underline;
}

/* Compact operator footer styles: static/css/rmc-footer-surfaces.css */