/* Login: back link and logo link to the landing page */
.auth-logo-link { display: block; width: fit-content; margin: 0 auto; border-radius: 0.5rem; }
.back-nav {
  display: inline-flex; align-items: center; gap: 0.35rem;
  margin: 0 0 0.75rem; padding: 0.35rem 0.5rem 0.35rem 0;
  font-family: var(--font-body); font-size: var(--fs-caption);
  color: var(--text-secondary); text-decoration: none;
}
.back-nav:hover { color: var(--text-primary); text-decoration: underline; }
.back-nav:focus-visible, .auth-logo-link:focus-visible { outline: 0.1875rem solid var(--brand); outline-offset: 0.125rem; }

/* Four roles (Teacher, Student, Parent, Admin) on one row */
.role-toggle { grid-template-columns: repeat(3, 1fr); gap: 4px; }
.role-btn[hidden] { display: none; }
.role-btn { padding: 10px 6px; }

/* Single-column auth pages (forgot / reset password): form centered on the page */
.auth-page--single { grid-template-columns: minmax(0, 1fr); container-type: normal; }
.auth-page--single .auth-rail { margin: 0 auto; width: 100%; max-width: 30rem; }

/* Touch targets: at least 44px tall (WCAG 2.2 recommends 44; minimum 24) */
.back-nav { min-height: 44px; }
.role-btn { min-height: 44px; }
.signup a { display: inline-block; padding: 0.75rem 0.25rem; }
nav[aria-label="Company and legal information"] a { display: inline-block; padding: 0.75rem 0.5rem; }
.skip-link:focus { min-height: 44px; }
.forgot { display: inline-block; padding: 0.75rem 0; min-height: 44px; box-sizing: border-box; }
.field-row { align-items: center; }

/* Phone: no empty band under the image (the slogan is hidden on phones) */
@media (max-width: 40rem) {
  .media-panel { min-height: 0; height: auto; }
  .media-image { height: auto; aspect-ratio: 3 / 2; }
}
