/* Saint Josephs: a quiet school morning, with sign-in always in the foreground. */
.sunrise-signin {
  --login-canvas: #fbfaf6;
  --login-text: #172a43;
  --login-muted: #526078;
  --login-surface: #ffffff;
  --login-border: #c3ccda;
  --login-soft: #edf1f7;
  --login-action: #244dc8;
  --login-action-hover: #183da9;
  --login-focus: #244dc8;
  --scene-text: #ffffff;
  --scene-veil: #0b1d30;
  --scene-accent: #e4c486;
  background: var(--login-canvas);
  color: var(--login-text);
  min-height: 100svh;
}
[data-theme="dark"] .sunrise-signin {
  --login-canvas: #101b2b;
  --login-text: #f2f5fa;
  --login-muted: #b7c4d7;
  --login-surface: #18273c;
  --login-border: #60728d;
  --login-soft: #1e3048;
  --login-action: #4067e2;
  --login-action-hover: #3358cf;
  --login-focus: #9ab5ff;
}
.sunrise-signin .sunrise-auth {
  display: grid;
  grid-template-columns: 52% minmax(0, 1fr);
  min-height: 100svh;
  height: auto;
}
.sunrise-signin-panel {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px clamp(32px, 5vw, 100px) 72px;
  background: var(--login-canvas);
}
.sunrise-form-wrap { width: 100%; max-width: 420px; }
.sunrise-form-brand { text-align: center; margin-bottom: 28px; }
.sunrise-form-brand img.sunrise-school-logo { width: 96px; height: 96px; }
.sunrise-form-eyebrow { font-size: 12px; line-height: 1.5; letter-spacing: .16em; font-weight: 700; color: var(--login-muted); margin-bottom: 12px; }
.sunrise-signin h1 { color: var(--login-text); font-size: clamp(30px, 2.5vw, 38px); line-height: 1.16; letter-spacing: -.035em; font-weight: 700; }
.sunrise-signin .sunrise-form-body p, .sunrise-form-footer { color: var(--login-muted); font-size: 14px; line-height: 1.6; }
.sunrise-signin .form-label { color: var(--login-text); font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.sunrise-signin .form-control { background: var(--login-surface); border-color: var(--login-border); color: var(--login-text); min-height: 48px; border-radius: 10px; font-size: 14px; }
.sunrise-signin .input-group .form-control { border-start-end-radius: 0; border-end-end-radius: 0; }
.sunrise-signin .input-icon-addon { color: var(--login-muted); }
.sunrise-signin #show-password { width: 48px; border-color: var(--login-border); color: var(--login-action); background: var(--login-surface); border-radius: 0 10px 10px 0; }
.sunrise-signin .btn-primary { background: var(--login-action); border-color: var(--login-action); color: #fff; min-height: 48px; border-radius: 10px; font-size: 15px; font-weight: 600; box-shadow: none; }
.sunrise-signin .btn-primary:hover { background: var(--login-action-hover); border-color: var(--login-action-hover); }
.sunrise-signin #demo-credentials { padding: 14px 16px; background: var(--login-soft) !important; border: 1px solid var(--login-border) !important; border-radius: 10px; color: var(--login-text); font-size: 13px; line-height: 1.65; }
.sunrise-signin #demo-credentials p { color: var(--login-muted); font-size: 12px; }
.sunrise-signin #demo-error { color: #b42318 !important; }
[data-theme="dark"] .sunrise-signin #demo-error { color: #fda29b !important; }
.sunrise-signin :is(button, input, a):focus-visible { outline: 3px solid var(--login-focus); outline-offset: 3px; }
.sunrise-form-footer { text-align: center; margin-top: 28px; }
.sunrise-form-footer p { margin: 0; font-size: 12px; letter-spacing: .02em; }
.sunrise-scene {
  grid-column: 1;
  grid-row: 1;
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 620px;
  isolation: isolate;
  overflow: hidden;
  background: var(--scene-veil);
  color: var(--scene-text);
}
.sunrise-scene-photo { position: absolute; inset: -1px; background: url('../img/authentication/sunrise-learning.jpg') center center / cover no-repeat; transform: scale(1.03); animation: sunrise-school-morning 24s ease-in-out infinite alternate; will-change: transform; }
@keyframes sunrise-school-morning { from { transform: scale(1.03) translate3d(-.5%, .4%, 0); } to { transform: scale(1.09) translate3d(.6%, -.5%, 0); } }
.sunrise-scene-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,29,48,.55) 0%, rgba(11,29,48,.03) 35%, rgba(11,29,48,.18) 48%, rgba(11,29,48,.91) 100%); }
.sunrise-scene-top { position: absolute; inset: 36px 40px auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.sunrise-scene-wordmark { font-size: 18px; letter-spacing: .18em; font-weight: 700; line-height: 1.35; }
.sunrise-scene-wordmark span { display: block; font-size: 10px; font-weight: 500; letter-spacing: .42em; }
.sunrise-scene-edition { font-size: 11px; letter-spacing: .06em; color: var(--scene-text); }
.sunrise-scene-copy { position: absolute; inset: auto 40px 104px; max-width: 620px; }
.sunrise-scene-kicker { display: block; font-size: 11px; line-height: 1.5; letter-spacing: .2em; font-weight: 600; margin-bottom: 20px; color: var(--scene-accent); }
.sunrise-scene-kicker::before { content: ''; display: inline-block; width: 32px; height: 2px; margin-inline-end: 12px; vertical-align: middle; background: currentColor; }
.sunrise-scene h2 { color: var(--scene-text); font-size: clamp(36px, 3.45vw, 62px); line-height: 1.1; letter-spacing: -.04em; font-weight: 600; margin-bottom: 20px; }
.sunrise-scene-copy p { max-width: 360px; font-size: 15px; line-height: 1.65; color: var(--scene-text); margin: 0; }
.sunrise-motion-toggle { position: absolute; bottom: 32px; left: 40px; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.5); border-radius: 6px; background: rgba(11,29,48,.8); color: var(--scene-text); font-size: 12px; line-height: 1.5; }
.sunrise-motion-toggle:hover { background: #0b1d30; }
.sunrise-signin .sunrise-motion-toggle:focus-visible { outline-color: #fff; }
.sunrise-scene[data-paused="true"] .sunrise-scene-photo { animation-play-state: paused; }
@media (max-width: 1199px) { .sunrise-scene-top { inset-inline: 28px; } .sunrise-scene-copy { inset-inline: 28px; } .sunrise-motion-toggle { left: 28px; } .sunrise-scene-edition { display: none; } }
@media (max-width: 991.98px) {
  .sunrise-signin .sunrise-auth { display: block; }
  .sunrise-scene { display: none; }
  .sunrise-scene-photo { background-image: none; animation: none; will-change: auto; }
  .sunrise-signin-panel { min-height: 100svh; padding: 36px 24px 144px; }
}
@media (prefers-reduced-motion: reduce) { .sunrise-scene-photo { animation: none; transform: none; will-change: auto; } .sunrise-motion-toggle { display: none; } }
/* The template's dark theme uses !important; keep login roles authoritative. */
[data-theme="dark"] .sunrise-signin :is(#email-address, #password) {
  color: var(--login-text) !important; background: var(--login-surface) !important; border-color: var(--login-border) !important;
}
[data-theme="dark"] .sunrise-signin #show-password {
  color: var(--login-focus) !important; border-color: var(--login-border) !important;
}
[data-theme="dark"] .sunrise-signin .sunrise-scene :is(.sunrise-scene-wordmark, .sunrise-scene-edition, h2, p, .sunrise-motion-toggle) { color: var(--scene-text) !important; }
