@media screen {
  /* IE7 needs !important */

  body  {
    background-color:# !important;
  }

  /* ── Font ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&display=swap');

/* ── Page: white bg ── */
body,
.enrollment-login-wrapper,
.login-page-wrapper {
  background-color: #ffffff !important;
  font-family: 'Inter', sans-serif !important;
}

/* dot grid — teal tint */
.enrollment-login-wrapper::before,
body.login-page::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, #bee3e9 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
  opacity: 0.55 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* ── Login container ── */
.login-form-container,
.enrollment-login-card {
  background: #ffffff !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

/* ── Inputs ── */
.login-form input[type="email"],
.login-form input[type="password"],
.login-form input[type="text"] {
  border: 1.5px solid #ced4da !important;
  border-radius: 10px !important;
  background: #f8f9fa !important;
  height: 44px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  color: #212529 !important;
}
.login-form input:focus {
  border-color: #117a8d !important;
  background: #fff !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Input labels — small caps, teal */
.login-form label {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  color: #117a8d !important;
  text-transform: uppercase !important;
}

/* ── Sign In button ── */
.login-form .btn-primary,
.login-form button[type="submit"],
.login-submit-btn {
  background: #117a8d !important;
  border: none !important;
  border-radius: 12px !important;
  height: 50px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  font-family: 'Inter', sans-serif !important;
  letter-spacing: 0.01em !important;
  box-shadow: none !important;
  transition: background 0.15s !important;
}
.login-form .btn-primary:hover,
.login-submit-btn:hover {
  background: #0d5f6e !important;
}

/* ── OAuth buttons ── */
.google-signin-btn,
.microsoft-signin-btn,
.oauth-button {
  border: 1.5px solid #ced4da !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #343a40 !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.google-signin-btn:hover,
.microsoft-signin-btn:hover {
  border-color: #117a8d !important;
  background: #f8f9fa !important;
}

/* ── Create Account button ── */
.btn-secondary,
.create-account-btn {
  background: transparent !important;
  border: 1.5px solid #595959 !important;
  border-radius: 12px !important;
  color: #595959 !important;
  font-weight: 700 !important;
  font-family: 'Inter', sans-serif !important;
  box-shadow: none !important;
}
.btn-secondary:hover { background: #f8f9fa !important; }

/* ── Links ── */
.login-form a,
.forgot-password-link,
.resend-verification-link {
  color: #117a8d !important;
  font-weight: 500 !important;
}

/* ── Pill badge ── */
.login-page-banner {
  display: inline-block;
  border: 1.5px solid #adb5bd;
  border-radius: 999px;
  padding: 5px 18px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  color: #117a8d;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
}

  h1,
  h2,
  h3,
  .sa-form-title,
  .sa-form-nav-page-name,
  .sa-form-nav-pages-current i.fa-circle,
  .sa-form-field[data-flavor='section'],
  .sa-form-field[data-flavor='subsection']
  {
    color: #004aad;
  }

  section h2:first-of-type {
    border-bottom-color: #004aad;
  }

  #content-body {
    border-top-color: #004aad
  }

  .notification-alert {
    background-color: rgba(0, 74, 173, 0.1);
  }

  .notification-alert .notification-icon > i {
    color: #004aad;
  }

  .summary-communication > .notification-icon > .fa-bullhorn {
    color: #004aad;
  }

  li.page-item.active > a.page-link {
    background-color: #004aad
  }

  ul.header-actions > li > a > .header-action-label {
    color: #004aad
  }

  .student-summary-action-link {
    color: #004aad
  }

  button.btn-primary {
    background-color: #004aad
  }

  .ap-installment-list.table {
    .ap-installment-contact-highlight {
      background-color: #004aad
    }
  }
}