@font-face {
  font-family: National2;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/national2-web-regular.woff2') format('woff2');
}
@font-face {
  font-family: National2;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/national2-web-medium.woff2') format('woff2');
}
@font-face {
  font-family: National2;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/national2-web-bold.woff2') format('woff2');
}

[hidden] { display: none !important; }
.auth-preview-note,
.auth-status {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 12px 16px;
  border: 1px solid #ccced2;
  border-radius: 6px;
  background: #f5f9fa;
  color: #404756;
  font: 400 14px/1.5 National2, Arial, sans-serif;
  overflow-wrap: anywhere;
}
.auth-status { border-left: 4px solid #1f65d6; }
.auth-status:focus { outline: 2px solid #1f65d6; outline-offset: 3px; }
.auth-field-error {
  display: block;
  margin: 6px 0 0;
  color: #b81730;
  font: 400 14px/1.4 National2, Arial, sans-serif;
}
input[aria-invalid="true"],
select[aria-invalid="true"] { border-color: #b81730 !important; }
.auth-password-wrapper { position: relative; }
.auth-password-wrapper input { padding-right: 74px !important; }
.auth-password-toggle {
  position: absolute;
  top: 1px;
  right: 1px;
  height: 38px;
  padding: 0 12px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #1f65d6;
  cursor: pointer;
  font: 500 14px National2, Arial, sans-serif;
  display: none;
}
.auth-password-toggle:focus-visible { outline: 2px solid #1f65d6; outline-offset: -3px; }
button:disabled { cursor: not-allowed; opacity: .6; }
.auth-edit-button {
  padding: 10px 18px;
  border: 1px solid #1f65d6;
  border-radius: 5px;
  background: #fff;
  color: #1f65d6;
  font: inherit;
  cursor: pointer;
}
.auth-confirmation { display: flex; flex-direction: column; gap: 20px; }
.auth-confirmation h2 { margin: 0; color: #000856; font-size: 28px; }
.auth-confirmation p { margin: 0; font-size: 17px; line-height: 1.5; }

/* The static snapshot cannot rely on React to draw checkbox and select state. */
[data-auth-page="signup"] .iYYCCO { display: block; width: 100%; height: auto; }
[data-auth-page="signup"] input[type="checkbox"]:checked + label .jsrHJy {
  background: #1f65d6;
  border-color: #1f65d6;
  position: relative;
}
[data-auth-page="signup"] input[type="checkbox"]:checked + label .jsrHJy::after {
  content: '';
  position: absolute;
  width: 5px;
  height: 10px;
  left: 6px;
  top: 2px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
[data-auth-page="signup"] select[aria-invalid="true"] + .auth-field-error { position: relative; }
[data-auth-page="signup"] .Select__Wrapper-sc-70551a0c-0:has(select[aria-invalid="true"]) .Select__Display-sc-70551a0c-3 {
  border-color: #b81730;
}
[data-auth-page="signup"] .auth-preview-note { margin-bottom: 24px; }
[data-auth-page="signup"] .auth-status { margin-top: 20px; }
.xl-newux--formpanel-inner { min-width: 0; }
.xl-newux--detail { margin: 8px 0 0; font-size: 15px; line-height: 24px; color: #404756; }
.xl-preview-banner--text { min-width: 0; }
.xl-newux--field input[type="email"] { font-family: inherit; }

@media (max-width: 640px) {
  .xl-preview-banner { flex-wrap: wrap; padding: 12px; }
  .xl-preview-banner--text { flex: 1 1 180px; }
  .xl-newux--footer { padding-top: 48px; gap: 12px 20px; }
  .xl-newux--heading { font-size: 28px; line-height: 36px; }
  .xl-newux--split .xl-newux--actionrow { gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
